Свойство ShadowRoot является нулевым, несмотря на открытый - PullRequest
Новая
       31

Свойство ShadowRoot является нулевым, несмотря на открытый

0 голосов
/ 09 февраля 2019

Я пытаюсь получить доступ к ShadowRoot для моего элемента, и свойство element.shadowRoot возвращает null.
. ShadowDOM определяется как mode: 'open', что правильно, я могу даже console.log(element)чтобы увидеть все свойства и shadowRoot является объектом типа ShadowRoot.

В моем приложении я пытаюсь получить доступ к свойству следующим образом: 

let el = document.getElementById('elementId');
...
console.log(el);
console.log("this.shadowRoot = ???");
console.log(el.shadowRoot);

Это нормально??

Прилагается вывод console.log() с консоли, как вы можете видеть, что shadowRoot определенно есть.
(С консоли Firefox)
enter image description here

Я пробовал как в последних версиях Firefox, так и в Chrome, у обоих одинаковый результат.
Что я делаю не так?

Спасибо

Редактировать

Я создал небольшой JSFiddle .
Если вы нажмете F12 и увидите консоль, вы увидите, что элемент зарегистрирован и показывает свойство shadowRoot, норегистрация shadowRoot отображает null.

Интересно, это ошибка?Возможно, он еще не полностью реализован?

Я видел Element.shadowRoot в Firefox , но я использую последние версии (65) Firefox и (72) Chrome.

1 Ответ

0 голосов
/ 10 февраля 2019

Будьте осторожны с порядком выполнения скрипта.

В вашем примере вы пытаетесь получить свойство shadowRoot до определения пользовательского элемента.

Это работает когда вы получите значение в нужное время.

Вы можете использовать метод whenDefined(), чтобы убедиться, что элемент определен: 

customElements.whenDefined( 'web-component ').then( () => {
    let el = document.getElementById('elementId');
    console.log(el.shadowRoot);
} )
...