wc-storybook-helpers
wc-storybook-helpers copied to clipboard
syncControls() overwrites attributes set from a component internally
Context
We have an input component, which has custom-invalid as an attribute. custom-invalid is controlled from storybook and when set, it sets invalid on the host from the inside and out. We use invalid to determine the styling of the input.
Problem
It appears that when invalid is set, the call to syncControls() in the template function removes the invalid attribute since it's not part of the controls or arguments.
Possible solution
We don't understand the purpose of syncControls() fully and we did a fork and removed that line in getTemplate() which seems to solve our problem. It doesn't seem to cause any other issues with our storybook AFAIK.
That function syncs the attributes with the Storybook controls. If attributes are updated from within the component, it will update the values in the control.
Is the invalid attribute settable or is it a side effect from the custom-invalid attribute being set?