1668488 - "WebDriver:ElementClick" fails for SVG <g> elements because it's not in the pointer-interactable paint tree

Status: NEW

(Remote Protocol :: Marionette, defect, P3)

Description

[evgeniy_meaFire]

Attachment: htmlDocument.png

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.121 Safari/537.36

Steps to reproduce:

FireFoxDriver:

• driverVersion - 81.0
• seleniumVersion - 3.141.59
• os - windows 10
• java.version: '1.8.0_221'

Steps:

1. Find webElement with tag <g> (dom is in attachment)

2. Execute - weElement.click

Actual results:

org.openqa.selenium.ElementNotInteractableException: Element <g id="__GTOODg8__seat:17" class="branded"> could not be scrolled into view
Build info: version: '3.141.59', revision: 'e82be7d358', time: '2018-11-14T08:17:03'

Expected results:

Click on <g> must be executable.

Comment 1

[Robert Longson [:longsonr]]

click is a HTML method, SVG elements such as <g> don't support it per the relevant specifications. You can send a click event to them as a workaround as click() is merely a convenience method.

Comment 2

[evgeniy_meaFire]

Its strange.
I send webElement.click() to webElement with tag <g>.

In chromeDriver its works fine, but firefox get this error.
In crossBrowser testing its look like crutch.

Comment 3

[Robert Longson [:longsonr]]

See https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click and https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement i.e. click() is HTML only, it would need to be moved to the superclass Element interface if it were to work on SVG and that would require a specification change.

Comment 4

[evgeniy_meaFire]

(In reply to Robert Longson [:longsonr] from comment #3)

See https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click and https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement i.e. click() is HTML only, it would need to be moved to the superclass Element interface if it were to work on SVG and that would require a specification change.

Can you do that? (move to superclass and change specification).
It will be great!

Comment 5

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Please note that the reporter is referencing the click() method in Selenium, which actually maps to Element Click in the WebDriver specification. Basically click should work but as the error could not be scrolled into view says the element is outside of the viewport and cannot be scrolled into it.

Please create a trace log for geckodriver and attach the output on this bug. Also which web site are you testing here? If it's not publicly available can you create a minimized HTML? Thanks.

Comment 6

[evgeniy_meaFire]

1601561280870 webdriver::server DEBUG -> POST /session/09094df7-2aec-42cd-991b-0ce83556010a/execute/sync {
"script": "arguments[0].style.border='4px solid red'",
"args": [
{
"ELEMENT": "db0a0124-75ed-467d-9d24-72337ff7dbff",
"element-6066-11e4-a52e-4f735466cecf": "db0a0124-75ed-467d-9d24-72337ff7dbff"
}
]
}
1601561280872 Marionette DEBUG 0 -> [0,357,"WebDriver:ExecuteScript",{"args":[{"ELEMENT":"db0a0124-75ed-467d-9d24-72337ff7dbff","element-6066-11e4-a52e-4f735466cecf":"db0a0124-75ed-467d-9d24-72337ff7dbff"}],"script":"arguments[0].style.border='4px solid red'"}]
1601561280878 Marionette DEBUG 0 <- [1,357,null,{"value":null}]
1601561280878 webdriver::server DEBUG <- 200 OK {"value":null}
1601561280902 webdriver::server DEBUG -> POST /session/09094df7-2aec-42cd-991b-0ce83556010a/execute/sync {
"script": "arguments[0].scrollIntoView(true);",
"args": [
{
"ELEMENT": "db0a0124-75ed-467d-9d24-72337ff7dbff",
"element-6066-11e4-a52e-4f735466cecf": "db0a0124-75ed-467d-9d24-72337ff7dbff"
}
]
}
1601561280904 Marionette DEBUG 0 -> [0,358,"WebDriver:ExecuteScript",{"args":[{"ELEMENT":"db0a0124-75ed-467d-9d24-72337ff7dbff","element-6066-11e4-a52e-4f735466cecf":"db0a0124-75ed-467d-9d24-72337ff7dbff"}],"script":"arguments[0].scrollIntoView(true);"}]
1601561280907 Marionette DEBUG 0 <- [1,358,null,{"value":null}]
1601561280907 webdriver::server DEBUG <- 200 OK {"value":null}
1601561280917 webdriver::server DEBUG -> POST /session/09094df7-2aec-42cd-991b-0ce83556010a/element/db0a0124-75ed-467d-9d24-72337ff7dbff/click {
"id": "db0a0124-75ed-467d-9d24-72337ff7dbff"
}
1601561280918 Marionette DEBUG 0 -> [0,359,"WebDriver:ElementClick",{"id":"db0a0124-75ed-467d-9d24-72337ff7dbff"}]
1601561280927 Marionette DEBUG 0 <- [1,359,{"error":"element not interactable","message":"Element <g id="__GTOODg8__seat:24" class="branded"> could not be sc ... vigate@chrome://marionette/content/listener.js:447:11\nclickElement@chrome://marionette/content/listener.js:1331:24\n"},null]
1601561280926 webdriver::server DEBUG <- 400 Bad Request {"value":{"error":"element not interactable","message":"Element <g id="__GTOODg8__seat:24" class="branded"> could not be scrolled into view","stacktrace":"WebDriverError@chrome://marionette/content/error.js:175:5\nElementNotInteractableError@chrome://marionette/content/error.js:285:5\nwebdriverClickElement@chrome://marionette/content/interaction.js:159:11\ninteraction.clickElement@chrome://marionette/content/interaction.js:131:11\nclickElement/<@chrome://marionette/content/listener.js:1333:28\nnavigate@chrome://marionette/content/listener.js:447:11\nclickElement@chrome://marionette/content/listener.js:1331:24\n"}}

Comment 7

[evgeniy_meaFire]

Attachment: part.html

Comment 8

[evgeniy_meaFire]

(In reply to Henrik Skupin (:whimboo) [⌚️UTC+2] from comment #5)

Please note that the reporter is referencing the click() method in Selenium, which actually maps to Element Click in the WebDriver specification. Basically click should work but as the error could not be scrolled into view says the element is outside of the viewport and cannot be scrolled into it.

Please create a trace log for geckodriver and attach the output on this bug. Also which web site are you testing here? If it's not publicly available can you create a minimized HTML? Thanks.

Part of html and geckoTrace attached.

Comment 9

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Attachment: Simplified HTML

The problem here is that the SVG group element (g) is not part of the paint tree (elementsFromPoint), and as such it's marked as not interactable. If you would interact with the text element instead, the click would work.

Here the paint tree for the minimized HTML:

<text id="text">
<svg>
<body>
<html>

Sean, could you please help us to understand why g doesn't appear in the paint tree? Looks like Chrome does it, so that we have a web compat issue here. Thanks.

Comment 10

[Sean Voisen (:svoisen)]

(In reply to Henrik Skupin (:whimboo) [⌚️UTC+2] from comment #9)

Sean, could you please help us to understand why g doesn't appear in the paint tree? Looks like Chrome does it, so that we have a web compat issue here. Thanks.

Maybe longsonr or heycam can answer this.

Comment 11

[Robert Longson [:longsonr]]

Because it's just a container (unless it has the style pointer-events: bounding-box, which Firefox does not currently support). You can only click on a container's contents modulo the aforementioned special value for pointer-events.

Comment 12

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Ok, so we determine the element interactability here:
https://searchfox.org/mozilla-central/rev/222e4f64b769413ac1a1991d2397b13a0acb5d9d/testing/marionette/element.js#1152-1169

It means we set pointerEvents of the element to auto. Would that cover a possible later implementation of pointer-events: bounding-box at a later time without having to modify the Marionette code? If yes, is there a bug for getting pointer-events: bounding-box support added to Firefox?

Comment 13

[Henrik Skupin [:whimboo][⌚️UTC+1]]

(In reply to Henrik Skupin (:whimboo) [⌚️UTC+2] from comment #12)

is there a bug for getting pointer-events: bounding-box support added to Firefox?

Actually this is bug 945187.

evgeniy_meaFire, if you want to get it working you have two options right now:

1. Change your code to not click on the group but the text element. That should work cross-browser.
2. Turn off the moz:webDriverClick capability. But then you won't have actual WebDriver behavior for Element Click.

Comment 14

[evgeniy_meaFire]

(In reply to Henrik Skupin (:whimboo) [⌚️UTC+2] from comment #13)

(In reply to Henrik Skupin (:whimboo) [⌚️UTC+2] from comment #12)

is there a bug for getting pointer-events: bounding-box support added to Firefox?

Actually this is bug 945187.

evgeniy_meaFire, if you want to get it working you have two options right now:

1. Change your code to not click on the group but the text element. That should work cross-browser.
2. Turn off the moz:webDriverClick capability. But then you won't have actual WebDriver behavior for Element Click.

Thank you!

But will this issue fied?

Comment 15

[Henrik Skupin [:whimboo][⌚️UTC+1]]

(In reply to evgeniy_meaFire from comment #14)

But will this issue fied?

It depends on the progress on bug 945187. But that's outside of my scope.

Comment 16

[Robert Longson [:longsonr]]

Note that pointer-events: auto is the same as pointer-events: visiblePainted with or without bounding-box support so setting it to auto won't help.

Comment 17

[Henrik Skupin [:whimboo][⌚️UTC+1]]

We currently have auto set. Would all be a better option then?

Comment 18

[Robert Longson [:longsonr]]

Wouldn't sending clicks to visibility: hidden elements be surprising? Does Chrome allow visibility:hidden elements to be targetted?

Comment 19

[Henrik Skupin [:whimboo][⌚️UTC+1]]

Yes, synthesizing the click on a group element triggers the click event. I assume that happens because via Selenium a click happens not on the element but at a point on screen, and as such it would fall through to the text node. Given that g is part of the paint tree in Chrome the click doesn't cause a not interactable error.