[Angular] Addon Controls "reset functionality" does not reset a component to its Initial State

[akhilesh85]

Describe the bug
When we use the reset functionality under the controls tab, it does not reset the component to its initial state.

To Reproduce
Steps to reproduce the behavior:

1. Go to controls
2. Update the Input for both text and select controls
3. Click on the reset button under the controls
4. The values reset under controls but the component instance variables do not resets

Expected behavior
When we reset the controls it should also reset all the component's instance ie., to its initial state.

Screenshots

Code snippets
1-Label.stories.ts.txt
label.component.ts.txt

System:
System:
OS: Windows 10 10.0.18362
CPU: (4) x64 Intel(R) Core(TM) i5 CPU M 460 @ 2.53GHz
Binaries:
Node: 12.16.1 - C:\Program Files\nodejs\node.EXE
npm: 6.13.4 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: 44.18362.449.0
npmPackages:
@storybook/addon-actions: ^6.0.0-rc.11 => 6.0.0-rc.11
@storybook/addon-controls: ^6.0.0-rc.11 => 6.0.0-rc.11
@storybook/addon-docs: ^6.0.0-rc.11 => 6.0.0-rc.11
@storybook/addon-links: ^6.0.0-rc.11 => 6.0.0-rc.11
@storybook/angular: ^6.0.0-rc.11 => 6.0.0-rc.11

[akhilesh85]

Hi @shilman

Do you want me to provide more details or are we good? I don't have a hosted storybook repo. Let me know how can I achieve this? Going forward I can publish my Issues there itself. Thanks.

Regards,
Akhilesh

[shilman]

I added your component/stories to the storybook repo. It doesn't repro exactly as you describe it (i think), but it does show something weird that we can discuss and either fix in storybook itself or as suggestions for how to write args stories for angular. I think we're good for now!

[akhilesh85]

I added your component/stories to the storybook repo. It doesn't repro exactly as you describe it (i think), but it does show something weird that we can discuss and either fix in storybook itself or as suggestions for how to write args stories for angular. I think we're good for now!

Sure, thanks @shilman 😊👍🏻

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[tmeasday]

@akhilesh85

I took a look at this. I'm not an angular expert so apologies in advance for my ignorance. I'm looking at the stories that @shilman added in 0670442 which appear to show the same behaviour as you reported.

What I am seeing is that when I reset the controls, the Template is rendered with:

args = {
  text: 'Default Label',
  bgColor: undefined,
}

I think this is technically correct, at least from the perspective of args. I am not sure if it is a bug in @storybook/angular or our documentation or your component implementation that when bgColor is passed in undefined the component does not reset itself back to its initial value. What would you expect to happen?

[shilman]

Yo-ho-ho!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.2.0-alpha.2 containing PR #13215 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease

Closing this issue. Please re-open if you think there's still more to do.