Excuse me, i have some problem with this element. in case i want to click a date logo (default HTML Trigger) for show up the calendar. But the id is not found (I guess cause shadow-root)
If you search this forum for “shadow dom” there are several threads discussing how to handle this, there is no quick answer which is why I didn’t link to a specific thread.
I would normally not recommend to use a different Library, but in case of WebComponents (shadow dom) i would recommend to try out Browser library
At least if you have shadowDom elements in general.
Why: because Browser library does automatic shadow dom opening/piercing.
This was initially the one reason why i startet working in the Browser team.
If you just have one or two elements, stay with SeleniumLibrary and just use the dom: selector.
would be this:
Click Element dom:document.querySelector("input[type='datetime-local'][name='appointment']").shadowRoot.querySelector("#picker")
You have to select the shadow-host (the element that has the #shadow-root in it directly), then call shadowRoot on it to open the shadow dom, then potentially select the next shadow-host or the element you need.
You can get this selector by selecting Copy > Copy JS path in context menu of this element in dev tools in chrome.
Be aware that using xPath inside a shadow dom is not possible.