Skip to content

Commit 6ae1363

Browse files
timdeschryvertimdeschryver
authored
feat: release v13 (#327)
* feat: update to Angular 15 * feat: rename ɵcomponentImports to componentImports BREAKING CHANGE: The render property ɵcomponentImports is not experimental anymore, and is renamed to componentImports BEFORE: ```ts render(ParentComponent, { ɵcomponentImports: [ChildComponent], }); ``` AFTER: ```ts render(ParentComponent, { componentImports: [ChildComponent], }); ``` * docs: update material inputs example (#324) * fix: don't fire router events on render (#325) Closes #318 * fix: don't invoke ngOnChanges when no properties are provided (#326) Closes #323 BREAKING CHANGE: This change is made to have the same behavior as the run time behavior. BEFORE: The `ngOnChanges` lifecycle is always invoked when a component is rendered. AFTER: The `ngOnChanges` lifecycle is only invoked if a component is rendered with `componentProperties`. * feat: add more fine-grained control over inputs and outputs (#328) BREAKING CHANGE: `rerender` expects properties to be wrapped in an object containing `componentProperties` (or `componentInputs` and `componentOutputs` to have a more fine-grained control). BEFORE: ```ts await render(PersonComponent, { componentProperties: { name: 'Sarah' } }); await rerender({ name: 'Sarah 2' }); ``` AFTER: ```ts await render(PersonComponent, { componentProperties: { name: 'Sarah' } }); await rerender({ componentProperties: { name: 'Sarah 2' } }); ``` * feat: add ability to turn off auto detect changes (#329) * chore: update peer dependencies (#330) BREAKING CHANGE: BEFORE: The minimum version of Angular is v14.0.0 AFTER: The minimum version of Angular is v14.1.0 * feat: childComponentOverrides is stable (#338) * fix: invoke changeChanges once on input change (#339) * feat: remove detectChanges in favor of detectChangesOnRender (#341) BREAKING CHANGE: The config property detectChanges is renamed to detectChangesOnRender. BEFORE: ```ts const component = await render(AppComponent, { detectChanges: false }); ``` AFTER: ```ts const component = await render(AppComponent, { detectChangesOnRender: false }); ``` * test: extra tests for ngOnChanges (#342) * test: add test example for harness (#343)
1 parent 63c27e2 commit 6ae1363

30 files changed

+574
-225
lines changed

‎.github/workflows/ci.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ jobs:
2727
with:
2828
node-version: ${{ matrix.node-version }}
2929
- name: install
30-
run: npm install
30+
run: npm install --legacy-peer-deps
3131
- name: build
3232
run: npm run build -- --skip-nx-cache
3333
- name: test

‎apps/example-app-karma/.browserslistrc

-17
This file was deleted.

‎apps/example-app-karma/project.json

+1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{
2+
"name": "example-app-karma",
23
"$schema": "../../node_modules/nx/schemas/project-schema.json",
34
"projectType": "application",
45
"sourceRoot": "apps/example-app-karma/src",

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ it('https://github.com/testing-library/angular-testing-library/issues/222 with r
99

1010
expect(screen.getByText('Hello Sarah')).toBeTruthy();
1111

12-
await rerender({ name: 'Mark' });
12+
await rerender({ componentProperties: { name: 'Mark' } });
1313

1414
expect(screen.getByText('Hello Mark')).toBeTruthy();
1515
});

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

-6
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,5 @@ beforeEach(() => {
99
jasmine.addMatchers(JasmineDOM);
1010
});
1111

12-
declare const require: any;
13-
1412
// First, initialize the Angular testing environment.
1513
getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {});
16-
// Then we find all the tests.
17-
const context = require.context('./', true, /\.spec\.ts$/);
18-
// And load the modules.
19-
context.keys().map(context);

‎apps/example-app-karma/tsconfig.app.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
"compilerOptions": {
44
"outDir": "../../dist/out-tsc",
55
"types": [],
6-
"allowJs": true
6+
"allowJs": true,
7+
"target": "ES2022",
8+
"useDefineForClassFields": false
79
},
810
"files": ["src/main.ts", "src/polyfills.ts"],
911
"include": ["src/**/*.d.ts"],

‎apps/example-app-karma/tsconfig.spec.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22
"extends": "./tsconfig.json",
33
"compilerOptions": {
44
"outDir": "./out-tsc/spec",
5-
"types": ["jasmine", "node", "@testing-library/jasmine-dom"]
5+
"types": ["jasmine", "node", "@testing-library/jasmine-dom"],
6+
"target": "ES2022",
7+
"useDefineForClassFields": false
68
},
79
"files": ["src/test.ts", "src/polyfills.ts"],
810
"include": ["**/*.spec.ts", "**/*.d.ts"]

‎apps/example-app/.browserslistrc

-17
This file was deleted.

‎apps/example-app/project.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{
2+
"name": "example-app",
23
"$schema": "../../node_modules/nx/schemas/project-schema.json",
34
"projectType": "application",
45
"sourceRoot": "apps/example-app/src",
@@ -75,7 +76,7 @@
7576
"options": {
7677
"jestConfig": "apps/example-app/jest.config.ts"
7778
},
78-
"outputs": ["coverage/"]
79+
"outputs": ["{workspaceRoot}/coverage/"]
7980
}
8081
},
8182
"tags": []

‎apps/example-app/src/app/app-routing.module.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export const routes: Routes = [
9595
];
9696

9797
@NgModule({
98-
imports: [RouterModule.forRoot(routes, { relativeLinkResolution: 'legacy' })],
98+
imports: [RouterModule.forRoot(routes, {})],
9999
exports: [RouterModule],
100100
})
101101
export class AppRoutingModule {}

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

+3
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,12 @@ import { UntypedFormBuilder, Validators } from '@angular/forms';
66
template: `
77
<form [formGroup]="form" name="form">
88
<mat-form-field>
9+
<mat-label>Name</mat-label>
910
<input matInput placeholder="Name" name="name" formControlName="name" required />
1011
</mat-form-field>
1112
1213
<mat-form-field>
14+
<mat-label>Score</mat-label>
1315
<input
1416
matInput
1517
type="number"
@@ -23,6 +25,7 @@ import { UntypedFormBuilder, Validators } from '@angular/forms';
2325
</mat-form-field>
2426
2527
<mat-form-field>
28+
<mat-label>Color</mat-label>
2629
<mat-select placeholder="Color" name="color" formControlName="color">
2730
<mat-select-trigger>
2831
{{ colorControlDisplayValue }}

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ test('should run logic in the input setter and getter while re-rendering', async
3030
expect(screen.getByTestId('value')).toHaveTextContent('I am value from setter Angular');
3131
expect(screen.getByTestId('value-getter')).toHaveTextContent('I am value from getter Angular');
3232

33-
await rerender({ value: 'React' });
33+
await rerender({ componentProperties: { value: 'React' } });
3434

3535
// note we have to re-query because the elements are not the same anymore
3636
expect(screen.getByTestId('value')).toHaveTextContent('I am value from setter React');

‎apps/example-app/src/app/examples/20-test-harness.spec.ts

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
2+
import { MatButtonHarness } from '@angular/material/button/testing';
3+
import { MatSnackBarHarness } from '@angular/material/snack-bar/testing';
4+
import { render, screen } from '@testing-library/angular';
5+
import user from '@testing-library/user-event';
6+
7+
import { SnackBarComponent } from './20-test-harness';
8+
9+
test('can be used with TestHarness', async () => {
10+
const view = await render(`<app-harness></app-harness>`, {
11+
imports: [SnackBarComponent],
12+
});
13+
const loader = TestbedHarnessEnvironment.documentRootLoader(view.fixture);
14+
15+
const buttonHarness = await loader.getHarness(MatButtonHarness);
16+
const button = await buttonHarness.host();
17+
button.click();
18+
19+
const snackbarHarness = await loader.getHarness(MatSnackBarHarness);
20+
expect(await snackbarHarness.getMessage()).toMatch(/Pizza Party!!!/i);
21+
});
22+
23+
test('can be used in combination with TestHarness', async () => {
24+
const view = await render(SnackBarComponent);
25+
const loader = TestbedHarnessEnvironment.documentRootLoader(view.fixture);
26+
27+
user.click(screen.getByRole('button'));
28+
29+
const snackbarHarness = await loader.getHarness(MatSnackBarHarness);
30+
expect(await snackbarHarness.getMessage()).toMatch(/Pizza Party!!!/i);
31+
32+
expect(screen.getByText(/Pizza Party!!!/i)).toBeInTheDocument();
33+
});

‎apps/example-app/src/app/examples/20-test-harness.ts

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { Component } from '@angular/core';
2+
import { MatButtonModule } from '@angular/material/button';
3+
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
4+
5+
@Component({
6+
selector: 'app-harness',
7+
standalone: true,
8+
imports: [MatButtonModule, MatSnackBarModule],
9+
template: `
10+
<button mat-stroked-button (click)="openSnackBar()" aria-label="Show an example snack-bar">Pizza party</button>
11+
`,
12+
})
13+
export class SnackBarComponent {
14+
constructor(private snackBar: MatSnackBar) {}
15+
16+
openSnackBar() {
17+
return this.snackBar.open('Pizza Party!!!');
18+
}
19+
}

‎apps/example-app/tsconfig.app.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
"outDir": "../../dist/out-tsc",
55
"types": [],
66
"allowJs": true,
7-
"target": "ES2020"
7+
"target": "ES2022",
8+
"useDefineForClassFields": false
89
},
910
"files": ["src/main.ts", "src/polyfills.ts"],
1011
"include": ["src/**/*.d.ts"],

‎nx.json

+21-8
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,6 @@
1515
"environment": "all"
1616
}
1717
},
18-
"implicitDependencies": {
19-
"package.json": {
20-
"dependencies": "*",
21-
"devDependencies": "*"
22-
},
23-
".eslintrc.json": "*"
24-
},
2518
"tasksRunnerOptions": {
2619
"default": {
2720
"runner": "@nrwl/nx-cloud",
@@ -75,7 +68,27 @@
7568
"$schema": "./node_modules/nx/schemas/nx-schema.json",
7669
"targetDefaults": {
7770
"build": {
78-
"dependsOn": ["^build"]
71+
"dependsOn": ["^build"],
72+
"inputs": ["production", "^production"]
73+
},
74+
"test": {
75+
"inputs": ["default", "^production"]
76+
},
77+
"lint": {
78+
"inputs": ["default", "{workspaceRoot}/.eslintrc.json"]
7979
}
80+
},
81+
"namedInputs": {
82+
"default": ["{projectRoot}/**/*", "sharedGlobals"],
83+
"sharedGlobals": [],
84+
"production": [
85+
"default",
86+
"!{projectRoot}/**/*.spec.[jt]s",
87+
"!{projectRoot}/tsconfig.spec.json",
88+
"!{projectRoot}/karma.conf.js",
89+
"!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)?(.snap)",
90+
"!{projectRoot}/jest.config.[jt]s",
91+
"!{projectRoot}/.eslintrc.json"
92+
]
8093
}
8194
}

‎package.json

+34-34
Original file line numberDiff line numberDiff line change
@@ -28,51 +28,51 @@
2828
"prepare": "git config core.hookspath .githooks"
2929
},
3030
"dependencies": {
31-
"@angular/animations": "14.1.3",
32-
"@angular/cdk": "14.1.3",
33-
"@angular/common": "14.1.3",
34-
"@angular/compiler": "14.1.3",
35-
"@angular/core": "14.1.3",
36-
"@angular/material": "14.1.3",
37-
"@angular/platform-browser": "14.1.3",
38-
"@angular/platform-browser-dynamic": "14.1.3",
39-
"@angular/router": "14.1.3",
31+
"@angular/animations": "15.0.0",
32+
"@angular/cdk": "15.0.0",
33+
"@angular/common": "15.0.0",
34+
"@angular/compiler": "15.0.0",
35+
"@angular/core": "15.0.0",
36+
"@angular/material": "15.0.0",
37+
"@angular/platform-browser": "15.0.0",
38+
"@angular/platform-browser-dynamic": "15.0.0",
39+
"@angular/router": "15.0.0",
4040
"@ngrx/store": "14.0.2",
41-
"@nrwl/angular": "14.5.8",
42-
"@nrwl/nx-cloud": "14.4.1",
41+
"@nrwl/angular": "15.2.1",
42+
"@nrwl/nx-cloud": "15.0.2",
4343
"@testing-library/dom": "^8.11.1",
4444
"rxjs": "7.5.6",
4545
"tslib": "~2.3.1",
4646
"zone.js": "~0.11.4"
4747
},
4848
"devDependencies": {
49-
"@angular-devkit/build-angular": "14.1.3",
49+
"@angular-devkit/build-angular": "15.0.0",
5050
"@angular-eslint/builder": "14.0.2",
51-
"@angular-eslint/eslint-plugin": "14.0.2",
52-
"@angular-eslint/eslint-plugin-template": "14.0.2",
51+
"@angular-eslint/eslint-plugin": "14.0.4",
52+
"@angular-eslint/eslint-plugin-template": "14.0.4",
5353
"@angular-eslint/schematics": "14.0.2",
54-
"@angular-eslint/template-parser": "14.0.2",
55-
"@angular/cli": "~14.1.0",
56-
"@angular/compiler-cli": "14.1.3",
57-
"@angular/forms": "14.1.3",
58-
"@angular/language-service": "14.1.3",
59-
"@nrwl/cli": "14.5.8",
60-
"@nrwl/eslint-plugin-nx": "14.5.8",
61-
"@nrwl/jest": "14.5.8",
62-
"@nrwl/linter": "14.5.8",
63-
"@nrwl/node": "14.5.8",
64-
"@nrwl/nx-plugin": "14.5.8",
65-
"@nrwl/workspace": "14.5.8",
54+
"@angular-eslint/template-parser": "14.0.4",
55+
"@angular/cli": "~15.0.0",
56+
"@angular/compiler-cli": "15.0.0",
57+
"@angular/forms": "15.0.0",
58+
"@angular/language-service": "15.0.0",
59+
"@nrwl/cli": "15.2.1",
60+
"@nrwl/eslint-plugin-nx": "15.2.1",
61+
"@nrwl/jest": "15.2.1",
62+
"@nrwl/linter": "15.2.1",
63+
"@nrwl/node": "15.2.1",
64+
"@nrwl/nx-plugin": "15.2.1",
65+
"@nrwl/workspace": "15.2.1",
6666
"@swc-node/register": "^1.4.2",
6767
"@swc/core": "^1.2.173",
6868
"@testing-library/jasmine-dom": "^1.2.0",
6969
"@testing-library/jest-dom": "^5.15.1",
7070
"@testing-library/user-event": "^13.5.0",
7171
"@types/jasmine": "4.0.3",
72-
"@types/jest": "28.1.7",
72+
"@types/jest": "28.1.8",
7373
"@types/node": "18.7.1",
74-
"@typescript-eslint/eslint-plugin": "5.29.0",
75-
"@typescript-eslint/parser": "5.29.0",
74+
"@typescript-eslint/eslint-plugin": "5.36.1",
75+
"@typescript-eslint/parser": "5.36.1",
7676
"cpy-cli": "^3.1.1",
7777
"eslint": "8.15.0",
7878
"eslint-config-prettier": "8.3.0",
@@ -84,15 +84,15 @@
8484
"jasmine-core": "4.2.0",
8585
"jasmine-spec-reporter": "7.0.0",
8686
"jest": "28.1.3",
87-
"jest-environment-jsdom": "^28.1.1",
88-
"jest-preset-angular": "12.1.0",
87+
"jest-environment-jsdom": "28.1.3",
88+
"jest-preset-angular": "12.2.2",
8989
"karma": "6.4.0",
9090
"karma-chrome-launcher": "^3.1.0",
9191
"karma-jasmine": "5.1.0",
9292
"karma-jasmine-html-reporter": "2.0.0",
9393
"lint-staged": "^12.1.6",
94-
"ng-packagr": "14.1.0",
95-
"nx": "14.5.8",
94+
"ng-packagr": "15.0.0",
95+
"nx": "15.2.1",
9696
"postcss": "^8.4.5",
9797
"postcss-import": "14.1.0",
9898
"postcss-preset-env": "7.5.0",
@@ -102,6 +102,6 @@
102102
"semantic-release": "^18.0.0",
103103
"ts-jest": "28.0.8",
104104
"ts-node": "10.9.1",
105-
"typescript": "4.7.4"
105+
"typescript": "4.8.4"
106106
}
107107
}

‎projects/testing-library/package.json

+4-4
Original file line numberDiff line numberDiff line change
@@ -29,10 +29,10 @@
2929
"migrations": "./schematics/migrations/migration.json"
3030
},
3131
"peerDependencies": {
32-
"@angular/common": ">= 14.0.0",
33-
"@angular/platform-browser": ">= 14.0.0",
34-
"@angular/router": ">= 14.0.0",
35-
"@angular/core": ">= 14.0.0"
32+
"@angular/common": ">= 14.1.0",
33+
"@angular/platform-browser": ">= 14.1.0",
34+
"@angular/router": ">= 14.1.0",
35+
"@angular/core": ">= 14.1.0"
3636
},
3737
"dependencies": {
3838
"@testing-library/dom": "^8.0.0",

0 commit comments

Comments
 (0)