I wanted to automate chrome:downloads section once, but I never knew why I was not able to interact with the element. With this video now I know the reason. Thank you for the video Naveen ❤️
Hi @naveenautomationlabs i did the same, i am unable to click on the element. It is throwing: javascript error: cant read properties of null(reading 'shadowRoot').
Hello, I have a drop-down value in shadow root that I need to select. Tried with JS path like you suggested, but the value keeps changing, as it is dynamic. Any way that I can search the value through text? Please let me know. Thank you in advance. Below is my output from console : document.querySelector(‘eds-select’).shadowRoot.querySelector(‘div > ng-select > ng-dropdown-panel > div > div > div > span’) Span contains the text that I am trying to select
Thanks Naveen for this wonderful video. But a question, while using document.querySelector should we traverse through each node or can we use something relative like relative XPath?
Hey Naveen, how to apply webdriver wait or any other wait for that instance for shadowDOM elements? PLEASE HELP. My webpage is not loaded and the script is already performing click function
How to give waits for these elements, especially Explicit Wait? Because when I try to change the Shadow root element to WebElement( so that I can give wait), the script fails as it does not able to find the element. But I'm trying to give wait until expected condition, visibility of element is matched. 😢
If anyone reading this comment please reply I am automating rahulshetty ecommerce website when I don't use page object model its work perfectly but when I try to automate using page object design pattern the same program doesn't work
Thanks Naveen. It's a very informative video. I followed this and it worked perfectly for me in chrome but the same code doesn't seem to work for Safari. It would be really helpful if you can make a similar video for Safari as well.
Thanks Naveen.... This is very helpful.... Does this work in headless mode..? It's working in UI mode but I am facing issue while executing this in headless mode in chrome...
can you please help me in this, iam getting this elow error-------- raise exception_class(message, screen, stacktrace) selenium.common.exceptions.JavascriptException: Message: javascript error: Cannot read properties of null (reading 'shadowRoot')
Hello Naveen...I am able to enter the value but i am not able to see them in input field on UI but when i go and see in the inspector, under value tag the value is getting stored but not displaying on UI what could be the issue, appreciate anyone's help🙏🙏🙏
Naveen Sir. I'm trying tp automate Service Now developer Instance. However when I login and come to Start Building page, the Shadow root does not handle. I tried with same method - putting in console and checking out but getting error: javascript error: Cannot read properties of null (reading 'shadowRoot') Kindly suggest....
Hi there, I have a test that, I have to select an icon (web element) which will be displayed only when I mouse hover to it , then I have to inspect it.can someone help me out how to do it...before mouse hover to it, it shows another data, by mouse hovering to it I get a icon, which I should click and carry out other process
when i use this code i got exception " org.openqa.selenium.JavascriptException: javascript error: Cannot read properties of null (reading 'shadowRoot') any solution for that
Great topic coverage Naveen !!! Thanks a lot... I followed the steps and created JS query in my project, it is working in console, but in test script it is failing with error "Cannot read properties of null (reading 'shadowRoot')". I'm working on selenium 3 with Java. Can you please help??
Hi Naveen how to open real web cam.. fake camera not working for me.. it just masks with green color in camera.. will you please help me out.. tried all kind of stuffs..
Hi naveen,this was good session.Using this iam trying to operate on drop down but its not woking. It will be good if the session is made on the drop down with out using the select tag inside a shadow root. Thank you
Hi Naveen, thank you for the great video it helps a loooot. But I still have problem. I have many shadow root like this DOM. I click one element then navigate to other page. then I was going to locate element. but some reason I cannot locate any element on that new page. I tried reasign jse again or created new one still cannot locate any element from that page. What should I do? Can you advise?
Hi Naveen i tried this shadow dom in my application its working for textbox when tried it on select item its working could you please give me some idea on this
Hi Naveen, I followed the steps mentioned to write the path for shado dom element. but getting "org.openqa.selenium.JavascriptException: javascript error: Cannot read properties of null (reading 'shadowRoot')" error
Hi Naveen, How are you? I have a question, lets say that inside the shadow-root there is a also. it is a text box where I have to paste a text message. I am facing problems to get there. do you have any idea on how to do it? Also I am trying to handle a dropdown, which I now how to do it with normal xpath elements using JAVA API, but how to do it using JS path? Please help me :) Have a good day Naveen, thank you so much for your videos, it has been helping me a lot
Hi Naveen, Thank you for covering this topic. Accessing elements inside a shadow DOM works fine for Chrome browser, but it fails for firefox with error “circular object reference”. Did you come across this error by any chance? If yes, how did you resolve it?
Thank's naveen for this video and your're QA community support, and one more I unable to join you're telegram group . How I would join you're Telegram group
Hi Naveen, Could you please teach how to insert shadow DOM elements in list. This is required for my work. Please help. I am using JSPath to identify the shadow DOM elements.
From no other available internet resources we can get a so clear explanation ever.
Thank you Naveen.
👍
debugged two days with no luck, after your video able to find web element. thank you 🥰
Very good explanation about shadow dom.. Thank you so much 😊
That's the right way how to explain concepts...Thanks for this video
Thank you so much sir, 🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏. Finally got the solution
GIT REPO FOR THIS EXAMPLE:
github.com/naveenanimation20/ShadowDOMHandle
Hi Naveen
Script was working but ...text which passed as attributes were not displayed as text and looks like predefined text...any idea on it...
Thank You Sir ji...very informative...I was lost and your videos helped me understand.
After 12 hrs of debugging SF, I learnt what shadow doms are and got my CI tests working.
Awesome!!
Thanks for sharing Naveen, its very helpful..!!
Awaited topic got covered, Thanks Naveen For this 😊👍
Most welcome 😊
@@naveenautomationlabs findelements how to handle ?
Most awaited topic... Thanks Naveen 👌
Thanks Naveen. This is new concept for me. Learned new things today
Thanks, Naveen. This is a new concept for me. Learned new things.
Thanks Naveen for this video. It helped me a lot
Thank you Naveen!! This helps me a lot 🙏🏻could run my application successfully 😇
Amazing explanation of shadow dom. Thanks Naveen
Learned a new and much awaited topic !! Thanks Naveen :)
Glad to hear that
Very helpful for accept all cookies banner.. Thanks Naveen...
Beautifully explained in details..
That's great!! Thank you, Naveen for the video. Please demonstrate how to scroll inside shadowroot element
Thanks a lot Naveen.....👍👍👍
I wanted to automate chrome:downloads section once, but I never knew why I was not able to interact with the element. With this video now I know the reason.
Thank you for the video Naveen ❤️
You're very welcome!
Request you to please explain how to locating elements in shadow DOM using selenium *python*. Thank you Naveen..!!
Thank you very much for this video. Helped me a lot
Excellent 👌
This is so amazing... Thank you so much Sir
Thanks for this topic... Really helpful
Glad it was helpful!
Hi @naveenautomationlabs i did the same, i am unable to click on the element. It is throwing: javascript error: cant read properties of null(reading 'shadowRoot').
Thanks for your quick response 👍 👏 👌 😀
Hello,
I have a drop-down value in shadow root that I need to select.
Tried with JS path like you suggested, but the value keeps changing, as it is dynamic.
Any way that I can search the value through text?
Please let me know.
Thank you in advance.
Below is my output from console :
document.querySelector(‘eds-select’).shadowRoot.querySelector(‘div > ng-select > ng-dropdown-panel > div > div > div > span’)
Span contains the text that I am trying to select
Thanks Naveen for this wonderful video. But a question, while using document.querySelector should we traverse through each node or can we use something relative like relative XPath?
Javascript error : cannot read property 'shadowroot' of null ............... i facing this all the time plzzz help
I am getting the same error. Please help me with the solution if you found it.
You have to add the thread.sleep in order to have the shadow doom uploaded.
Hey Naveen, how to apply webdriver wait or any other wait for that instance for shadowDOM elements? PLEASE HELP. My webpage is not loaded and the script is already performing click function
How to give waits for these elements, especially Explicit Wait?
Because when I try to change the Shadow root element to WebElement( so that I can give wait), the script fails as it does not able to find the element. But I'm trying to give wait until expected condition, visibility of element is matched. 😢
If anyone reading this comment please reply I am automating rahulshetty ecommerce website when I don't use page object model its work perfectly but when I try to automate using page object design pattern the same program doesn't work
Great!!!! thank you so much!
Thank you so much made that video brother
Shadow-root ( user-agent) is open shadow-root or closed. Can we automate shadow-root (user-agent) elements??
Is youtube ad video an example of shadow DOM? If yes, what element is it referencing?
Hi, any suggestions to handle dynamic shadow Doms
Hi Naveen,. I can see shadow root element is opened but still seeing can not read property 'shadowRoot' of null...any idea on this?
Same error did you find a solution ?
Dude I love you. You saved me
Thanks Very useful
Thanks Naveen. It's a very informative video. I followed this and it worked perfectly for me in chrome but the same code doesn't seem to work for Safari. It would be really helpful if you can make a similar video for Safari as well.
Good one👍
for me js xpath is disable what should do for copy for direct
does protractor and cypress with TypeScript support shadow DOM?
Even though I follow the same steps in my project the "Check button" is not clicking. Kindly help me on this. what will be the issue?
If input is uploading a file,how can we handle inside nested shadow in python selenium
Getting error - org.openqa.selenium.JavascriptException: javascript error: Cannot read property 'click' of null
Whether the issue is fixed?
@@shankarlingam4702 is this issue fixed
Thanks for covering this topic
Thanks Naveen.... This is very helpful....
Does this work in headless mode..?
It's working in UI mode but I am facing issue while executing this in headless mode in chrome...
Can you help me please... I need to open one downloaded file by clicking on it but that is not working...
can you please help me in this, iam getting this elow error-------- raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.JavascriptException: Message: javascript error: Cannot read properties of null (reading 'shadowRoot')
Hello Naveen...I am able to enter the value but i am not able to see them in input field on UI but when i go and see in the inspector, under value tag the value is getting stored but not displaying on UI
what could be the issue, appreciate anyone's help🙏🙏🙏
Since you already got the WebElement by casting the shadow DOM object you can use .sendKeys() method with it.
How can get list of elements by document.queryselectorAll() with selenium ?
how can we use waits without driver as we using JSE,pl help naveen
Excellent Naveen.... I would like to know what is the purpose of shadow elements...
Naveen Sir.
I'm trying tp automate Service Now developer Instance.
However when I login and come to Start Building page, the Shadow root does not handle.
I tried with same method - putting in console and checking out
but getting error: javascript error: Cannot read properties of null (reading 'shadowRoot')
Kindly suggest....
Hi there, I have a test that, I have to select an icon (web element) which will be displayed only when I mouse hover to it , then I have to inspect it.can someone help me out how to do it...before mouse hover to it, it shows another data, by mouse hovering to it I get a icon, which I should click and carry out other process
It's such a helpful video thanks Naveen a lot., Team, Please tell me how use get text from a shadow.please it's urgent!!!
Thank you so much naveen
Hi sir.. after using the same way am getting JavascriptException in the console...
when i use this code i got exception " org.openqa.selenium.JavascriptException: javascript error: Cannot read properties of null (reading 'shadowRoot') any solution for that
same problem facing , pls explain me if you have already solved
Hi Naveen .In application we used Angular and web component with Shadow DOM. Can you please suggest which tool is good for this UI automation
Thank you for the video! How to use waits for dynamically loading elements present under Shadow DOM?
HI Naveen, Telegram link provided in description is not working. Could u tell the group name.
Great topic coverage Naveen !!! Thanks a lot... I followed the steps and created JS query in my project, it is working in console, but in test script it is failing with error "Cannot read properties of null (reading 'shadowRoot')". I'm working on selenium 3 with Java. Can you please help??
Hi Bhushan, I am also getting the same error may i know whether the issue is fixed and if yes could pls share how it got fixed?
Hi Naveen how to open real web cam.. fake camera not working for me.. it just masks with green color in camera.. will you please help me out.. tried all kind of stuffs..
great sir!! cud u pl let me kno how can we use webdriverwait with jse as we are not using driver directly
Hi naveen,this was good session.Using this iam trying to operate on drop down but its not woking. It will be good if the session is made on the drop down with out using the select tag inside a shadow root. Thank you
Hi Naveen, thank you for the great video it helps a loooot. But I still have problem. I have many shadow root like this DOM. I click one element then navigate to other page. then I was going to locate element. but some reason I cannot locate any element on that new page. I tried reasign jse again or created new one still cannot locate any element from that page. What should I do?
Can you advise?
How to make list of shadow root elements.
Is it possible?
Hi Naveen
i tried this shadow dom in my application its working for textbox when tried it on select item its working could you please give me some idea on this
Hi Naveen, can u pls share a video on how to perform scroll if we have shadow dom
can you please explain, how it can be done for Webdriver IO?
Hello @Naveen
I'm facing an issue about the stale element under shadow root, do you have any idea/suggestion? thank you in advance!
hi Sir, is it possible to create one video like this using python and selenium webdriver and another one with Python Robot Keyword framework as well
Thank you 🙏
Thanks Naveen for explaining it so well. But in my DOM case, after shadow-root I have all the html tags with section only as below
Shadow-root (open)
Goes on...
I need to select the section part 2..how can I do that?? Could you please help me with this??
It worked with section.2... Please ignore the question. Thank You!
Hi Naveen, I followed the steps mentioned to write the path for shado dom element. but getting "org.openqa.selenium.JavascriptException: javascript error: Cannot read properties of null (reading 'shadowRoot')" error
Hi Naveen, How are you?
I have a question, lets say that inside the shadow-root there is a also.
it is a text box where I have to paste a text message. I am facing problems to get there. do you have any idea on how to do it?
Also I am trying to handle a dropdown, which I now how to do it with normal xpath elements using JAVA API, but how to do it using JS path?
Please help me :)
Have a good day Naveen, thank you so much for your videos, it has been helping me a lot
Hi Naveen,
Thank you for covering this topic. Accessing elements inside a shadow DOM works fine for Chrome browser, but it fails for firefox with error “circular object reference”. Did you come across this error by any chance? If yes, how did you resolve it?
Hello sir, How to do gettext of shadow dom element?
Hi Naveen,
How Can we use shadow root in Implicitly/Explicitly wait.
Thank's naveen for this video and your're QA community support, and one more I unable to join you're telegram group . How I would join you're Telegram group
Hi Naveen, Could you please teach how to insert shadow DOM elements in list. This is required for my work. Please help. I am using JSPath to identify the shadow DOM elements.
There is no better way to get the elements? I think there are too many chain calls
Thank you so much
I tried the same way but neither it is throwing error nor entering any text in the textbox
Hi Rahul, I am getting the same username cannot be empty. You resolved it?
Hi Naveen, can we automate shadow-root(user-agent)?
Sir please create a video where script is selecting shadow root drop-down options.
Great
Thank you that helps
Hi Naveen Please share some websites where shadow DOM is Implemented
How to come out from shadow root after driver switch inside?
copy js path is life saviour :)
How to do shadow dom with python selenium?
HI Naveen can we do similar in webdriverio
Need same flow but with Shadow Dome close