Skip to content

Commit 085d120

Browse files
AirbladerAirblader
committed
fix(tests): Added tests for QueryParamGroup#add / #remove
relates #44 Signed-off-by: Ingo Bürk <ingo.buerk@tngtech.com>
1 parent 2d8313b commit 085d120

3 files changed

Lines changed: 244 additions & 0 deletions

File tree

‎projects/ngqp/core/src/lib/model/query-param-group.spec.ts‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -204,4 +204,35 @@ describe(QueryParamGroup.name, () => {
204204
});
205205
}));
206206
});
207+
208+
describe('add', () => {
209+
let group: QueryParamGroup;
210+
beforeEach(() => group = new QueryParamGroup({ q: stringParam }));
211+
212+
it('can add a new parameter to a group', () => {
213+
group.add('test', stringParam);
214+
expect(group.get('test')).toBe(stringParam);
215+
expect(group.value).toEqual({ q: null, test: null });
216+
});
217+
218+
it('throws if the name is already taken', () => {
219+
expect(() => group.add('q', stringParam))
220+
.toThrowError('A parameter with name q already exists.');
221+
});
222+
});
223+
224+
describe('remove', () => {
225+
let group: QueryParamGroup;
226+
beforeEach(() => group = new QueryParamGroup({ q: stringParam }));
227+
228+
it('can remove an existing parameter from a group', () => {
229+
group.remove('q');
230+
expect(group.get('q')).toBeNull();
231+
});
232+
233+
it('throws if the parameter does not exist', () => {
234+
expect(() => group.remove('test'))
235+
.toThrowError('No parameter with name test found.');
236+
});
237+
});
207238
});

‎projects/ngqp/core/src/test/group-add.spec.ts‎

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
import { Component } from '@angular/core';
2+
import { Router } from '@angular/router';
3+
import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
4+
import { RouterTestingModule } from '@angular/router/testing';
5+
import { QueryParamBuilder, QueryParamGroup, QueryParamModule } from '../public_api';
6+
import { captureObservable, scheduler, setupNavigationWarnStub } from './util';
7+
8+
@Component({
9+
template: `
10+
<div [queryParamGroup]="paramGroup">
11+
<input *ngIf="showInput" type="text" queryParamName="param" />
12+
</div>
13+
`,
14+
})
15+
class TestComponent {
16+
17+
public paramGroup: QueryParamGroup;
18+
public showInput = false;
19+
20+
constructor(private qpb: QueryParamBuilder) {
21+
this.paramGroup = qpb.group({});
22+
}
23+
24+
}
25+
26+
describe('QueryParamGroup#add', () => {
27+
let paramGroup: QueryParamGroup;
28+
let fixture: ComponentFixture<TestComponent>;
29+
let component: TestComponent;
30+
let router: Router;
31+
let qpb: QueryParamBuilder;
32+
33+
beforeEach(() => setupNavigationWarnStub());
34+
35+
beforeEach(async(() => {
36+
TestBed.configureTestingModule({
37+
imports: [
38+
RouterTestingModule.withRoutes([]),
39+
QueryParamModule.withConfig(),
40+
],
41+
declarations: [
42+
TestComponent,
43+
],
44+
});
45+
46+
router = TestBed.get(Router);
47+
qpb = TestBed.get(QueryParamBuilder);
48+
TestBed.compileComponents();
49+
router.initialNavigation();
50+
}));
51+
52+
beforeEach(() => {
53+
fixture = TestBed.createComponent(TestComponent);
54+
component = fixture.componentInstance;
55+
fixture.detectChanges();
56+
57+
paramGroup = component.paramGroup;
58+
});
59+
60+
it('adds a parameter with an initial null value if the URL is not set', fakeAsync(() => {
61+
scheduler.run(({ expectObservable }) => {
62+
const value$ = captureObservable(paramGroup.valueChanges);
63+
64+
paramGroup.add('param', qpb.stringParam('q'));
65+
component.showInput = true;
66+
fixture.detectChanges();
67+
68+
expectObservable(value$).toBe('a', {
69+
a: { param: null },
70+
});
71+
});
72+
}));
73+
74+
it('synchronizes a new parameter from the URL', fakeAsync(() => {
75+
scheduler.run(({ expectObservable }) => {
76+
router.navigateByUrl('/?q=Test');
77+
tick();
78+
79+
const value$ = captureObservable(paramGroup.valueChanges);
80+
81+
paramGroup.add('param', qpb.stringParam('q'));
82+
component.showInput = true;
83+
fixture.detectChanges();
84+
85+
expectObservable(value$).toBe('a', {
86+
a: { param: 'Test' },
87+
});
88+
});
89+
}));
90+
91+
it('binds the value accessor correctly', fakeAsync(() => {
92+
paramGroup.add('param', qpb.stringParam('q'));
93+
component.showInput = true;
94+
fixture.detectChanges();
95+
96+
const input = (fixture.nativeElement as HTMLElement).querySelector('input') as HTMLInputElement;
97+
fixture.detectChanges();
98+
99+
input.value = 'Test';
100+
input.dispatchEvent(new Event('input'));
101+
tick();
102+
103+
expect(router.url).toBe('/?q=Test');
104+
}));
105+
});

‎projects/ngqp/core/src/test/group-remove.spec.ts‎

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
import { Component } from '@angular/core';
2+
import { Router } from '@angular/router';
3+
import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
4+
import { RouterTestingModule } from '@angular/router/testing';
5+
import { QueryParamBuilder, QueryParam, QueryParamGroup, QueryParamModule } from '../public_api';
6+
import { captureObservable, scheduler, setupNavigationWarnStub } from './util';
7+
8+
@Component({
9+
template: `
10+
<div [queryParamGroup]="paramGroup">
11+
<input *ngIf="showInput" type="text" queryParamName="param" />
12+
</div>
13+
`,
14+
})
15+
class TestComponent {
16+
17+
public paramGroup: QueryParamGroup;
18+
public param: QueryParam<string>;
19+
public showInput = true;
20+
21+
constructor(private qpb: QueryParamBuilder) {
22+
this.param = qpb.stringParam('q');
23+
this.paramGroup = qpb.group({
24+
param: this.param,
25+
});
26+
}
27+
28+
}
29+
30+
describe('QueryParamGroup#remove', () => {
31+
let paramGroup: QueryParamGroup;
32+
let fixture: ComponentFixture<TestComponent>;
33+
let component: TestComponent;
34+
let router: Router;
35+
let qpb: QueryParamBuilder;
36+
37+
beforeEach(() => setupNavigationWarnStub());
38+
39+
beforeEach(async(() => {
40+
TestBed.configureTestingModule({
41+
imports: [
42+
RouterTestingModule.withRoutes([]),
43+
QueryParamModule.withConfig(),
44+
],
45+
declarations: [
46+
TestComponent,
47+
],
48+
});
49+
50+
router = TestBed.get(Router);
51+
qpb = TestBed.get(QueryParamBuilder);
52+
TestBed.compileComponents();
53+
router.initialNavigation();
54+
}));
55+
56+
beforeEach(() => {
57+
fixture = TestBed.createComponent(TestComponent);
58+
component = fixture.componentInstance;
59+
fixture.detectChanges();
60+
61+
paramGroup = component.paramGroup;
62+
});
63+
64+
it('removes a parameter from value changes', fakeAsync(() => {
65+
scheduler.run(({ expectObservable }) => {
66+
paramGroup.remove('param');
67+
fixture.detectChanges();
68+
69+
const groupValue$ = captureObservable(paramGroup.valueChanges);
70+
const value$ = captureObservable(component.param.valueChanges);
71+
72+
router.navigateByUrl('/?q=Test');
73+
tick();
74+
75+
expectObservable(groupValue$).toBe('a', {
76+
a: {},
77+
});
78+
expectObservable(value$).toBe('');
79+
});
80+
}));
81+
82+
it('detaches the value accessor', fakeAsync(() => {
83+
paramGroup.remove('param');
84+
fixture.detectChanges();
85+
86+
const input = (fixture.nativeElement as HTMLElement).querySelector('input') as HTMLInputElement;
87+
input.value = 'Test';
88+
input.dispatchEvent(new Event('input'));
89+
tick();
90+
91+
expect(router.url).toBe('/');
92+
}));
93+
94+
it('re-attaches the value accessor when the parameter is added back', fakeAsync(() => {
95+
paramGroup.remove('param');
96+
fixture.detectChanges();
97+
98+
paramGroup.add('param', component.param);
99+
fixture.detectChanges();
100+
101+
const input = (fixture.nativeElement as HTMLElement).querySelector('input') as HTMLInputElement;
102+
input.value = 'Test';
103+
input.dispatchEvent(new Event('input'));
104+
tick();
105+
106+
expect(router.url).toBe('/?q=Test');
107+
}));
108+
});

0 commit comments

Comments
 (0)