Транспортир: Как выбрать элемент ввода внутри теневого DOM (Полимер), который находится под несколькими слоями тени root - PullRequest
0 голосов
/ 09 января 2020

Я использую Protractor 5.4.2 для тестирования веб-страниц, созданных с использованием Polymer. js. У меня есть веб-страница с несколькими уровнями корней теней. Я должен выбрать вход, который лежит под 10-й тенью - root. Чтобы перейти на 10-й уровень, мне нужно перейти от первой тени root, или я могу получить прямой доступ к 10-й тени root?

image Element">

1 Ответ

0 голосов
/ 09 января 2020

У меня была такая же проблема с теневым DOM. Я использовал локатор. js (http://www.protractortest.org/# / api? View = webdriver.By. js) для запуска моего пользовательского кода js на странице. И результатом этого является ElementFinder, который фактически представляет внутренний элемент shadow dom.

class HomePage {
   get shadowRoot(): ElementFinder {
        return element(
            By.js(function (elem) {
                try {
                    // querySelectorAll returns array-like object, so converting it to Array with this:
                    return Array.prototype.slice.call(
                        document.querySelector(elem).shadowRoot.querySelectorAll('#mdr-ibe')
                    );
                } catch (err) {
                    // using try/catch to avoid uncaught errors
                    return [];
                }
            }, 'css-locator-of-element-with-shadow-root')
        );
    }

    public async startSearch() {
        // Using chaining to search for elements inside shadowRoot:
        const startSearchButton = this.shadowRoot.$('button.start-search')
        await browser.wait(EC.elementToBeClickable(startSearchButton));
        await startSearchButton.click();
    }
}

Но имейте в виду - работа с теневыми root элементами плохо работает в firefox

...