diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 43bb1ff..8c70830 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -33,7 +33,8 @@ jobs: with: node-version: ${{ matrix.node-version }} - name: install - run: npm install + # ng-mocks needs to add ng 17 to their peer dependencies + run: npm install --force - name: build run: npm run build -- --skip-nx-cache - name: test diff --git a/.gitignore b/.gitignore index b1a42cd..215c8cb 100644 --- a/.gitignore +++ b/.gitignore @@ -28,6 +28,7 @@ # misc /.angular/cache .angular +.nx .cache /.sass-cache /connect.lock diff --git a/.prettierignore b/.prettierignore index 9aa8a3d..2bdc4f9 100644 --- a/.prettierignore +++ b/.prettierignore @@ -53,3 +53,5 @@ deployment.yaml # System Files .DS_Store Thumbs.db + +/.nx/cache \ No newline at end of file diff --git a/README.md b/README.md index 97b9f02..de454b1 100644 --- a/README.md +++ b/README.md @@ -164,6 +164,7 @@ You may also be interested in installing `jest-dom` so you can use | Angular | Angular Testing Library | | ------- | ----------------------- | +| 17.x | 13.x, 14.x | | 16.x | 13.x, 14.x | | >= 15.1 | 13.x \|\| 14.x | | < 15.1 | 11.x \|\| 12.x | diff --git a/apps/example-app-karma/project.json b/apps/example-app-karma/project.json index 0243495..bab8526 100644 --- a/apps/example-app-karma/project.json +++ b/apps/example-app-karma/project.json @@ -43,16 +43,16 @@ "executor": "@angular-devkit/build-angular:dev-server", "configurations": { "production": { - "browserTarget": "example-app-karma:build:production" + "buildTarget": "example-app-karma:build:production" }, "development": { - "browserTarget": "example-app-karma:build:development" + "buildTarget": "example-app-karma:build:development" } }, "defaultConfiguration": "development" }, "lint": { - "executor": "@nx/linter:eslint", + "executor": "@nx/eslint:lint", "options": { "lintFilePatterns": [ "apps/example-app-karma/**/*.ts", diff --git a/apps/example-app-karma/src/test.ts b/apps/example-app-karma/src/test.ts index ad4ed9e..e6bf956 100644 --- a/apps/example-app-karma/src/test.ts +++ b/apps/example-app-karma/src/test.ts @@ -1,5 +1,5 @@ import 'zone.js'; -import 'zone.js/dist/zone-testing'; +import 'zone.js/testing'; import { getTestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; import JasmineDOM from '@testing-library/jasmine-dom'; diff --git a/apps/example-app/project.json b/apps/example-app/project.json index 1c1e4ed..2122cfc 100644 --- a/apps/example-app/project.json +++ b/apps/example-app/project.json @@ -44,10 +44,10 @@ "executor": "@angular-devkit/build-angular:dev-server", "configurations": { "production": { - "browserTarget": "example-app:build:production" + "buildTarget": "example-app:build:production" }, "development": { - "browserTarget": "example-app:build:development" + "buildTarget": "example-app:build:development" } }, "defaultConfiguration": "development" @@ -55,11 +55,11 @@ "extract-i18n": { "executor": "@angular-devkit/build-angular:extract-i18n", "options": { - "browserTarget": "example-app:build" + "buildTarget": "example-app:build" } }, "lint": { - "executor": "@nx/linter:eslint", + "executor": "@nx/eslint:lint", "options": { "lintFilePatterns": ["apps/example-app/**/*.ts", "apps/example-app/**/*.html", "apps/example-app/src/**/*.html"] }, @@ -68,7 +68,8 @@ "test": { "executor": "@nx/jest:jest", "options": { - "jestConfig": "apps/example-app/jest.config.ts" + "jestConfig": "apps/example-app/jest.config.ts", + "passWithNoTests": false }, "outputs": ["{workspaceRoot}/coverage/"] } diff --git a/nx.json b/nx.json index ee9746a..7040d68 100644 --- a/nx.json +++ b/nx.json @@ -1,5 +1,4 @@ { - "npmScope": "testing-library", "affected": { "defaultBase": "main" }, @@ -17,13 +16,9 @@ }, "tasksRunnerOptions": { "default": { - "runner": "nx-cloud", "options": { - "accessToken": "M2Q4YjlkNjMtMzY1NC00ZjkwLTk1ZjgtZjg5Y2VkMzFjM2FifHJlYWQtd3JpdGU=", - "cacheableOperations": ["build", "test", "lint", "e2e"], "canTrackAnalytics": false, - "showUsageWarnings": true, - "parallel": 3 + "showUsageWarnings": true } } }, @@ -69,13 +64,29 @@ "targetDefaults": { "build": { "dependsOn": ["^build"], - "inputs": ["production", "^production"] + "inputs": ["production", "^production"], + "cache": true }, "test": { - "inputs": ["default", "^production"] + "inputs": ["default", "^production"], + "cache": true }, "lint": { - "inputs": ["default", "{workspaceRoot}/.eslintrc.json"] + "inputs": ["default", "{workspaceRoot}/.eslintrc.json"], + "cache": true + }, + "@nx/jest:jest": { + "inputs": ["default", "^production"], + "cache": true, + "options": { + "passWithNoTests": true + }, + "configurations": { + "ci": { + "ci": true, + "codeCoverage": true + } + } } }, "namedInputs": { @@ -88,7 +99,10 @@ "!{projectRoot}/karma.conf.js", "!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)?(.snap)", "!{projectRoot}/jest.config.[jt]s", - "!{projectRoot}/.eslintrc.json" + "!{projectRoot}/.eslintrc.json", + "!{projectRoot}/src/test-setup.[jt]s" ] - } + }, + "nxCloudAccessToken": "M2Q4YjlkNjMtMzY1NC00ZjkwLTk1ZjgtZjg5Y2VkMzFjM2FifHJlYWQtd3JpdGU=", + "parallel": 3 } diff --git a/package.json b/package.json index fc7af3d..d8aa9a8 100644 --- a/package.json +++ b/package.json @@ -28,43 +28,41 @@ "prepare": "git config core.hookspath .githooks" }, "dependencies": { - "@angular/animations": "16.0.0", - "@angular/cdk": "16.0.0", - "@angular/common": "16.0.0", - "@angular/compiler": "16.0.0", - "@angular/core": "16.0.0", - "@angular/material": "16.0.0", - "@angular/platform-browser": "16.0.0", - "@angular/platform-browser-dynamic": "16.0.0", - "@angular/router": "16.0.0", - "@ngrx/store": "16.0.0", - "@nx/angular": "16.1.4", + "@angular/animations": "17.0.2", + "@angular/cdk": "17.0.0", + "@angular/common": "17.0.2", + "@angular/compiler": "17.0.2", + "@angular/core": "17.0.2", + "@angular/material": "17.0.0", + "@angular/platform-browser": "17.0.2", + "@angular/platform-browser-dynamic": "17.0.2", + "@angular/router": "17.0.2", + "@ngrx/store": "17.0.0-rc.0", + "@nx/angular": "17.1.1", "@testing-library/dom": "^9.0.0", - "nx-cloud": "16.0.5", "rxjs": "7.8.0", "tslib": "~2.3.1", - "zone.js": "0.13.0" + "zone.js": "0.14.2" }, "devDependencies": { - "@angular-devkit/build-angular": "16.0.0", - "@angular-devkit/core": "16.0.0", - "@angular-devkit/schematics": "16.0.0", - "@angular-eslint/builder": "16.0.0", - "@angular-eslint/eslint-plugin": "16.0.1", - "@angular-eslint/eslint-plugin-template": "16.0.1", - "@angular-eslint/schematics": "16.0.0", - "@angular-eslint/template-parser": "16.0.1", - "@angular/cli": "~16.0.0", - "@angular/compiler-cli": "16.0.0", - "@angular/forms": "16.0.0", - "@angular/language-service": "16.0.0", - "@nx/eslint-plugin": "16.1.4", - "@nx/jest": "16.1.4", - "@nx/linter": "16.1.4", - "@nx/node": "16.1.4", - "@nx/plugin": "16.1.4", - "@nx/workspace": "16.1.4", - "@schematics/angular": "16.0.0", + "@angular-devkit/build-angular": "17.0.0", + "@angular-devkit/core": "17.0.0", + "@angular-devkit/schematics": "17.0.0", + "@angular-eslint/builder": "17.0.1", + "@angular-eslint/eslint-plugin": "17.0.1", + "@angular-eslint/eslint-plugin-template": "17.0.1", + "@angular-eslint/schematics": "17.0.1", + "@angular-eslint/template-parser": "17.0.1", + "@angular/cli": "~17.0.0", + "@angular/compiler-cli": "17.0.2", + "@angular/forms": "17.0.2", + "@angular/language-service": "17.0.2", + "@nx/eslint-plugin": "17.1.1", + "@nx/jest": "17.1.1", + "@nx/node": "17.1.1", + "@nx/plugin": "17.1.1", + "@nx/workspace": "17.1.1", + "@schematics/angular": "17.0.0", "@testing-library/jasmine-dom": "^1.2.0", "@testing-library/jest-dom": "^5.16.5", "@testing-library/user-event": "^14.4.3", @@ -72,11 +70,11 @@ "@types/jest": "29.5.1", "@types/node": "20.1.4", "@types/testing-library__jasmine-dom": "^1.3.0", - "@typescript-eslint/eslint-plugin": "5.58.0", - "@typescript-eslint/parser": "5.58.0", + "@typescript-eslint/eslint-plugin": "6.9.1", + "@typescript-eslint/parser": "6.9.1", "cpy-cli": "^3.1.1", - "eslint": "8.15.0", - "eslint-config-prettier": "8.3.0", + "eslint": "8.46.0", + "eslint-config-prettier": "9.0.0", "eslint-plugin-import": "~2.25.4", "eslint-plugin-jasmine": "~4.1.3", "eslint-plugin-jest": "~25.3.4", @@ -86,7 +84,7 @@ "jasmine-spec-reporter": "7.0.0", "jest": "29.5.0", "jest-environment-jsdom": "29.5.0", - "jest-preset-angular": "13.1.0", + "jest-preset-angular": "13.1.3", "karma": "6.4.0", "karma-chrome-launcher": "^3.1.0", "karma-coverage": "^2.2.1", @@ -94,8 +92,8 @@ "karma-jasmine-html-reporter": "2.0.0", "lint-staged": "^12.1.6", "ng-mocks": "^14.11.0", - "ng-packagr": "16.0.0", - "nx": "16.1.4", + "ng-packagr": "17.0.0", + "nx": "17.1.1", "postcss": "^8.4.5", "postcss-import": "14.1.0", "postcss-preset-env": "7.5.0", @@ -105,6 +103,7 @@ "semantic-release": "^18.0.0", "ts-jest": "29.1.0", "ts-node": "10.9.1", - "typescript": "5.0.3" + "typescript": "5.2.2", + "@nx/eslint": "17.1.1" } } diff --git a/projects/testing-library/package.json b/projects/testing-library/package.json index ea3060e..ac921f4 100644 --- a/projects/testing-library/package.json +++ b/projects/testing-library/package.json @@ -29,10 +29,10 @@ "migrations": "./schematics/migrations/migration.json" }, "peerDependencies": { - "@angular/common": ">= 15.1.0 || >= 16.0.0", - "@angular/platform-browser": ">= 15.1.0 || >= 16.0.0", - "@angular/router": ">= 15.1.0 || >= 16.0.0", - "@angular/core": ">= 15.1.0 || >= 16.0.0" + "@angular/common": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0", + "@angular/platform-browser": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0", + "@angular/router": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0", + "@angular/core": ">= 15.1.0 || >= 16.0.0 || >= 17.0.0" }, "dependencies": { "@testing-library/dom": "^9.0.0", diff --git a/projects/testing-library/project.json b/projects/testing-library/project.json index 9afa822..d54c5f7 100644 --- a/projects/testing-library/project.json +++ b/projects/testing-library/project.json @@ -9,8 +9,7 @@ "executor": "@nx/angular:package", "outputs": ["{workspaceRoot}/dist/@testing-library/angular"], "options": { - "project": "projects/testing-library/ng-package.json", - "updateBuildableProjectDepsInPackageJson": false + "project": "projects/testing-library/ng-package.json" }, "configurations": { "production": { @@ -23,7 +22,7 @@ "defaultConfiguration": "production" }, "lint": { - "executor": "@nx/linter:eslint", + "executor": "@nx/eslint:lint", "options": { "lintFilePatterns": ["projects/testing-library/**/*.ts", "projects/testing-library/**/*.html"] }, @@ -49,7 +48,8 @@ "test": { "executor": "@nx/jest:jest", "options": { - "jestConfig": "projects/testing-library/jest.config.ts" + "jestConfig": "projects/testing-library/jest.config.ts", + "passWithNoTests": false }, "outputs": ["{workspaceRoot}/coverage/projects/testing-library"] } diff --git a/projects/testing-library/tests/issues/issue-396-standalone-stub-child.spec.ts b/projects/testing-library/tests/issues/issue-396-standalone-stub-child.spec.ts index 306297a..2da43b3 100644 --- a/projects/testing-library/tests/issues/issue-396-standalone-stub-child.spec.ts +++ b/projects/testing-library/tests/issues/issue-396-standalone-stub-child.spec.ts @@ -1,11 +1,6 @@ import { Component } from '@angular/core'; import { render, screen } from '../../src/public_api'; -test('child', async () => { - await render(FixtureComponent); - expect(screen.getByText('Hello from child')).toBeInTheDocument(); -}); - test('stub', async () => { await render(FixtureComponent, { componentImports: [StubComponent], @@ -31,6 +26,11 @@ test('configure', async () => { expect(screen.getByText('Hello from stub')).toBeInTheDocument(); }); +test('child', async () => { + await render(FixtureComponent); + expect(screen.getByText('Hello from child')).toBeInTheDocument(); +}); + @Component({ selector: 'atl-child', template: `Hello from child`, @@ -42,6 +42,8 @@ class ChildComponent {} selector: 'atl-child', template: `Hello from stub`, standalone: true, + // eslint-disable-next-line @angular-eslint/no-host-metadata-property, @typescript-eslint/naming-convention + host: { 'collision-id': StubComponent.name }, }) class StubComponent {} diff --git a/projects/testing-library/tests/render.spec.ts b/projects/testing-library/tests/render.spec.ts index f7b1927..56f4608 100644 --- a/projects/testing-library/tests/render.spec.ts +++ b/projects/testing-library/tests/render.spec.ts @@ -68,6 +68,8 @@ describe('standalone with child', () => { selector: 'atl-child-fixture', template: `A mock child fixture`, standalone: true, + // eslint-disable-next-line @angular-eslint/no-host-metadata-property, @typescript-eslint/naming-convention + host: { 'collision-id': MockChildFixtureComponent.name }, }) class MockChildFixtureComponent {} @@ -80,18 +82,18 @@ describe('standalone with child', () => { }) class ParentFixtureComponent {} - it('renders the standalone component with child', async () => { - await render(ParentFixtureComponent); - expect(screen.getByText('Parent fixture')).toBeInTheDocument(); - expect(screen.getByText('A child fixture')).toBeInTheDocument(); - }); - it('renders the standalone component with a mocked child', async () => { await render(ParentFixtureComponent, { componentImports: [MockChildFixtureComponent] }); expect(screen.getByText('Parent fixture')).toBeInTheDocument(); expect(screen.getByText('A mock child fixture')).toBeInTheDocument(); }); + it('renders the standalone component with child', async () => { + await render(ParentFixtureComponent); + expect(screen.getByText('Parent fixture')).toBeInTheDocument(); + expect(screen.getByText('A child fixture')).toBeInTheDocument(); + }); + it('rejects render of template with componentImports set', () => { const view = render(`