From 0407a2fafbf3219ca825d6871f24985ea77b2f34 Mon Sep 17 00:00:00 2001 From: Jan-Willem Baart Date: Wed, 16 Aug 2023 13:24:51 +0000 Subject: [PATCH 1/2] =?UTF-8?q?test:=20=F0=9F=92=8D=20remove=20ngIf=20erro?= =?UTF-8?q?r=20log?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- projects/testing-library/tests/integrations/ng-mocks.spec.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/projects/testing-library/tests/integrations/ng-mocks.spec.ts b/projects/testing-library/tests/integrations/ng-mocks.spec.ts index a3f141b..6358485 100644 --- a/projects/testing-library/tests/integrations/ng-mocks.spec.ts +++ b/projects/testing-library/tests/integrations/ng-mocks.spec.ts @@ -3,6 +3,7 @@ import { By } from '@angular/platform-browser'; import { MockComponent } from 'ng-mocks'; import { render } from '../../src/public_api'; +import { NgIf } from '@angular/common'; test('sends the correct value to the child input', async () => { const utils = await render(TargetComponent, { @@ -34,6 +35,7 @@ test('sends the correct value to the child input 2', async () => { selector: 'atl-child', template: 'child', standalone: true, + imports: [NgIf], }) class ChildComponent { @ContentChild('something') From 59aba33d008dfba17804726c2b1f9106826d9fd7 Mon Sep 17 00:00:00 2001 From: Jan-Willem Baart Date: Thu, 17 Aug 2023 08:18:02 +0000 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=F0=9F=90=9B=20accept=20query=20para?= =?UTF-8?q?ms=20on=20initial=20route?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit test: 💍 test case for new functionality --- .../src/lib/testing-library.ts | 77 ++++++++++--------- projects/testing-library/tests/render.spec.ts | 28 ++++++- 2 files changed, 67 insertions(+), 38 deletions(-) diff --git a/projects/testing-library/src/lib/testing-library.ts b/projects/testing-library/src/lib/testing-library.ts index 974402f..48af2d5 100644 --- a/projects/testing-library/src/lib/testing-library.ts +++ b/projects/testing-library/src/lib/testing-library.ts @@ -112,8 +112,45 @@ export async function render( const zone = safeInject(NgZone); const router = safeInject(Router); + const _navigate = async (elementOrPath: Element | string, basePath = ''): Promise => { + const href = typeof elementOrPath === 'string' ? elementOrPath : elementOrPath.getAttribute('href'); + const [path, params] = (basePath + href).split('?'); + const queryParams = params + ? params.split('&').reduce((qp, q) => { + const [key, value] = q.split('='); + const currentValue = qp[key]; + if (typeof currentValue === 'undefined') { + qp[key] = value; + } else if (Array.isArray(currentValue)) { + qp[key] = [...currentValue, value]; + } else { + qp[key] = [currentValue, value]; + } + return qp; + }, {} as Record) + : undefined; - if (initialRoute) await router.navigate([initialRoute]); + const navigateOptions: NavigationExtras | undefined = queryParams + ? { + queryParams, + } + : undefined; + + const doNavigate = () => { + return navigateOptions ? router?.navigate([path], navigateOptions) : router?.navigate([path]); + }; + + let result; + + if (zone) { + await zone.run(() => (result = doNavigate())); + } else { + result = doNavigate(); + } + return result ?? false; + }; + + if (initialRoute) await _navigate(initialRoute); if (typeof router?.initialNavigation === 'function') { if (zone) { @@ -167,43 +204,9 @@ export async function render( }; const navigate = async (elementOrPath: Element | string, basePath = ''): Promise => { - const href = typeof elementOrPath === 'string' ? elementOrPath : elementOrPath.getAttribute('href'); - const [path, params] = (basePath + href).split('?'); - const queryParams = params - ? params.split('&').reduce((qp, q) => { - const [key, value] = q.split('='); - const currentValue = qp[key]; - if (typeof currentValue === 'undefined') { - qp[key] = value; - } else if (Array.isArray(currentValue)) { - qp[key] = [...currentValue, value]; - } else { - qp[key] = [currentValue, value]; - } - return qp; - }, {} as Record) - : undefined; - - const navigateOptions: NavigationExtras | undefined = queryParams - ? { - queryParams, - } - : undefined; - - const doNavigate = () => { - return navigateOptions ? router?.navigate([path], navigateOptions) : router?.navigate([path]); - }; - - let result; - - if (zone) { - await zone.run(() => (result = doNavigate())); - } else { - result = doNavigate(); - } - + const result = await _navigate(elementOrPath, basePath); detectChanges(); - return result ?? false; + return result; }; return { diff --git a/projects/testing-library/tests/render.spec.ts b/projects/testing-library/tests/render.spec.ts index 4b546e0..f7b1927 100644 --- a/projects/testing-library/tests/render.spec.ts +++ b/projects/testing-library/tests/render.spec.ts @@ -14,7 +14,9 @@ import { import { NoopAnimationsModule, BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { TestBed } from '@angular/core/testing'; import { render, fireEvent, screen } from '../src/public_api'; -import { Resolve, RouterModule } from '@angular/router'; +import { ActivatedRoute, Resolve, RouterModule } from '@angular/router'; +import { map } from 'rxjs'; +import { AsyncPipe, NgIf } from '@angular/common'; @Component({ selector: 'atl-fixture', @@ -365,6 +367,30 @@ describe('initialRoute', () => { expect(screen.queryByText('Secondary Component')).not.toBeInTheDocument(); expect(screen.getByText('button')).toBeInTheDocument(); }); + + it('allows initially rendering a specific route with query parameters', async () => { + @Component({ + standalone: true, + selector: 'atl-query-param-fixture', + template: `

paramPresent$: {{ paramPresent$ | async }}

`, + imports: [NgIf, AsyncPipe], + }) + class QueryParamFixtureComponent { + constructor(public route: ActivatedRoute) {} + + paramPresent$ = this.route.queryParams.pipe(map((queryParams) => (queryParams?.param ? 'present' : 'missing'))); + } + + const initialRoute = 'initial-route?param=query'; + const routes = [{ path: 'initial-route', component: QueryParamFixtureComponent }]; + + await render(RouterFixtureComponent, { + initialRoute, + routes, + }); + + expect(screen.getByText(/present/i)).toBeVisible(); + }); }); describe('configureTestBed', () => {