search

le0pard / storybook-addon-root-attribute

Storybook addon, which provide ability to change html, body or some element attribute
https://storybook-addon-root-attribute.leopard.in.ua
MIT License
18 stars 6 forks source link

Doesn't work when landing on "Docs" view on first page load #12

Closed melanieseltzer closed 3 years ago

melanieseltzer commented 3 years ago

Hey there! So, if I'm on the "Docs" tab and do a hard page refresh, the attribute doesn't get added until navigating away (via client-side nav). If I'm on the "Canvas" tab first and hit refresh, this doesn't happen - it successfully gets added on first page load.

You can see the behavior in the GIF below - here I'm trying to add data-theme="light" to the body. It doesn't get added until I navigate to the "Canvas" tab.

Any way around this? I don't think "Docs" tab gets served by default, but it's a little jarring if I'm already on "Docs" and my browser window refreshes e.g. if Storybook gets rebuilt.

Kapture 2021-04-04 at 14 07 20

le0pard commented 3 years ago

Hello @melanieseltzer

I thinks "Docs" have same issue with many plugins, like "responsive" or "a18y". All of them works only on "Canvas". Maybe "Docs" designed to ignore such changes

https://user-images.githubusercontent.com/98444/113569458-3c025000-961b-11eb-9f4a-767a028ca871.mp4

melanieseltzer commented 3 years ago

Thanks @le0pard, that makes sense 🙂 So when landing on the Docs page first, the root attribute panel itself doesn't exist yet (since the panel isn't on the Docs page at all), so it doesn't emit EVENTS.UPDATE, and consequently updateRootAttribute doesn't run to set the attribute. Am I understanding it correctly?

le0pard commented 3 years ago

@melanieseltzer correct

melanieseltzer commented 3 years ago

👍 I'll go ahead and close this then, thanks for the clarification!