search

AmyScript / storybook-addon

MIT License
1 stars 1 forks source link

[Bug] Addon errors out #4

Open meissadia opened 1 year ago

meissadia commented 1 year ago

Storybook version

7.0.24

How to replicate error

Screenshots

Error location Screenshot
UI UI-error
Console Console-error
meissadia commented 1 year ago

@AmyScript I'm unable to open a PR to correct the issue but the following update to the withCss hook gets the addon working again.

import { DecoratorFunction, useGlobals } from '@storybook/addons';
import { addons } from '@storybook/addons';
import { useEffect } from '@storybook/addons';
import { getCss } from './getCss';
import { EVENTS } from './constants';

export const withCss: DecoratorFunction = (StoryFn, context) => {
  const [{ myAddon }] = useGlobals();

  useEffect(() => {
    const channel = addons.getChannel();
    channel.emit(EVENTS.CLEAR);
    if (myAddon) {
      // Focus on <html> element instead of #root
      const selector = 'html';
      const focusedElement = window.document.querySelector(selector);

      if (focusedElement) {
        focusedElement.addEventListener('click', getCss);
        return () => focusedElement.removeEventListener('click', getCss);
      }
    }
  }, [context.id, myAddon]);

  return StoryFn();
};