Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Angular - view not updated after first ngOnChanges call with initial inputs #17331

Closed
Quetute opened this issue Jan 25, 2022 · 3 comments
Closed

Comments

@Quetute
Copy link

Quetute commented Jan 25, 2022

Describe the bug

Our Angular component expects that ngOnChanges is called at initialization time and the view is correctly updated according to the initial input.
The actual behavior is that while ngOnChanges is called, the view is not updated.

From Angular documentation:

[ngOnChanges] Called before ngOnInit() (if the component has bound inputs) and whenever one or more data-bound input properties change.

Our component rely on this behavior to not have to execute the same code twice in ngOnInit and ngOnChanges.

To Reproduce
https://github.com/Quetute/storybook-angular-initial-input-issue

System

Environment Info:

System:
OS: macOS 11.6
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Binaries:
Node: 16.13.0 - /usr/local/bin/node
Yarn: 3.1.1 - /usr/local/bin/yarn
npm: 8.1.4 - /usr/local/bin/npm
Browsers:
Chrome: 97.0.4692.99
Firefox: 95.0.2
Safari: 14.1.2
npmPackages:
@storybook/addon-actions: ^6.5.0-alpha.23 => 6.5.0-alpha.23
@storybook/addon-docs: ^6.5.0-alpha.23 => 6.5.0-alpha.23
@storybook/addon-essentials: ^6.5.0-alpha.23 => 6.5.0-alpha.23
@storybook/addon-links: ^6.5.0-alpha.23 => 6.5.0-alpha.23
@storybook/angular: ^6.5.0-alpha.23 => 6.5.0-alpha.23
@storybook/builder-webpack5: ^6.5.0-alpha.23 => 6.5.0-alpha.23
@storybook/manager-webpack5: ^6.5.0-alpha.23 => 6.5.0-alpha.23

Additional context

As a workaround, we could copy the logic in the ngOnInit hook and add a check in ngOnChanges that rely on the SimpleChange.isFirstChange() method.

@alc-1
Copy link

alc-1 commented Feb 10, 2022

Had the same issue, but it's actually resolved since version 6.3.16 (#17156).

Since you'r on the alpha version, I guess there's some merging required to make this fix available.. I'm not aware of how it works, but I guess you'll soon get a new version that comes with it. 😄

@rdebeasi
Copy link

I can reproduce this issue on the latest stable version of Storybook. (I'm using Storybook 6.4.19 with Angular 12.1.0).

I've forked @Quetute's demo and updated it to the latest stable version of Storybook, and I can reproduce the issue there as well. Possibly related: #17492

@shilman
Copy link
Member

shilman commented Jun 8, 2023

We’re cleaning house! Storybook has changed a lot since this issue was created and we don’t know if it’s still valid. Please open a new issue referencing this one if:

@shilman shilman closed this as not planned Won't fix, can't repro, duplicate, stale Jun 8, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants