From 6130dad1777b289ec8a8f0a76370be02cdda7921 Mon Sep 17 00:00:00 2001
From: timdeschryver <28659384+timdeschryver@users.noreply.github.com>
Date: Fri, 30 Oct 2020 19:39:35 +0100
Subject: [PATCH] fix: call navigate correctly without queryparams

---
 .../src/lib/testing-library.ts                | 15 ++++---
 .../testing-library/tests/find-by.spec.ts     |  2 +-
 .../testing-library/tests/navigate.spec.ts    | 41 +++++++++++++++++++
 3 files changed, 51 insertions(+), 7 deletions(-)
 create mode 100644 projects/testing-library/tests/navigate.spec.ts

diff --git a/projects/testing-library/src/lib/testing-library.ts b/projects/testing-library/src/lib/testing-library.ts
index 819f8760..8f4067b5 100644
--- a/projects/testing-library/src/lib/testing-library.ts
+++ b/projects/testing-library/src/lib/testing-library.ts
@@ -2,7 +2,7 @@ import { Component, Type, NgZone, SimpleChange, OnChanges, SimpleChanges } from
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { Router } from '@angular/router';
+import { NavigationExtras, Router } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
 import {
   getQueriesForElement as dtlGetQueriesForElement,
@@ -10,7 +10,6 @@ import {
   waitFor as dtlWaitFor,
   waitForElementToBeRemoved as dtlWaitForElementToBeRemoved,
   screen as dtlScreen,
-  queries as dtlQueries,
   waitForOptions as dtlWaitForOptions,
   configure as dtlConfigure,
 } from '@testing-library/dom';
@@ -134,15 +133,19 @@ export async function render<SutType, WrapperType = SutType>(
     const queryParams = params
       ? params.split('&').reduce((qp, q) => {
           const [key, value] = q.split('=');
+          // TODO(Breaking): group same keys qp[key] ? [...qp[key], value] : value
           qp[key] = value;
           return qp;
         }, {})
       : undefined;
 
-    const doNavigate = () =>
-      router.navigate([path], {
-        queryParams,
-      });
+    const navigateOptions: NavigationExtras = queryParams
+      ? {
+          queryParams,
+        }
+      : undefined;
+
+    const doNavigate = () => (navigateOptions ? router.navigate([path], navigateOptions) : router.navigate([path]));
 
     let result;
 
diff --git a/projects/testing-library/tests/find-by.spec.ts b/projects/testing-library/tests/find-by.spec.ts
index ab531f46..791fa215 100644
--- a/projects/testing-library/tests/find-by.spec.ts
+++ b/projects/testing-library/tests/find-by.spec.ts
@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
 import { timer } from 'rxjs';
 import { render, screen } from '../src/public_api';
-import { mapTo, timeout } from 'rxjs/operators';
+import { mapTo } from 'rxjs/operators';
 
 @Component({
   selector: 'fixture',
diff --git a/projects/testing-library/tests/navigate.spec.ts b/projects/testing-library/tests/navigate.spec.ts
new file mode 100644
index 00000000..d26dde3b
--- /dev/null
+++ b/projects/testing-library/tests/navigate.spec.ts
@@ -0,0 +1,41 @@
+import { Component } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { Router } from '@angular/router';
+import { render } from '../src/public_api';
+
+@Component({
+  selector: 'fixture',
+  template: ``,
+})
+class FixtureComponent {}
+
+test('should navigate correctly', async () => {
+  const { navigate } = await render(FixtureComponent, {
+    routes: [{ path: 'details', component: FixtureComponent }],
+  });
+
+  const router = TestBed.inject(Router);
+  const navSpy = jest.spyOn(router, 'navigate');
+
+  navigate('details');
+
+  expect(navSpy).toBeCalledWith(['details']);
+});
+
+test('should pass queryParams if provided', async () => {
+  const { navigate } = await render(FixtureComponent, {
+    routes: [{ path: 'details', component: FixtureComponent }],
+  });
+
+  const router = TestBed.inject(Router);
+  const navSpy = jest.spyOn(router, 'navigate');
+
+  navigate('details?sortBy=name&sortOrder=asc');
+
+  expect(navSpy).toBeCalledWith(['details'], {
+    queryParams: {
+      sortBy: 'name',
+      sortOrder: 'asc',
+    },
+  });
+});