Re: [w3c/webcomponents] Support /deep/ in static profile (bugzilla: 28591) (#78)

I've come to the conclusion that the testing frameworks need to change - not the spec. This is after hours of research and work. Here's a simple script for webdriver.io which allows full traversal of open shadow roots to select elements:

```js
/**
 * Add a command to return an element within a shadow dom.
 * The command takes an array of selectors. Each subsequent
 * array member is within the preceding element's shadow dom.
 *
 * Example:
 *
 *     const elem = browser.shadowDomElement(['foo-bar', 'bar-baz', 'baz-foo']);
 *
 * Browsers which do not have native ShadowDOM support assume each selector is a direct
 * descendant of the parent.
 */
browser.addCommand("shadowDomElement", function(selector) {
  return this.execute(function(selectors) {
    if (!Array.isArray(selectors)) {
      selectors = [selectors];
    }

    function findElement(selectors) {
      var currentElement = document;
      for (var i = 0; i < selectors.length; i++) {
        if (i > 0) {
          currentElement = currentElement.shadowRoot;
        }

        currentElement = currentElement.querySelector(selectors[i]);

        if (!currentElement) {
          break;
        }
      }

      return currentElement;
    }

    if (!(document.body.createShadowRoot || document.body.attachShadow)) {
      selectors = [selectors.join(' ')];
    }

    return findElement(selectors);
  }, selector);
});
```

The problem is that testing frameworks are designed around the premise that you can use a query selector to match any element. With shadowDom this is simply no longer true. An alternative strategy is needed.

With webdriver.io, the lower level protocol bindings are still accessible. Using the above custom command I can fully test in browsers with native ShadowDOM support as well as polyfilled.

Closed shadow roots will require an entirely new strategy for testing however.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/78#issuecomment-243017771