You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I noticed that when there's a bound attribute in a Facet custom component, Storybook seems to ignore changes in that attribute. I found this when working on the left nav, but then also noticed it's an issue for the existing counter component.
In that component, there are two attributes using the x => x.something syntax: <${buttonTag} appearance="${x => x.appearance}" @click=${x => x.increment()}>
In Facet's storybook, updating those two attributes ("appearance" through a select control, and "increment" through clicking the button itself) has no effect on the actual component. The html updates in the dom as expected, and the storybook args change as well, but the actual component isn't impacted. I confirmed that everything behaves as expected in the sandbox, leading me to believe this is a Storybook-FAST integration issue.
After poking around a little, my guess is that there is a bug between FAST's html function and Storybook - we follow the suggested Storybook syntax exactly, but the docs refer mostly to lit-html. There's not a lot of information about FAST and Storybook together, so I didn't have a lot of luck in finding a work around within Storybook.
The workaround for now is just working with the sandbox to develop components using the binding method for attributes, but I do think this is something important to solve in the near-ish term.
The text was updated successfully, but these errors were encountered:
I noticed that when there's a bound attribute in a Facet custom component, Storybook seems to ignore changes in that attribute. I found this when working on the left nav, but then also noticed it's an issue for the existing counter component.
In that component, there are two attributes using the
x => x.something
syntax:<${buttonTag} appearance="${x => x.appearance}" @click=${x => x.increment()}>
In Facet's storybook, updating those two attributes ("appearance" through a select control, and "increment" through clicking the button itself) has no effect on the actual component. The html updates in the dom as expected, and the storybook args change as well, but the actual component isn't impacted. I confirmed that everything behaves as expected in the sandbox, leading me to believe this is a Storybook-FAST integration issue.
After poking around a little, my guess is that there is a bug between FAST's
html
function and Storybook - we follow the suggested Storybook syntax exactly, but the docs refer mostly to lit-html. There's not a lot of information about FAST and Storybook together, so I didn't have a lot of luck in finding a work around within Storybook.The workaround for now is just working with the sandbox to develop components using the binding method for attributes, but I do think this is something important to solve in the near-ish term.
The text was updated successfully, but these errors were encountered: