diff --git a/projects/testing-library/src/lib/testing-library.ts b/projects/testing-library/src/lib/testing-library.ts index 5c6b0f2..66cb819 100644 --- a/projects/testing-library/src/lib/testing-library.ts +++ b/projects/testing-library/src/lib/testing-library.ts @@ -133,12 +133,7 @@ export async function render( >, ) => { const newComponentInputs = properties?.componentInputs ?? {}; - for (const inputKey of renderedInputKeys) { - if (!Object.prototype.hasOwnProperty.call(newComponentInputs, inputKey)) { - delete (fixture.componentInstance as any)[inputKey]; - } - } - setComponentInputs(fixture, newComponentInputs); + const changesInComponentInput = update(fixture, renderedInputKeys, newComponentInputs, setComponentInputs); renderedInputKeys = Object.keys(newComponentInputs); const newComponentOutputs = properties?.componentOutputs ?? {}; @@ -151,11 +146,15 @@ export async function render( renderedOutputKeys = Object.keys(newComponentOutputs); const newComponentProps = properties?.componentProperties ?? {}; - const changes = updateProps(fixture, renderedPropKeys, newComponentProps); + const changesInComponentProps = update(fixture, renderedPropKeys, newComponentProps, setComponentProperties); + renderedPropKeys = Object.keys(newComponentProps); + if (hasOnChangesHook(fixture.componentInstance)) { - fixture.componentInstance.ngOnChanges(changes); + fixture.componentInstance.ngOnChanges({ + ...changesInComponentInput, + ...changesInComponentProps, + }); } - renderedPropKeys = Object.keys(newComponentProps); if (properties?.detectChangesOnRender !== false) { fixture.componentRef.injector.get(ChangeDetectorRef).detectChanges(); @@ -361,27 +360,32 @@ function getChangesObj(oldProps: Record | null, newProps: Record( +function update( fixture: ComponentFixture, - prevRenderedPropsKeys: string[], - newProps: Record, + prevRenderedKeys: string[], + newValues: Record, + updateFunction: ( + fixture: ComponentFixture, + values: RenderTemplateOptions['componentInputs' | 'componentProperties'], + ) => void, ) { const componentInstance = fixture.componentInstance as Record; const simpleChanges: SimpleChanges = {}; - for (const key of prevRenderedPropsKeys) { - if (!Object.prototype.hasOwnProperty.call(newProps, key)) { + for (const key of prevRenderedKeys) { + if (!Object.prototype.hasOwnProperty.call(newValues, key)) { simpleChanges[key] = new SimpleChange(componentInstance[key], undefined, false); delete componentInstance[key]; } } - for (const [key, value] of Object.entries(newProps)) { + for (const [key, value] of Object.entries(newValues)) { if (value !== componentInstance[key]) { simpleChanges[key] = new SimpleChange(componentInstance[key], value, false); } } - setComponentProperties(fixture, newProps); + + updateFunction(fixture, newValues); return simpleChanges; } diff --git a/projects/testing-library/tests/rerender.spec.ts b/projects/testing-library/tests/rerender.spec.ts index 2e5ee4c..9c25257 100644 --- a/projects/testing-library/tests/rerender.spec.ts +++ b/projects/testing-library/tests/rerender.spec.ts @@ -48,7 +48,7 @@ test('rerenders the component with updated inputs', async () => { expect(screen.getByText(firstName)).toBeInTheDocument(); }); -test('rerenders the component with updated props and resets other props', async () => { +test('rerenders the component with updated inputs and resets other props', async () => { const firstName = 'Mark'; const lastName = 'Peeters'; const { rerender } = await render(FixtureComponent, {