Not correctly move pointer to the position inside of element in bridge mode.

[ahmoleg]

Meta -

OS: Windows 8

Selenium Webdriver: 4.0.0-alpha.1

Browser: Chrome

Browser Version: 68.0.3440.106

Expected Behavior -

I am trying move pointer to the position inside of canvas element in bridge mode.

Actual Behavior -

Pointer moved to the center of canvas element.

Steps to reproduce -

const Webdriver = require('selenium-webdriver');
const Capabilities = require('selenium-webdriver/lib/capabilities').Capabilities;

var capabilities = new Capabilities();
capabilities.set('browserName', 'chrome');
var browser = new Webdriver.Builder()
    .withCapabilities(capabilities)
    .build(); 
browser.get(host)
    .then(() => {
        browser.findElement(by.tagName('canvas'))
        .then(elem =>{
            browser
                .actions({
                    bridge:true
                })
                .move({
                    origin: elem,
                    x:10,//for example
                    y:10
                })
                .click()
                .perform()
        })
    });

How I fix it -

selenium/javascript/node/selenium-webdriver/lib/input.js
row: 1148
x and y returned float. Simple parseInt() resolve this problem.

Documentation -

http://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/input_exports_Actions.html
You write:
"6. For W3C actions, move offsets relative to a WebElement are interpretted relative to the center of an element's first client rect in the viewport. For legacy actions, element offsets are relative to the top-left corner of the element's bounding client rect. When translating actions to the legacy protocol in bridge mode, an extra command must be inserted to translate move offsets from one frame of reference to the other. This extra command conributes to the overall latency issue outlined in point 1."

BUT you alredy do it in selenium/javascript/node/selenium-webdriver/lib/input.js; row: 1144 and no extra command must be inserted to translate move offsets.

[lotosotol]

I have this same issue as well with Selenium 4.0.0-alpha.1 / Mocha 5.2.0 / ES6. Used it for long time but never encountered the issue until now:

const element = await driver.findElement(By.css(cssLocator));
const actions = await driver.actions({bridge: true});
await actions.move({duration: 5000, origin: element[0], x: 0, y: 0}).perform();

UnsupportedOperationError: pointer movements relative to viewport are not supported in bridge mode
at executeLegacy (node_modules\selenium-webdriver\lib\input.js:1129:17)
at Actions.perform (node_modules\selenium-webdriver\lib\input.js:971:16)
at
at process._tickCallback (internal/process/next_tick.js:189:7)

[lotosotol]

I have this same issue as well with Selenium 4.0.0-alpha.1 / Mocha 5.2.0 / ES6. Used it for long time but never encountered the issue until now:

const element = await driver.findElement(By.css(cssLocator));
const actions = await driver.actions({bridge: true});
await actions.move({duration: 5000, origin: element[0], x: 0, y: 0}).perform();

UnsupportedOperationError: pointer movements relative to viewport are not supported in bridge mode
at executeLegacy (node_modules\selenium-webdriver\lib\input.js:1129:17)
at Actions.perform (node_modules\selenium-webdriver\lib\input.js:971:16)
at
at process._tickCallback (internal/process/next_tick.js:189:7)

upsss.. found the issue:
await actions.move({duration: 5000, origin: element[0], x: 0, y: 0}).perform();
should be:
await actions.move({duration: 5000, origin: element, x: 0, y: 0}).perform();

[isthisstackoverflow]

For current (4.0.0-alpha.5) webdriver:

The script below will work in Firefox, but not in Chrome, despite having bridge mode on. I suspect it's the same issue as OP's, since I'm trying to work with a canvas element, too.

To Reproduce

On an arbitrary OpenLayers map, e.g. https://openlayers.org/en/latest/examples/accessible.html, run

// In an async function
const viewport = await driver.findElement(By.css(".ol-viewport"));

await driver.actions({bridge: true})
    .move({origin: viewport})
    .press(webdriver.Button.LEFT)
    .move({origin: viewport, x: 10, y: 10})
    .release(webdriver.Button.LEFT)
    .perform();

Expected behavior

Map should pan. Happens in Firefox, but not in Chrome. (Hence I assume it's a bug regarding bridge mode.)

Environment

OS: Windows 10
Browser: Chrome
Browser version: 78.0.3904.108
Browser Driver version: 78.0.3904.105 https://chromedriver.storage.googleapis.com/index.html?path=78.0.3904.105/
Language Bindings version: Node 12.13.0

About Fix

The fix as outlined by OP (adding parseInt) does not work for me. If any reader knows about a workaround, please let me know.

[diemol]

If this is working in Firefox and not in Chrome, it might be a Chrome/ChromeDriver issue.

Is this issue still happening with the most recent versions of Firefox, Chrome and Selenum WebDriver?

[diemol]

Closing this as we did not get more information, please feel free to open a new issue if the problem still persists after trying with the most recent versions.