Skip to content

Commit c9af6ef

Browse files
timdeschryvertimdeschryver
authored
refactor: enable strict mode (#274)
Closes #261
1 parent a9237f2 commit c9af6ef

21 files changed

+108
-105
lines changed

‎apps/example-app-karma/src/test.ts

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,7 @@
22
import 'zone.js/dist/zone-testing';
33
import { getTestBed } from '@angular/core/testing';
44
import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
5-
import JasmineDOM from '@testing-library/jasmine-dom/dist';
6-
7-
beforeAll(() => {
8-
(jasmine.getEnv() as any).addMatchers(JasmineDOM);
9-
});
5+
import '@testing-library/jasmine-dom';
106

117
declare const require: any;
128

‎apps/example-app/src/app/examples/01-nested-component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
55
template: ' <button (click)="raise.emit()">{{ name }}</button> ',
66
})
77
export class NestedButtonComponent {
8-
@Input() name: string;
8+
@Input() name = '';
99
@Output() raise = new EventEmitter<void>();
1010
}
1111

@@ -14,7 +14,7 @@ export class NestedButtonComponent {
1414
template: ' <span data-testid="value">{{ value }}</span> ',
1515
})
1616
export class NestedValueComponent {
17-
@Input() value: number;
17+
@Input() value?: number;
1818
}
1919

2020
@Component({

‎apps/example-app/src/app/examples/03-forms.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Component } from '@angular/core';
2-
import { FormBuilder, Validators, ValidationErrors } from '@angular/forms';
2+
import { FormBuilder, Validators } from '@angular/forms';
33

44
@Component({
55
selector: 'app-fixture',
@@ -46,8 +46,8 @@ export class FormsComponent {
4646
get formErrors() {
4747
return Object.keys(this.form.controls)
4848
.map((formKey) => {
49-
const controlErrors: ValidationErrors = this.form.get(formKey).errors;
50-
if (controlErrors != null) {
49+
const controlErrors = this.form.get(formKey)?.errors;
50+
if (controlErrors) {
5151
return Object.keys(controlErrors).map((keyError) => {
5252
const error = controlErrors[keyError];
5353
switch (keyError) {

‎apps/example-app/src/app/examples/04-forms-with-material.spec.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,5 @@ test('is possible to fill in a form and verify error messages (with the help of
4444
score: 7,
4545
});
4646

47-
// not added to the form?
48-
expect((fixture.componentInstance as MaterialFormsComponent).form.get('color').value).toBe('G');
47+
expect((fixture.componentInstance as MaterialFormsComponent).form?.get('color')?.value).toBe('G');
4948
});

‎apps/example-app/src/app/examples/04-forms-with-material.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Component } from '@angular/core';
2-
import { FormBuilder, Validators, ValidationErrors } from '@angular/forms';
2+
import { FormBuilder, Validators } from '@angular/forms';
33

44
@Component({
55
selector: 'app-fixture',
@@ -68,8 +68,8 @@ export class MaterialFormsComponent {
6868
get formErrors() {
6969
return Object.keys(this.form.controls)
7070
.map((formKey) => {
71-
const controlErrors: ValidationErrors = this.form.get(formKey).errors;
72-
if (controlErrors != null) {
71+
const controlErrors = this.form.get(formKey)?.errors;
72+
if (controlErrors) {
7373
return Object.keys(controlErrors).map((keyError) => {
7474
const error = controlErrors[keyError];
7575
switch (keyError) {

‎apps/example-app/src/app/examples/06-with-ngrx-store.ts

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,12 @@ import { createSelector, Store, createAction, createReducer, on, select } from '
33

44
const increment = createAction('increment');
55
const decrement = createAction('decrement');
6-
const counterReducer = createReducer(
6+
export const reducer = createReducer(
77
0,
88
on(increment, (state) => state + 1),
99
on(decrement, (state) => state - 1),
1010
);
1111

12-
export function reducer(state, action) {
13-
return counterReducer(state, action);
14-
}
15-
1612
const selectValue = createSelector(
1713
(state: any) => state.value,
1814
(value) => value * 10,

‎apps/example-app/src/app/examples/08-directive.spec.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -36,11 +36,11 @@ test('it is possible to test directives with props', async () => {
3636
expect(screen.queryByText(visible)).not.toBeInTheDocument();
3737
expect(screen.queryByText(hidden)).toBeInTheDocument();
3838

39-
fireEvent.mouseOver(screen.queryByText(hidden));
39+
fireEvent.mouseOver(screen.getByText(hidden));
4040
expect(screen.queryByText(hidden)).not.toBeInTheDocument();
4141
expect(screen.queryByText(visible)).toBeInTheDocument();
4242

43-
fireEvent.mouseLeave(screen.queryByText(visible));
43+
fireEvent.mouseLeave(screen.getByText(visible));
4444
expect(screen.queryByText(hidden)).toBeInTheDocument();
4545
expect(screen.queryByText(visible)).not.toBeInTheDocument();
4646
});
@@ -56,11 +56,11 @@ test('it is possible to test directives with props in template', async () => {
5656
expect(screen.queryByText(visible)).not.toBeInTheDocument();
5757
expect(screen.queryByText(hidden)).toBeInTheDocument();
5858

59-
fireEvent.mouseOver(screen.queryByText(hidden));
59+
fireEvent.mouseOver(screen.getByText(hidden));
6060
expect(screen.queryByText(hidden)).not.toBeInTheDocument();
6161
expect(screen.queryByText(visible)).toBeInTheDocument();
6262

63-
fireEvent.mouseLeave(screen.queryByText(visible));
63+
fireEvent.mouseLeave(screen.getByText(visible));
6464
expect(screen.queryByText(hidden)).toBeInTheDocument();
6565
expect(screen.queryByText(visible)).not.toBeInTheDocument();
6666
});

‎apps/example-app/src/app/examples/12-service-component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import { Component, Injectable } from '@angular/core';
22
import { Observable, of } from 'rxjs';
33

44
export class Customer {
5-
id: string;
6-
name: string;
5+
id!: string;
6+
name!: string;
77
}
88

99
@Injectable({

‎apps/example-app/src/app/examples/15-dialog.component.spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,8 +37,8 @@ test('closes the dialog via the backdrop', async () => {
3737

3838
// using fireEvent because of:
3939
// unable to click element as it has or inherits pointer-events set to "none"
40-
// eslint-disable-next-line testing-library/no-node-access
41-
fireEvent.click(document.querySelector('.cdk-overlay-backdrop'));
40+
// eslint-disable-next-line testing-library/no-node-access, @typescript-eslint/no-non-null-assertion
41+
fireEvent.click(document.querySelector('.cdk-overlay-backdrop')!);
4242

4343
await waitForElementToBeRemoved(() => screen.getByRole('dialog'));
4444

‎apps/example-app/src/app/examples/16-input-getter-setter.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,6 @@ export class InputGetterSetter {
1818
return 'I am value from getter ' + this.originalValue;
1919
}
2020

21-
private originalValue: string;
22-
derivedValue: string;
21+
private originalValue?: string;
22+
derivedValue?: string;
2323
}

‎apps/example-app/src/app/issues/issue-254.spec.ts

Lines changed: 22 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1-
/* eslint-disable @typescript-eslint/naming-convention */
21
import { Component, Inject, OnInit } from '@angular/core';
32
import { render, screen } from '@testing-library/angular';
43
import { createMock } from '@testing-library/angular/jest-utils';
54

65
interface Division {
7-
JobType: string;
8-
JobBullets: string[];
9-
Description: string;
6+
jobType?: string;
7+
jobBullets?: string[];
8+
description?: string;
109
}
1110

1211
@Inject({
@@ -21,46 +20,46 @@ class JobsService {
2120
@Component({
2221
selector: 'app-home-career-oportunities',
2322
template: ` <ul class="popu-category-bullets">
24-
<li class="text-dark" *ngFor="let bullet of dedicated.JobBullets">
23+
<li class="text-dark" *ngFor="let bullet of dedicated?.jobBullets">
2524
{{ bullet }}
2625
</li>
2726
</ul>`,
2827
})
2928
class CareerOportunitiesComponent implements OnInit {
30-
dedicated = {} as Division;
31-
intermodal = {} as Division;
32-
noCdl = {} as Division;
33-
otr = {} as Division;
29+
dedicated?: Division;
30+
intermodal?: Division;
31+
noCdl?: Division;
32+
otr?: Division;
3433

3534
constructor(private jobsService: JobsService) {}
3635

3736
ngOnInit(): void {
3837
this.jobsService.divisions().then((apiDivisions) => {
39-
this.dedicated = apiDivisions.find((c) => c.JobType === 'DEDICATED');
40-
this.intermodal = apiDivisions.find((c) => c.JobType === 'INTERMODAL');
41-
this.noCdl = apiDivisions.find((c) => c.JobType === 'NO_CDL');
42-
this.otr = apiDivisions.find((c) => c.JobType === 'OVER_THE_ROAD');
38+
this.dedicated = apiDivisions.find((c) => c.jobType === 'DEDICATED');
39+
this.intermodal = apiDivisions.find((c) => c.jobType === 'INTERMODAL');
40+
this.noCdl = apiDivisions.find((c) => c.jobType === 'NO_CDL');
41+
this.otr = apiDivisions.find((c) => c.jobType === 'OVER_THE_ROAD');
4342
});
4443
}
4544
}
4645

4746
test('Render Component', async () => {
4847
const divisions2: Division[] = [
4948
{
50-
JobType: 'INTERMODAL',
51-
JobBullets: ['Local Routes', 'Flexible Schedules', 'Competitive Pay'],
52-
Description: '',
49+
jobType: 'INTERMODAL',
50+
jobBullets: ['Local Routes', 'Flexible Schedules', 'Competitive Pay'],
51+
description: '',
5352
},
54-
{ JobType: 'NO_CDL', JobBullets: ['We Train', 'We Hire', 'We Pay'], Description: '' },
53+
{ jobType: 'NO_CDL', jobBullets: ['We Train', 'We Hire', 'We Pay'], description: '' },
5554
{
56-
JobType: 'OVER_THE_ROAD',
57-
JobBullets: ['Great Miles', 'Competitive Pay', 'Explore the Country'],
58-
Description: '',
55+
jobType: 'OVER_THE_ROAD',
56+
jobBullets: ['Great Miles', 'Competitive Pay', 'Explore the Country'],
57+
description: '',
5958
},
6059
{
61-
JobType: 'DEDICATED',
62-
JobBullets: ['Regular Routes', 'Consistent Miles', 'Great Pay'],
63-
Description: '',
60+
jobType: 'DEDICATED',
61+
jobBullets: ['Regular Routes', 'Consistent Miles', 'Great Pay'],
62+
description: '',
6463
},
6564
];
6665
const jobService = createMock(JobsService);

‎projects/testing-library/.eslintrc.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,20 @@
22
"extends": "../../.eslintrc.json",
33
"ignorePatterns": ["!**/*"],
44
"overrides": [
5+
{
6+
"files": ["*.ts"],
7+
"rules": {
8+
"@typescript-eslint/ban-ts-comment": "off"
9+
}
10+
},
511
{
612
"files": ["*.ts"],
713
"extends": ["plugin:@nrwl/nx/angular", "plugin:@angular-eslint/template/process-inline-templates"],
814
"parserOptions": {
915
"project": ["projects/testing-library/tsconfig.*?.json"]
1016
},
1117
"rules": {
18+
"@typescript-eslint/ban-ts-comment": "off",
1219
"@angular-eslint/directive-selector": [
1320
"error",
1421
{

‎projects/testing-library/src/lib/models.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -268,8 +268,8 @@ export interface RenderTemplateOptions<WrapperType, Properties extends object =
268268
* `WrapperComponent`, an empty component that strips the `ng-version` attribute
269269
*
270270
* @example
271-
* const component = await render(SpoilerDirective, {
272-
* template: `<div spoiler message='SPOILER'></div>`
271+
* const component = await render(`<div spoiler message='SPOILER'></div>`, {
272+
* declarations: [SpoilerDirective]
273273
* wrapper: CustomWrapperComponent
274274
* })
275275
*/

0 commit comments

Comments
 (0)