Nightwatch: Support for asserting about elements within a shadow dom

Created on 28 Jun 2014 · 14Comments · Source: nightwatchjs/nightwatch

As far as I can tell nightwatch does not have support for asserting about shadow dom contents. It looks like selenium does expose an API for doing so, but it's awkward to use, creating an opportunity for nightwatch to improve the developer experience: https://groups.google.com/forum/#!msg/selenium-developers/Dad2KZsXNKo/YXH0e6eSHdAJ

enhancement needs more info

Source

rictic

Most helpful comment

I concur - Developing Polymer 2 apps which use Shadow Dom v1 and its extremely difficult to target elements in the Shadow Dom. We need a solution to move forward with using nightwatchjs.

chiefcll on 19 Jul 2017

👍6 ❤1

All 14 comments

I've been trying for some time to get to the elements nested within the shadow dom. Any additional information would be helpful. I see in the W3C working draft for the WebDriver, http://www.w3.org/TR/webdriver/#switching-to-hosted-shadow-doms, that switchToSubTree can be used to get the shadow root. Is it possible to interface directly with the web driver api with nightwatch? So that I can try calling that method?

jeffpowrs on 2 Jul 2014

I'm afraid not at this time.

On Wednesday, July 2, 2014, Jeff Powers [email protected] wrote:

I've been trying for some time to get to the elements nested within the
shadow dom. Any additional information would be helpful. I see in the W3C
working draft for the WebDriver,
http://www.w3.org/TR/webdriver/#switching-to-hosted-shadow-doms, that
switchToSubTree can be used to get the shadow root. Is it possible to
interface directly with the web driver api with nightwatch? So that I can
try calling that method?

—
Reply to this email directly or view it on GitHub
https://github.com/beatfactor/nightwatch/issues/192#issuecomment-47785937
.

beatfactor on 2 Jul 2014

Okay, beatfactor. Thanks for your response.

jeffpowrs on 2 Jul 2014

To sum up the issue a bit. As @jeffpowrs already pointed out, the W3C WebDriver specification defines the capability and command to access shadow subtrees. But the WebDriver implementation is not there (Bug 22987) yet. See also the Shadow DOM an the proposed webdriver spec and Chromedriver cannot interact with the shadow DOM.

However it is still possible to get to the shadow with a small workaround (execute and Nightwatch custom assertions to the rescue).

`````` javascript
/**

Checks if the function returns true.
*
```
this.demoTest = function(browser) {
.assert.execute(function() {
return true;
- }, [])
};
```
*
@method execute
@param {function} fn The function to be executed on the client.
@param {args} [args] Optional array of arguments which will be passed to the function.
@param {string} [message] Optional log message to display in the output. If missing, one is displayed by default.
@api assertions
*/

var util = require('util');
exports.assertion = function(fn, args, msg) {

this.message = msg || util.format('Testing the <%s>.', fn);

this.expected = true;

this.pass = function(value) {
    return value === this.expected;
};

this.value = function(result) {
    return result.value;
};

this.command = function(callback) {
    return this.api.execute(fn, args, callback);
};

};
``````

wkruse on 9 Sep 2014

👍2

should this be closed?

lacymorrow on 1 Oct 2014

Closing due to inactivity.

beatfactor on 28 Nov 2015

@beatfactor Custom Elements with Shadow Dom are on v1 and will be/are implemented in all major browsers. I think support for this is kinda necessary. What's your opinion on this?

trading-peter on 21 Jun 2017

👍5

I concur - Developing Polymer 2 apps which use Shadow Dom v1 and its extremely difficult to target elements in the Shadow Dom. We need a solution to move forward with using nightwatchjs.

chiefcll on 19 Jul 2017

👍6 ❤1

During Polymer summit 2017 Rob Dodson mentioned that they are working on Accessibility Object Model: https://github.com/wicg/aom
Maybe this could be of any help since the issue with accessibility is directly coming from accessing nested elements in Shadow DOM.

justinadesriuteRE on 25 Aug 2017

Hi,

Is support available in latest release of Nightwatch.sj now for asserting about elements within a Shadow DOM ?
Can someone please help how to do that if its not supported.

neerjain on 30 Apr 2019

This issue should be reopened! As far as I can tell, Nightwatch does not provide any way to deal with elements within the Shadow DOM, and it's a deal breaker if you are trying to test anything with web components. As Web Components become more prevalent, Nightwatch needs to provide some kind of support if it is to remain relevant. We'll be regretfully moving to another framework until this happens.