Me estoy peleando con un triste código hecho en Js.
Quiero acceder desde el shadowRoot a light dom para poder interactuar con él. Y no hay manera
Os pongo el código tanto del webComponent como el html usado para crear el objeto
Este es un fragmento del webcomponent (JS)
Código:
Hay un slot llamado container para que luego desde el html del index se pueda mostrar cierta información en este caso solo es un simple div. render() {
return html`
<hr>
<div>header web componente
<br>
<button @click="${this.click}"> clicc</button>
<slot>
</slot>
<slot name="container">
</slot>
<hr> `
}
click(){
console.log(this.shadowRoot.querySelector('slot[name=container]'));
}
Pongo el código HTML
Código:
Desde el botón quiero mostrar en consola el árbol del slot container, pero me sale en blanco, ya que me coje el slot del shadowRoot no el del light dom<body>
<app-element>
<button> Guardar</button>
<slot name="container">
<div id="contenido"> contenido sloot</div>
</slot>
</app-element>
</body>
Quiero acceder a todos los items del light dom.
En este caso modificar el innerHTML del div contenido
¿Me podéis ayudar?
Muchas gracias,


