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

Explain how ngOnChange hook behaves during unit tests #44072

Open
rooby opened this issue Nov 5, 2021 · 3 comments
Open

Explain how ngOnChange hook behaves during unit tests #44072

rooby opened this issue Nov 5, 2021 · 3 comments
Labels
area: docs Related to the documentation area: testing Issues related to Angular testing features, such as TestBed P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Milestone

Comments

@rooby
Copy link

rooby commented Nov 5, 2021

Description

There seems to be a lot of people unaware of the unexpected behaviour of ngOnChange not being called when doing something like:

TestBed.configureTestingModule({}).compileComponents().then(() => {
    fixture = TestBed.createComponent();
    fixture.detectChanges();
});

It is not obvious that ngOnChange will not be called when doing this, therefore please provide a clarification in the testing docs.
It would be great to also provide some strategy/strategies for how to test a component which depends on the ngOnChange hook.

Issue taken from angular/angular.io#3277
Relating to #9866

What is the affected URL?

No response

Please provide the steps to reproduce the issue

No response

Please provide the expected behavior vs the actual behavior you encountered

No response

Please provide a screenshot if possible

No response

Please provide the exception or error you saw

No response

Is this a browser-specific issue? If so, please specify the device, browser, and version.

No response

@petebacondarwin
Copy link
Member

I think the testing strategy is to call the ngOnChanges() directly.
We should update the docs to point out that if a component is created programmatically then it does not exist in a context that would trigger this life-cycle hook automatically, so must be done manually when setting properties on the component.

@pkozlowski-opensource pkozlowski-opensource added the area: testing Issues related to Angular testing features, such as TestBed label Nov 9, 2021
@josmar-crwdstffng josmar-crwdstffng added docsarea: change-detect P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent labels Jun 28, 2022
@ngbot ngbot bot modified the milestones: needsTriage, Backlog Jun 28, 2022
@jessicajaniuk
Copy link
Contributor

Fixit Note: We should document that when you're setting inputs on a test component or dynamically created component, do it on the helper.

@coyoteecd
Copy link

@jessicajaniuk which helper?

@JeanMeche JeanMeche added area: adev Angular.dev documentation and removed area: aio labels Feb 21, 2024
@JeanMeche JeanMeche added area: docs Related to the documentation and removed area: adev Angular.dev documentation labels Apr 23, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area: docs Related to the documentation area: testing Issues related to Angular testing features, such as TestBed P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Development

No branches or pull requests

9 participants