Konva in the shadow DOM?

[domnikmack]

Trying to use Konva in combination with a Stenciljs component with shadow set to true. When using the default way of creating a stage, the element set as container cannot be found as expected. Any suggestions? Workarounds?

[lavrton]

How do you set container for stage? You can just pass DOM dev element as container attributes. I guess you should have access to that DOM element inside shadow DOM scope.

[domnikmack]

That worked. Thank you!
Used ref to get a reference to an element in stencil and passed it as the container attribute.

//stencil class
export class MyComponent {
  el: HTMLDivElement;
  componentDidLoad() {
    const stage = new Konva.Stage({
          width: 500,
          height: 500, 
          container: this.el
        });
  //layers etc.
   render() {
    return <div ref={e => this.el = e}></div>
  }
}