oddbird / popover-polyfill

Polyfills the HTML popover attribute and showPopover/hidePopover/togglePopover methods onto HTMLElement, as well as the popovertarget and popovertargetaction attributes on <button> elements.
BSD 3-Clause "New" or "Revised" License
247 stars 14 forks source link

Export `injectStyles` so the polyfill can work with Lit #200

Closed Totati closed 4 months ago

Totati commented 4 months ago

Hi, we This polyfill does not work well with Lit, as Lit overrides the adoptedStyleSheets in the first connectedCallback.

Currently I could overcome this by overriding the Lit's ReactiveElement#createRenderRoot with a custom implementation, so it spreads the current adopted styles, but it's not a patch.

When injectStyles is exported it can be patched with way less code, keeping the original implementation.

  const originalCreateRenderRoot = (ReactiveElement as any).prototype.createRenderRoot;
  (ReactiveElement as any).prototype.createRenderRoot = function () {
    const renderRoot = originalCreateRenderRoot.call(this);
    injectStyles(renderRoot);
    return renderRoot;
  };
jgerigmeyer commented 4 months ago

@Totati Thanks for reporting! This is released in v0.4.3.