Skip to content

Commit db551f6

Browse files
timdeschryvertimdeschryver
authored
feat: Angular 17 🚀 (#417)
1 parent c0a95c6 commit db551f6

File tree

13 files changed

+103
-80
lines changed

13 files changed

+103
-80
lines changed

‎.github/workflows/ci.yml

+2-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,8 @@ jobs:
3333
with:
3434
node-version: ${{ matrix.node-version }}
3535
- name: install
36-
run: npm install
36+
# ng-mocks needs to add ng 17 to their peer dependencies
37+
run: npm install --force
3738
- name: build
3839
run: npm run build -- --skip-nx-cache
3940
- name: test

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@
2828
# misc
2929
/.angular/cache
3030
.angular
31+
.nx
3132
.cache
3233
/.sass-cache
3334
/connect.lock

‎.prettierignore

+2
Original file line numberDiff line numberDiff line change
@@ -53,3 +53,5 @@ deployment.yaml
5353
# System Files
5454
.DS_Store
5555
Thumbs.db
56+
57+
/.nx/cache

‎README.md

+1
Original file line numberDiff line numberDiff line change
@@ -164,6 +164,7 @@ You may also be interested in installing `jest-dom` so you can use
164164

165165
| Angular | Angular Testing Library |
166166
| ------- | ----------------------- |
167+
| 17.x | 13.x, 14.x |
167168
| 16.x | 13.x, 14.x |
168169
| >= 15.1 | 13.x \|\| 14.x |
169170
| < 15.1 | 11.x \|\| 12.x |

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

+3-3
Original file line numberDiff line numberDiff line change
@@ -43,16 +43,16 @@
4343
"executor": "@angular-devkit/build-angular:dev-server",
4444
"configurations": {
4545
"production": {
46-
"browserTarget": "example-app-karma:build:production"
46+
"buildTarget": "example-app-karma:build:production"
4747
},
4848
"development": {
49-
"browserTarget": "example-app-karma:build:development"
49+
"buildTarget": "example-app-karma:build:development"
5050
}
5151
},
5252
"defaultConfiguration": "development"
5353
},
5454
"lint": {
55-
"executor": "@nx/linter:eslint",
55+
"executor": "@nx/eslint:lint",
5656
"options": {
5757
"lintFilePatterns": [
5858
"apps/example-app-karma/**/*.ts",

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import 'zone.js';
2-
import 'zone.js/dist/zone-testing';
2+
import 'zone.js/testing';
33
import { getTestBed } from '@angular/core/testing';
44
import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
55
import JasmineDOM from '@testing-library/jasmine-dom';

‎apps/example-app/project.json

+6-5
Original file line numberDiff line numberDiff line change
@@ -44,22 +44,22 @@
4444
"executor": "@angular-devkit/build-angular:dev-server",
4545
"configurations": {
4646
"production": {
47-
"browserTarget": "example-app:build:production"
47+
"buildTarget": "example-app:build:production"
4848
},
4949
"development": {
50-
"browserTarget": "example-app:build:development"
50+
"buildTarget": "example-app:build:development"
5151
}
5252
},
5353
"defaultConfiguration": "development"
5454
},
5555
"extract-i18n": {
5656
"executor": "@angular-devkit/build-angular:extract-i18n",
5757
"options": {
58-
"browserTarget": "example-app:build"
58+
"buildTarget": "example-app:build"
5959
}
6060
},
6161
"lint": {
62-
"executor": "@nx/linter:eslint",
62+
"executor": "@nx/eslint:lint",
6363
"options": {
6464
"lintFilePatterns": ["apps/example-app/**/*.ts", "apps/example-app/**/*.html", "apps/example-app/src/**/*.html"]
6565
},
@@ -68,7 +68,8 @@
6868
"test": {
6969
"executor": "@nx/jest:jest",
7070
"options": {
71-
"jestConfig": "apps/example-app/jest.config.ts"
71+
"jestConfig": "apps/example-app/jest.config.ts",
72+
"passWithNoTests": false
7273
},
7374
"outputs": ["{workspaceRoot}/coverage/"]
7475
}

‎nx.json

+25-11
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
2-
"npmScope": "testing-library",
32
"affected": {
43
"defaultBase": "main"
54
},
@@ -17,13 +16,9 @@
1716
},
1817
"tasksRunnerOptions": {
1918
"default": {
20-
"runner": "nx-cloud",
2119
"options": {
22-
"accessToken": "M2Q4YjlkNjMtMzY1NC00ZjkwLTk1ZjgtZjg5Y2VkMzFjM2FifHJlYWQtd3JpdGU=",
23-
"cacheableOperations": ["build", "test", "lint", "e2e"],
2420
"canTrackAnalytics": false,
25-
"showUsageWarnings": true,
26-
"parallel": 3
21+
"showUsageWarnings": true
2722
}
2823
}
2924
},
@@ -69,13 +64,29 @@
6964
"targetDefaults": {
7065
"build": {
7166
"dependsOn": ["^build"],
72-
"inputs": ["production", "^production"]
67+
"inputs": ["production", "^production"],
68+
"cache": true
7369
},
7470
"test": {
75-
"inputs": ["default", "^production"]
71+
"inputs": ["default", "^production"],
72+
"cache": true
7673
},
7774
"lint": {
78-
"inputs": ["default", "{workspaceRoot}/.eslintrc.json"]
75+
"inputs": ["default", "{workspaceRoot}/.eslintrc.json"],
76+
"cache": true
77+
},
78+
"@nx/jest:jest": {
79+
"inputs": ["default", "^production"],
80+
"cache": true,
81+
"options": {
82+
"passWithNoTests": true
83+
},
84+
"configurations": {
85+
"ci": {
86+
"ci": true,
87+
"codeCoverage": true
88+
}
89+
}
7990
}
8091
},
8192
"namedInputs": {
@@ -88,7 +99,10 @@
8899
"!{projectRoot}/karma.conf.js",
89100
"!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)?(.snap)",
90101
"!{projectRoot}/jest.config.[jt]s",
91-
"!{projectRoot}/.eslintrc.json"
102+
"!{projectRoot}/.eslintrc.json",
103+
"!{projectRoot}/src/test-setup.[jt]s"
92104
]
93-
}
105+
},
106+
"nxCloudAccessToken": "M2Q4YjlkNjMtMzY1NC00ZjkwLTk1ZjgtZjg5Y2VkMzFjM2FifHJlYWQtd3JpdGU=",
107+
"parallel": 3
94108
}

‎package.json

+39-40
Original file line numberDiff line numberDiff line change
@@ -28,55 +28,53 @@
2828
"prepare": "git config core.hookspath .githooks"
2929
},
3030
"dependencies": {
31-
"@angular/animations": "16.0.0",
32-
"@angular/cdk": "16.0.0",
33-
"@angular/common": "16.0.0",
34-
"@angular/compiler": "16.0.0",
35-
"@angular/core": "16.0.0",
36-
"@angular/material": "16.0.0",
37-
"@angular/platform-browser": "16.0.0",
38-
"@angular/platform-browser-dynamic": "16.0.0",
39-
"@angular/router": "16.0.0",
40-
"@ngrx/store": "16.0.0",
41-
"@nx/angular": "16.1.4",
31+
"@angular/animations": "17.0.2",
32+
"@angular/cdk": "17.0.0",
33+
"@angular/common": "17.0.2",
34+
"@angular/compiler": "17.0.2",
35+
"@angular/core": "17.0.2",
36+
"@angular/material": "17.0.0",
37+
"@angular/platform-browser": "17.0.2",
38+
"@angular/platform-browser-dynamic": "17.0.2",
39+
"@angular/router": "17.0.2",
40+
"@ngrx/store": "17.0.0-rc.0",
41+
"@nx/angular": "17.1.1",
4242
"@testing-library/dom": "^9.0.0",
43-
"nx-cloud": "16.0.5",
4443
"rxjs": "7.8.0",
4544
"tslib": "~2.3.1",
46-
"zone.js": "0.13.0"
45+
"zone.js": "0.14.2"
4746
},
4847
"devDependencies": {
49-
"@angular-devkit/build-angular": "16.0.0",
50-
"@angular-devkit/core": "16.0.0",
51-
"@angular-devkit/schematics": "16.0.0",
52-
"@angular-eslint/builder": "16.0.0",
53-
"@angular-eslint/eslint-plugin": "16.0.1",
54-
"@angular-eslint/eslint-plugin-template": "16.0.1",
55-
"@angular-eslint/schematics": "16.0.0",
56-
"@angular-eslint/template-parser": "16.0.1",
57-
"@angular/cli": "~16.0.0",
58-
"@angular/compiler-cli": "16.0.0",
59-
"@angular/forms": "16.0.0",
60-
"@angular/language-service": "16.0.0",
61-
"@nx/eslint-plugin": "16.1.4",
62-
"@nx/jest": "16.1.4",
63-
"@nx/linter": "16.1.4",
64-
"@nx/node": "16.1.4",
65-
"@nx/plugin": "16.1.4",
66-
"@nx/workspace": "16.1.4",
67-
"@schematics/angular": "16.0.0",
48+
"@angular-devkit/build-angular": "17.0.0",
49+
"@angular-devkit/core": "17.0.0",
50+
"@angular-devkit/schematics": "17.0.0",
51+
"@angular-eslint/builder": "17.0.1",
52+
"@angular-eslint/eslint-plugin": "17.0.1",
53+
"@angular-eslint/eslint-plugin-template": "17.0.1",
54+
"@angular-eslint/schematics": "17.0.1",
55+
"@angular-eslint/template-parser": "17.0.1",
56+
"@angular/cli": "~17.0.0",
57+
"@angular/compiler-cli": "17.0.2",
58+
"@angular/forms": "17.0.2",
59+
"@angular/language-service": "17.0.2",
60+
"@nx/eslint-plugin": "17.1.1",
61+
"@nx/jest": "17.1.1",
62+
"@nx/node": "17.1.1",
63+
"@nx/plugin": "17.1.1",
64+
"@nx/workspace": "17.1.1",
65+
"@schematics/angular": "17.0.0",
6866
"@testing-library/jasmine-dom": "^1.2.0",
6967
"@testing-library/jest-dom": "^5.16.5",
7068
"@testing-library/user-event": "^14.4.3",
7169
"@types/jasmine": "4.3.1",
7270
"@types/jest": "29.5.1",
7371
"@types/node": "20.1.4",
7472
"@types/testing-library__jasmine-dom": "^1.3.0",
75-
"@typescript-eslint/eslint-plugin": "5.58.0",
76-
"@typescript-eslint/parser": "5.58.0",
73+
"@typescript-eslint/eslint-plugin": "6.9.1",
74+
"@typescript-eslint/parser": "6.9.1",
7775
"cpy-cli": "^3.1.1",
78-
"eslint": "8.15.0",
79-
"eslint-config-prettier": "8.3.0",
76+
"eslint": "8.46.0",
77+
"eslint-config-prettier": "9.0.0",
8078
"eslint-plugin-import": "~2.25.4",
8179
"eslint-plugin-jasmine": "~4.1.3",
8280
"eslint-plugin-jest": "~25.3.4",
@@ -86,16 +84,16 @@
8684
"jasmine-spec-reporter": "7.0.0",
8785
"jest": "29.5.0",
8886
"jest-environment-jsdom": "29.5.0",
89-
"jest-preset-angular": "13.1.0",
87+
"jest-preset-angular": "13.1.3",
9088
"karma": "6.4.0",
9189
"karma-chrome-launcher": "^3.1.0",
9290
"karma-coverage": "^2.2.1",
9391
"karma-jasmine": "5.1.0",
9492
"karma-jasmine-html-reporter": "2.0.0",
9593
"lint-staged": "^12.1.6",
9694
"ng-mocks": "^14.11.0",
97-
"ng-packagr": "16.0.0",
98-
"nx": "16.1.4",
95+
"ng-packagr": "17.0.0",
96+
"nx": "17.1.1",
9997
"postcss": "^8.4.5",
10098
"postcss-import": "14.1.0",
10199
"postcss-preset-env": "7.5.0",
@@ -105,6 +103,7 @@
105103
"semantic-release": "^18.0.0",
106104
"ts-jest": "29.1.0",
107105
"ts-node": "10.9.1",
108-
"typescript": "5.0.3"
106+
"typescript": "5.2.2",
107+
"@nx/eslint": "17.1.1"
109108
}
110109
}

‎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": ">= 15.1.0 || >= 16.0.0",
33-
"@angular/platform-browser": ">= 15.1.0 || >= 16.0.0",
34-
"@angular/router": ">= 15.1.0 || >= 16.0.0",
35-
"@angular/core": ">= 15.1.0 || >= 16.0.0"
32+
"@angular/common": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0",
33+
"@angular/platform-browser": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0",
34+
"@angular/router": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0",
35+
"@angular/core": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0"
3636
},
3737
"dependencies": {
3838
"@testing-library/dom": "^9.0.0",

‎projects/testing-library/project.json

+4-4
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,7 @@
99
"executor": "@nx/angular:package",
1010
"outputs": ["{workspaceRoot}/dist/@testing-library/angular"],
1111
"options": {
12-
"project": "projects/testing-library/ng-package.json",
13-
"updateBuildableProjectDepsInPackageJson": false
12+
"project": "projects/testing-library/ng-package.json"
1413
},
1514
"configurations": {
1615
"production": {
@@ -23,7 +22,7 @@
2322
"defaultConfiguration": "production"
2423
},
2524
"lint": {
26-
"executor": "@nx/linter:eslint",
25+
"executor": "@nx/eslint:lint",
2726
"options": {
2827
"lintFilePatterns": ["projects/testing-library/**/*.ts", "projects/testing-library/**/*.html"]
2928
},
@@ -49,7 +48,8 @@
4948
"test": {
5049
"executor": "@nx/jest:jest",
5150
"options": {
52-
"jestConfig": "projects/testing-library/jest.config.ts"
51+
"jestConfig": "projects/testing-library/jest.config.ts",
52+
"passWithNoTests": false
5353
},
5454
"outputs": ["{workspaceRoot}/coverage/projects/testing-library"]
5555
}

‎projects/testing-library/tests/issues/issue-396-standalone-stub-child.spec.ts

+7-5
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
11
import { Component } from '@angular/core';
22
import { render, screen } from '../../src/public_api';
33

4-
test('child', async () => {
5-
await render(FixtureComponent);
6-
expect(screen.getByText('Hello from child')).toBeInTheDocument();
7-
});
8-
94
test('stub', async () => {
105
await render(FixtureComponent, {
116
componentImports: [StubComponent],
@@ -31,6 +26,11 @@ test('configure', async () => {
3126
expect(screen.getByText('Hello from stub')).toBeInTheDocument();
3227
});
3328

29+
test('child', async () => {
30+
await render(FixtureComponent);
31+
expect(screen.getByText('Hello from child')).toBeInTheDocument();
32+
});
33+
3434
@Component({
3535
selector: 'atl-child',
3636
template: `Hello from child`,
@@ -42,6 +42,8 @@ class ChildComponent {}
4242
selector: 'atl-child',
4343
template: `Hello from stub`,
4444
standalone: true,
45+
// eslint-disable-next-line @angular-eslint/no-host-metadata-property, @typescript-eslint/naming-convention
46+
host: { 'collision-id': StubComponent.name },
4547
})
4648
class StubComponent {}
4749

‎projects/testing-library/tests/render.spec.ts

+8-6
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,8 @@ describe('standalone with child', () => {
6868
selector: 'atl-child-fixture',
6969
template: `<span>A mock child fixture</span>`,
7070
standalone: true,
71+
// eslint-disable-next-line @angular-eslint/no-host-metadata-property, @typescript-eslint/naming-convention
72+
host: { 'collision-id': MockChildFixtureComponent.name },
7173
})
7274
class MockChildFixtureComponent {}
7375

@@ -80,18 +82,18 @@ describe('standalone with child', () => {
8082
})
8183
class ParentFixtureComponent {}
8284

83-
it('renders the standalone component with child', async () => {
84-
await render(ParentFixtureComponent);
85-
expect(screen.getByText('Parent fixture')).toBeInTheDocument();
86-
expect(screen.getByText('A child fixture')).toBeInTheDocument();
87-
});
88-
8985
it('renders the standalone component with a mocked child', async () => {
9086
await render(ParentFixtureComponent, { componentImports: [MockChildFixtureComponent] });
9187
expect(screen.getByText('Parent fixture')).toBeInTheDocument();
9288
expect(screen.getByText('A mock child fixture')).toBeInTheDocument();
9389
});
9490

91+
it('renders the standalone component with child', async () => {
92+
await render(ParentFixtureComponent);
93+
expect(screen.getByText('Parent fixture')).toBeInTheDocument();
94+
expect(screen.getByText('A child fixture')).toBeInTheDocument();
95+
});
96+
9597
it('rejects render of template with componentImports set', () => {
9698
const view = render(`<div><atl-parent-fixture></atl-parent-fixture></div>`, {
9799
imports: [ParentFixtureComponent],

0 commit comments

Comments
 (0)