Skip to content

[🐛 Bug]: moveTo can't move pointer to element inside of iframe #11534

@udarrr

Description

@udarrr

Have you read the Contributing Guidelines on issues?

WebdriverIO Version

latest

Node.js Version

18

Mode

WDIO Testrunner

Which capabilities are you using?

No response

What happened?

  1. moveTo method can't move pointer to element inside of iframe properly
  2. moveTo method don't scroll page to element into view that's why element out of bounds

What is your expected behavior?

  1. pointer on element inside of iframe point at right place
  2. it's been scrolled to element when is called moveTo

How to reproduce the bug.

here is simple repo with reproduceable an example https://github.com/udarrr/moveToExample

Relevant log output

DevTools listening on ws://127.0.0.1:62290/devtools/browser/86da7148-6e3d-4ffc-ae63-ad05db800f6f
[0-0] 2023-10-25T18:12:42.955Z INFO webdriver: COMMAND navigateTo("https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe")
[0-0] 2023-10-25T18:12:42.955Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/url
[0-0] 2023-10-25T18:12:42.955Z INFO webdriver: DATA {
[0-0]   url: 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe'
[0-0] }
[0-0] 2023-10-25T18:12:49.893Z INFO webdriver: RESULT null
[0-0] 2023-10-25T18:12:49.897Z INFO webdriver: COMMAND findElement("css selector", "#root div.theme-switcher-menu > button > span")
[0-0] 2023-10-25T18:12:49.897Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/element
[0-0] 2023-10-25T18:12:49.898Z INFO webdriver: DATA {
[0-0]   using: 'css selector',
[0-0]   value: '#root div.theme-switcher-menu > button > span'
[0-0] }
[0-0] 2023-10-25T18:12:49.919Z INFO webdriver: RESULT {
[0-0]   'element-6066-11e4-a52e-4f735466cecf': '441DCA80882DB00CC92127F541A59DE4_element_38'
[0-0] }
[0-0] 2023-10-25T18:12:49.934Z INFO webdriver: COMMAND getElementRect("441DCA80882DB00CC92127F541A59DE4_element_38")
[0-0] 2023-10-25T18:12:49.935Z INFO webdriver: [GET] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/element/441DCA80882DB00CC92127F541A59DE4_element_38/rect
[0-0] 2023-10-25T18:12:49.966Z INFO webdriver: RESULT { height: 28, width: 72, x: 639.4625244140625, y: 72 }
[0-0] 2023-10-25T18:12:49.967Z INFO webdriver: COMMAND executeScript(<fn>, <object>)
[0-0] 2023-10-25T18:12:49.968Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/execute/sync
[0-0] 2023-10-25T18:12:49.968Z INFO webdriver: DATA {
[0-0]   script: 'return (function () {\n' +
[0-0]     '        return { scrollX: this.pageXOffset, scrollY: this.pageYOffset };\n' +
[0-0]     '    }).apply(null, arguments)',
[0-0]   args: []
[0-0] }
[0-0] 2023-10-25T18:12:49.981Z INFO webdriver: RESULT { scrollX: 0, scrollY: 0 }
[0-0] 2023-10-25T18:12:49.983Z INFO webdriver: COMMAND performActions(<object>)
[0-0] 2023-10-25T18:12:49.983Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/actions
[0-0] 2023-10-25T18:12:49.983Z INFO webdriver: DATA {
[0-0]   actions: [
[0-0]     {
[0-0]       id: 'action1',
[0-0]       type: 'pointer',
[0-0]       parameters: [Object],
[0-0]       actions: [Array]
[0-0]     }
[0-0]   ]
[0-0] }
[0-0] 2023-10-25T18:12:50.111Z INFO webdriver: RESULT null
[0-0] 2023-10-25T18:12:50.112Z INFO webdriver: COMMAND releaseActions()
[0-0] 2023-10-25T18:12:50.112Z INFO webdriver: [DELETE] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/actions
[0-0] 2023-10-25T18:12:50.120Z INFO webdriver: RESULT null
[0-0] 2023-10-25T18:12:55.126Z INFO webdriver: COMMAND findElement("css selector", "#content > article > section:nth-child(3) > div > iframe")
[0-0] 2023-10-25T18:12:55.127Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/element
[0-0] 2023-10-25T18:12:55.127Z INFO webdriver: DATA {
[0-0]   using: 'css selector',
[0-0]   value: '#content > article > section:nth-child(3) > div > iframe'
[0-0] }
[0-0] 2023-10-25T18:12:55.159Z INFO webdriver: RESULT {
[0-0]   'element-6066-11e4-a52e-4f735466cecf': '441DCA80882DB00CC92127F541A59DE4_element_22'
[0-0] }
[0-0] 2023-10-25T18:12:55.166Z INFO webdriver: COMMAND switchToFrame(<object>)
[0-0] 2023-10-25T18:12:55.167Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/frame
[0-0] 2023-10-25T18:12:55.167Z INFO webdriver: DATA {
[0-0]   id: Element {
[0-0]     sessionId: '4c2e4f3f82759c933eafebc95a8473ae',
[0-0]     elementId: '441DCA80882DB00CC92127F541A59DE4_element_22',
[0-0]     'element-6066-11e4-a52e-4f735466cecf': '441DCA80882DB00CC92127F541A59DE4_element_22',
[0-0]     selector: '#content > article > section:nth-child(3) > div > iframe',
[0-0]     parent: Browser {
[0-0]       sessionId: '4c2e4f3f82759c933eafebc95a8473ae',
[0-0]       capabilities: [Object],
[0-0]       addCommand: [Function (anonymous)],
[0-0]       overwriteCommand: [Function (anonymous)],
[0-0]       addLocatorStrategy: [Function (anonymous)]
[0-0]     },
[0-0]     emit: [Function: bound ],
[0-0]     isReactElement: false,
[0-0]     isShadowElement: false,
[0-0]     addCommand: [Function (anonymous)],
[0-0]     overwriteCommand: [Function (anonymous)]
[0-0]   }
[0-0] }
[0-0] 2023-10-25T18:12:55.197Z INFO webdriver: RESULT null
[0-0] 2023-10-25T18:12:55.198Z INFO webdriver: COMMAND findElement("css selector", "#reset")
[0-0] 2023-10-25T18:12:55.199Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/element
[0-0] 2023-10-25T18:12:55.199Z INFO webdriver: DATA { using: 'css selector', value: '#reset' }
[0-0] 2023-10-25T18:12:55.211Z INFO webdriver: RESULT {
[0-0]   'element-6066-11e4-a52e-4f735466cecf': 'B78F8F73B62890BD9C5C7AFC2BD157AC_element_5'
[0-0] }
[0-0] 2023-10-25T18:12:55.215Z INFO webdriver: COMMAND getElementRect("B78F8F73B62890BD9C5C7AFC2BD157AC_element_5")
[0-0] 2023-10-25T18:12:55.216Z INFO webdriver: [GET] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/element/B78F8F73B62890BD9C5C7AFC2BD157AC_element_5/rect
[0-0] 2023-10-25T18:12:55.227Z INFO webdriver: RESULT { height: 32, width: 57, x: 525.1500244140625, y: 8.800000190734863 }
[0-0] 2023-10-25T18:12:55.228Z INFO webdriver: COMMAND executeScript(<fn>, <object>)
[0-0] 2023-10-25T18:12:55.228Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/execute/sync
[0-0] 2023-10-25T18:12:55.228Z INFO webdriver: DATA {
[0-0]   script: 'return (function () {\n' +
[0-0]     '        return { scrollX: this.pageXOffset, scrollY: this.pageYOffset };\n' +
[0-0]     '    }).apply(null, arguments)',
[0-0]   args: []
[0-0] }
[0-0] 2023-10-25T18:12:55.235Z INFO webdriver: RESULT { scrollX: 0, scrollY: 0 }
[0-0] 2023-10-25T18:12:55.235Z INFO webdriver: COMMAND performActions(<object>)
[0-0] 2023-10-25T18:12:55.236Z INFO webdriver: [POST] http://0.0.0.0:62279/session/4c2e4f3f82759c933eafebc95a8473ae/actions
[0-0] 2023-10-25T18:12:55.236Z INFO webdriver: DATA {
[0-0]   actions: [
[0-0]     {
[0-0]       id: 'action2',
[0-0]       type: 'pointer',
[0-0]       parameters: [Object],
[0-0]       actions: [Array]
[0-0]     }
[0-0]   ]
[0-0] }

Code of Conduct

  • I agree to follow this project's Code of Conduct

Is there an existing issue for this?

  • I have searched the existing issues

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions