shadow_root issues with sendkey() in FF113b8

[fenchu]

System

• Version: 0.33.0
• Platform: windows11
• Firefox: FF 113.0b8
• Selenium: python 4.9.0

Testcase

I have problems with this sendkey. it just never work while chromium never has a problem.

to make chromium code work on FF we have to add explicit call directly for each element, while chromium can do one shadow_root and pick any elements from it. But this is no problem it can be fixed.

el = wd.find_element(By.XPATH, "//bp-datepicker[@id='input-expiry-date']").shadow_root.find_element(By.CSS_SELECTOR, "input.bp-datepicker")
el.send_keys(expdate)

See picture for the html layout of the :shadow_root.

Stacktrace

No crash, it just continue, but my code will not continue unless it has a valid date :-)

Trace-level log

1682519080815   webdriver::server   DEBUG   <- 200 OK {"value":{"element-6066-11e4-a52e-4f735466cecf":"b4b4ff16-7b25-497e-ac0b-c2ff8ce6b61c"}}
1682519080817   webdriver::server   DEBUG   -> POST /session/8d3e57ea-ce51-40df-b050-99192bdfe2f4/element/b4b4ff16-7b25-497e-ac0b-c2ff8ce6b61c/value {"text": "12345678901", "value": ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "1"], "id": "b4b4ff16-7b25-497e-ac0b-c2ff8ce6b61c"}
1682519080818   Marionette  DEBUG   0 -> [0,68,"WebDriver:ElementSendKeys",{"id":"b4b4ff16-7b25-497e-ac0b-c2ff8ce6b61c","text":"12345678901","value":["1","2","3","4","5","6","7","8","9","0","1"]}]
1682519080828   Marionette  DEBUG   0 <- [1,68,null,{"value":null}]
1682519080828   webdriver::server   DEBUG   <- 200 OK {"value":null}
1682519080831   webdriver::server   DEBUG   -> POST /session/8d3e57ea-ce51-40df-b050-99192bdfe2f4/element {"using": "xpath", "value": "//bp-datepicker[@id='input-expiry-date']"}
1682519080832   Marionette  DEBUG   0 -> [0,69,"WebDriver:FindElement",{"using":"xpath","value":"//bp-datepicker[@id='input-expiry-date']"}]
1682519080833   Marionette  DEBUG   0 <- [1,69,null,{"value":{"element-6066-11e4-a52e-4f735466cecf":"9f725127-b44a-4f4f-8900-bf5b1d0b5254"}}]
1682519080834   webdriver::server   DEBUG   <- 200 OK {"value":{"element-6066-11e4-a52e-4f735466cecf":"9f725127-b44a-4f4f-8900-bf5b1d0b5254"}}
1682519080835   webdriver::server   DEBUG   -> GET /session/8d3e57ea-ce51-40df-b050-99192bdfe2f4/element/9f725127-b44a-4f4f-8900-bf5b1d0b5254/shadow 
1682519080835   Marionette  DEBUG   0 -> [0,70,"WebDriver:GetShadowRoot",{"id":"9f725127-b44a-4f4f-8900-bf5b1d0b5254"}]
1682519080837   Marionette  DEBUG   0 <- [1,70,null,{"value":{"shadow-6066-11e4-a52e-4f735466cecf":"0be369b6-0e16-47d7-a9ac-78df6f36a191"}}]
1682519080837   webdriver::server   DEBUG   <- 200 OK {"value":{"shadow-6066-11e4-a52e-4f735466cecf":"0be369b6-0e16-47d7-a9ac-78df6f36a191"}}
1682519080838   webdriver::server   DEBUG   -> POST /session/8d3e57ea-ce51-40df-b050-99192bdfe2f4/shadow/0be369b6-0e16-47d7-a9ac-78df6f36a191/element {"using": "css selector", "value": "input.bp-datepicker", "shadowId": "0be369b6-0e16-47d7-a9ac-78df6f36a191"}
1682519080839   Marionette  DEBUG   0 -> [0,71,"WebDriver:FindElementFromShadowRoot",{"shadowRoot":"0be369b6-0e16-47d7-a9ac-78df6f36a191","using":"css selector","value":"input.bp-datepicker"}]
1682519080840   Marionette  DEBUG   0 <- [1,71,null,{"value":{"element-6066-11e4-a52e-4f735466cecf":"c55f180e-0888-4ea8-bf71-2d70770edc64"}}]
1682519080840   webdriver::server   DEBUG   <- 200 OK {"value":{"element-6066-11e4-a52e-4f735466cecf":"c55f180e-0888-4ea8-bf71-2d70770edc64"}}
1682519080841   webdriver::server   DEBUG   -> POST /session/8d3e57ea-ce51-40df-b050-99192bdfe2f4/element/c55f180e-0888-4ea8-bf71-2d70770edc64/value {"text": "06.05.2023", "value": ["0", "6", ".", "0", "5", ".", "2", "0", "2", "3"], "id": "c55f180e-0888-4ea8-bf71-2d70770edc64"}
1682519080842   Marionette  DEBUG   0 -> [0,72,"WebDriver:ElementSendKeys",{"id":"c55f180e-0888-4ea8-bf71-2d70770edc64","text":"06.05.2023","value":["0","6",".","0","5",".","2","0","2","3"]}]
1682519080847   Marionette  DEBUG   0 <- [1,72,null,{"value":null}]
1682519080847   webdriver::server   DEBUG   <- 200 OK {"value":null}

(This is from the actual test that failed, so it just continued with the test failing because 'Fortsett' (Continue in norwegian) is unclickable

and in chromium(113) it works just excellent: (just stopped it after setting the same date):

[whimboo]

This should not even work outside of a ShadowDOM for an input field of the type date given of https://bugzilla.mozilla.org/show_bug.cgi?id=1420888.

Can you confirm that? Also I assume using the above code but using the text input for DokumentNummer works fine?

[fenchu]

It works other places, so it may be something with the dom:

1682576603544   Marionette  DEBUG   0 -> [0,42,"WebDriver:ElementSendKeys",{"id":"e82cb05b-b324-49a2-a8a0-0e2022c30cdc","text":"15917499923","value":["1","5","9","1","7","4","9","9","9","2","3"]}]

This works, but this do not work:

DEBUG   0 -> [0,72,"WebDriver:ElementSendKeys",{"id":"c55f180e-0888-4ea8-bf71-2d70770edc64","text":"06.05.2023","value":["0","6",".","0","5",".","2","0","2","3"]}]

Below is the code that works:

1682576603540   webdriver::server   DEBUG   -> POST /session/2889a5d8-780b-46aa-a0ff-f2f9ddc09f11/shadow/85b9412e-a3b8-4140-ada0-b8ceeb27bd74/element {"using": "css selector", "value": "input.bp-input", "shadowId": "85b9412e-a3b8-4140-ada0-b8ceeb27bd74"}
1682576603541   Marionette  DEBUG   0 -> [0,41,"WebDriver:FindElementFromShadowRoot",{"shadowRoot":"85b9412e-a3b8-4140-ada0-b8ceeb27bd74","using":"css selector","value":"input.bp-input"}]
1682576603542   Marionette  DEBUG   0 <- [1,41,null,{"value":{"element-6066-11e4-a52e-4f735466cecf":"e82cb05b-b324-49a2-a8a0-0e2022c30cdc"}}]
1682576603542   webdriver::server   DEBUG   <- 200 OK {"value":{"element-6066-11e4-a52e-4f735466cecf":"e82cb05b-b324-49a2-a8a0-0e2022c30cdc"}}
1682576603543   webdriver::server   DEBUG   -> POST /session/2889a5d8-780b-46aa-a0ff-f2f9ddc09f11/element/e82cb05b-b324-49a2-a8a0-0e2022c30cdc/value {"text": "15917499923", "value": ["1", "5", "9", "1", "7", "4", "9", "9", "9", "2", "3"], "id": "e82cb05b-b324-49a2-a8a0-0e2022c30cdc"}
1682576603544   Marionette  DEBUG   0 -> [0,42,"WebDriver:ElementSendKeys",{"id":"e82cb05b-b324-49a2-a8a0-0e2022c30cdc","text":"15917499923","value":["1","5","9","1","7","4","9","9","9","2","3"]}]
1682576603550   Marionette  DEBUG   0 <- [1,42,null,{"value":null}]
1682576603551   webdriver::server   DEBUG   <- 200 OK {"value":null}
1682576603553   webdriver::server   DEBUG   -> POST /session/2889a5d8-780b-46aa-a0ff-f2f9ddc09f11/element/e82cb05b-b324-49a2-a8a0-0e2022c30cdc/click {"id": "e82cb05b-b324-49a2-a8a0-0e2022c30cdc"}
1682576603553   Marionette  DEBUG   0 -> [0,43,"WebDriver:ElementClick",{"id":"e82cb05b-b324-49a2-a8a0-0e2022c30cdc"}]
1682576603558   Marionette  TRACE   Received DOM event click for [object HTMLInputElement]
1682576603761   Marionette  TRACE   Canceled page load listener because no navigation has been detected
1682576603761   Marionette  DEBUG   0 <- [1,43,null,{"value":null}]
1682576603762   webdriver::server   DEBUG   <- 200 OK {"value":null}
1682576606283   Marionette  TRACE   [12] MarionetteCommands actor destroyed for window id 6442450948
1682576606284   Marionette  DEBUG   Closed connection 0

on the code:

el = WebDriverWait(wd, 15).until(EC.element_to_be_clickable((By.XPATH, "//*[@id='input-nnin']"))).shadow_root.find_element(By.CSS_SELECTOR, "input.bp-input")
el.send_keys(str(lookupuser['username']))
el.click()
sys.exit(-1)

[whimboo]

It is not clear to me what the most recent comment is testing. Is that a date field or a normal text input? Seeing the screenshot attached I assume it's a text input. So it means that you can enter a string into an input which is part of a ShadowDOM, right?

[fenchu]

both are text strings. I cant see the difference.

[whimboo]

Well, for me it's not clear. So please test the following scenarios with a Firefox 113 build and give a separate reply for each of them.

1. Does sending a text to a date input field outside of a Shadow DOM work for you?
2. Does sending a text to a date input field inside of a Shadow DOM work for you?
3. Does sending a text to a text input field inside of a Shadow DOM work for you?

[fenchu]

Ok so it it the type="date" attribute that fails it. Never had any problems with it in Chromium. Writing a text string formed as a date like "text":"06.05.2023" as long as it is a valid date format.

I'll try and look around have around 50 different front end selenium tests and all those not using shadowDom work well in any firefox.

Thanks

[whimboo]

Ok so it it the type="date" attribute that fails it. Never had any problems with it in Chromium. Writing a text string formed as a date like "text":"06.05.2023" as long as it is a valid date format.

I had a quick look at this and added my findings at https://bugzilla.mozilla.org/show_bug.cgi?id=1420888#c4. Reason here is the non ISO date value. If you would use 2023-05-06 then it works in Firefox as well. Can you please check that? Does it also work for elements within a Shadow DOM then?

I'll try and look around have around 50 different front end selenium tests and all those not using shadowDom work well in any firefox.

Probably those use the ISO date value when trying to set the date?

[fenchu]

Hi I finally go to test this, and if I change the input from '03.06.2023' to '2023-06-03' it works. it also works in chromium. then format is automatically changed back to 03.06.2023 on display it is the el.send_keys(str)that fail to send anything except this format. sounds very strict to me. would be great to get warning telling improper format. But thanks a lot for clarifying this

[whimboo]

Thanks for the feedback, and good to hear that it works now.

Regarding the right date / time format I actually found https://github.com/w3c/webdriver/issues/1470 which seem to cover the situation pretty well.