lit-element wait for nested shadow element to render

Viewed 20

I'm trying to access the shadow element to provide default value

<my-element>
  #shadowroot(open)
    <styled-input> // not my own, so I cannot modify its internal logic
      #shadowroot(open)
        <input />  // trying to access this native html input element
    </styled-input> 
</my-element>

When using life cycle firstUpdated, I see that <styled-input> is created, but its shadow is not rendered yet.

  protected firstUpdated(): void {
    console.log(this.shadowRoot);
    // <styled-input></styled-input>
  }

I can get the <input /> element using setTimeout, which is not ideal.

How can I wait for the <styled-input>'s firstUpdated without modifying logic in <styled-input>?

0 Answers
Related