When can we expect support for multilevel of nested Shadow DOM


#1

Our application uses a polymer framework that needs multilevel of nested Shadow DOM. We are not able to automate our UI because of this issue. Any workaround or When can we have support for this will be appreciated.


#2

What exactly are the issues/problems you are encountering? If a regular user can use your UI, an automation user (Katalon) should be able to, also.

To aid you better, post any errors you receive along with a screenshot of the application and any relevant HTML.


#3

:expressionless:


#4

See this image & suggest

katalon.png


#5

Russ Thomas said:

What exactly are the issues/problems you are encountering? If a regular user can use your UI, an automation user (Katalon) should be able to, also.

To aid you better, post any errors you receive along with a screenshot of the application and any relevant HTML.

See the image in the discussion & provide the possible solution


#6

Hey Suraj, can you try xpath something like this /*[name()=‘paper-button’]
is there a sample application available over internet for me to test


#7

The Katalon Document https://docs.katalon.com/display/KD/Working+with+Shadow+DOM+Objects
is saying:

Limitation

  • Only allow 1 level of nested Shadow DOM parent

suraj,

I find Your HTML has heavily nested shadow DOM.

--------

Ah! I found I made a loop back to the 1st post. Sorry.


#8

Manu Mahendran said:

Hey Suraj, can you try xpath something like this /*[name()=‘paper-button’]
is there a sample application available over internet for me to test

Its a shadow element…So it will not work. Its not a regular DOM structure.


#9

Russ Thomas said:

What exactly are the issues/problems you are encountering? If a regular user can use your UI, an automation user (Katalon) should be able to, also.

To aid you better, post any errors you receive along with a screenshot of the application and any relevant HTML.

I have added sample code…could you please help me out.


#10

kazurayam said:

The Katalon Document https://docs.katalon.com/display/KD/Working+with+Shadow+DOM+Objects
is saying:

Limitation

  • Only allow 1 level of nested Shadow DOM parent

suraj,

I find Your HTML has heavily nested shadow DOM.

--------

Ah! I found I made a loop back to the 1st post. Sorry.

Yeah…Let me know if you found any workaround


#11

suraj warade said:

Russ Thomas said:

What exactly are the issues/problems you are encountering? If a regular user can use your UI, an automation user (Katalon) should be able to, also.

To aid you better, post any errors you receive along with a screenshot of the application and any relevant HTML.

I have added sample code…could you please help me out.

Okay, let’s go back to your original question:

Our application uses a polymer framework that needs multilevel of nested
Shadow DOM.

1 - Shadow DOM elements are not part of the DOM. The Katalon/WebUI API operate on the DOM. Therefore… There is no Katalon/WebUI API that allows access to document artifacts (i.e. elements) outside of the regular DOM.

Clear?

We are not able to automate our UI because of this issue.

2 - This is not an issue. I repeat: If a regular user can use your UI then an automation user (Katalon) should be able to, also.

Any workaround or …

3 - There is no “workaround” because there is no need for one. Nothing is “broken” and nothing is “missing”. You don’t need a workaround because (see point 2).

When can we have support for this will be appreciated.

4 - I’m still left wondering what it is you are trying to
achieve. If your application/website can be operated “by hand” you do
NOT need to tinker with the innards of a Shadow DOM. The whole point of
Shadow DOM is to protect and encapsulate the inner workings such that a
“unified veneer” is presented at the UI - said another way, it’s designed to keep you out!

That said…

There is a possibility to test Shadow DOM structure but only by writing special code not available in Katalon. The best way to do that is to write the code in JavaScript and inject that into the page using WebUI.executeJavaScript.

Fair warning: Constructing the JavaScript code to interrogate a Shadow DOM and injecting it into the page, is very likely NOT a trivial task. It can be done, but without knowing what you are ultimately trying to achieve, it’s hard to make recommendations. And I repeat the same point again - if all you want to do is operate your page like a regular user, you do not need this.

If you really, really, REALLY think you need to dig in, then read this stuff:

You are likely going to spend some time reading up on Custom Elements and Web Components, too.


#12

Russ Thomas said:

suraj warade said:

Russ Thomas said:

What exactly are the issues/problems you are encountering? If a regular user can use your UI, an automation user (Katalon) should be able to, also.

To aid you better, post any errors you receive along with a screenshot of the application and any relevant HTML.

I have added sample code…could you please help me out.

Okay, let’s go back to your original question:

Our application uses a polymer framework that needs multilevel of nested
Shadow DOM.

1 - Shadow DOM elements are not part of the DOM. The Katalon/WebUI API operate on the DOM. Therefore… There is no Katalon/WebUI API that allows access to document artifacts (i.e. elements) outside of the regular DOM.

Clear?

We are not able to automate our UI because of this issue.

2 - This is not an issue. I repeat: If a regular user can use your UI then an automation user (Katalon) should be able to, also.

Any workaround or …

3 - There is no “workaround” because there is no need for one. Nothing is “broken” and nothing is “missing”. You don’t need a workaround because (see point 2).

When can we have support for this will be appreciated.

4 - I’m still left wondering what it is you are trying to
achieve. If your application/website can be operated “by hand” you do
NOT need to tinker with the innards of a Shadow DOM. The whole point of
Shadow DOM is to protect and encapsulate the inner workings such that a
“unified veneer” is presented at the UI - said another way, it’s designed to keep you out!

That said…

There is a possibility to test Shadow DOM structure but only by writing special code not available in Katalon. The best way to do that is to write the code in JavaScript and inject that into the page using WebUI.executeJavaScript.

Fair warning: Constructing the JavaScript code to interrogate a Shadow DOM and injecting it into the page, is very likely NOT a trivial task. It can be done, but without knowing what you are ultimately trying to achieve, it’s hard to make recommendations. And I repeat the same point again - if all you want to do is operate your page like a regular user, you do not need this.

If you really, really, REALLY think you need to dig in, then read this stuff:

https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM

https://stackoverflow.com/questions/16633057/is-it-possible-to-access-shadow-dom-elements-through-the-parent-document

You are likely going to spend some time reading up on Custom Elements and Web Components, too.

Eventually, I have already gone through the above-given link. I have asked for the Multilevel support. Not sure if you are aware or not but Katalon supports one level shadow element. So again my question is when can we expect multilevel support. Your answer is explanatory but not found the correct match. Thanks.


#13

We are also waiting for a solution regarding multilevel shadow-roots and face the same problem as suraj warade does.
Since there is nothing communicated about that topic for quite a long time we had to start using alternatives. But still would appreciate a solution from Katalon for this.


#14

lukas krombholz said:

We are also waiting for a solution regarding multilevel shadow-roots and face the same problem as suraj warade does.
Since there is nothing communicated about that topic for quite a long time we had to start using alternatives. But still would appreciate a solution from Katalon for this.

What alternative worked for you?


#15

suraj warade said:

lukas krombholz said:

We are also waiting for a solution regarding multilevel shadow-roots and face the same problem as suraj warade does.
Since there is nothing communicated about that topic for quite a long time we had to start using alternatives. But still would appreciate a solution from Katalon for this.

What alternative worked for you?

currently using Selenium for those kind of sites…


#16

Hi Suraj,

unfortunately Lukas left the project but the topic is still relevant.
Our project uses multilevel shadow-roots (in fact we are working with https://www.polymer-project.org/ Version 1). The shadow-root is used in Polymer quite excessively.
So a multilevel shadow-root support by catalon is heavily needed.

Please consider supporting multilevel shadow-roots or please support us if there is an workaround.

Thanks,

Henning


#17

Hi everyone, I am also trying to find a solution in Katalon to handle multilevel shadow-roots. I would also like to ask if Katalon is considering supporting multilevel shadow-roots or anyone know of a workaround?
Best


#18

I googled by keyword “Shadow Dom Protractor” and found the following artile:

I haven’t read it at all but the title tells me that it is possible to test Web pages with multilevel Shadow DOM elements using Protractor.

On the other hand, one day @discover.selenium posted following discussions:

These discussions, I suppose, indicates somehow it is possible for Katalon user to utilize the Protractor assets (JavaScript libraries) to test Angular-based web pages with multilevel Shadow DOM. I may be wrong. I haven’t studied this issue at all. But there seem to be a research path to go through and see.


#19

I’ve moved this to Feature Suggestions for planning.


#20

Until we have this feature developed, we can use this project https://github.com/sushil106768/shadow-dom-automation . Developed for ruby watir framework and working successfully, but you can use this for selenium webdriver existing framework.
If Kalatalon can integrate this tool until they are working on development of this feature, it will be really good for all of us.