-
Notifications
You must be signed in to change notification settings - Fork 306
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test(examples): add Angular 17 test app (#2198)
Co-authored-by: michael faith <michaelfaith@users.noreply.github.com>
- Loading branch information
1 parent
90797e5
commit fcf39a2
Showing
97 changed files
with
16,568 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
# Editor configuration, see https://editorconfig.org | ||
root = true | ||
|
||
[*] | ||
charset = utf-8 | ||
indent_style = space | ||
indent_size = 2 | ||
insert_final_newline = true | ||
trim_trailing_whitespace = true | ||
|
||
[*.ts] | ||
quote_type = single | ||
|
||
[*.md] | ||
max_line_length = off | ||
trim_trailing_whitespace = false |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
# See http://help.github.com/ignore-files/ for more about ignoring files. | ||
|
||
# Compiled output | ||
/dist | ||
/tmp | ||
/out-tsc | ||
# Only exists if Bazel was run | ||
/bazel-out | ||
|
||
# Node | ||
/node_modules | ||
npm-debug.log | ||
yarn-error.log | ||
|
||
# profiling files | ||
chrome-profiler-events*.json | ||
|
||
# IDEs and editors | ||
.idea/ | ||
.project | ||
.classpath | ||
.c9/ | ||
*.launch | ||
.settings/ | ||
*.sublime-workspace | ||
|
||
# Visual Studio Code | ||
.vscode/* | ||
!.vscode/settings.json | ||
!.vscode/tasks.json | ||
!.vscode/launch.json | ||
!.vscode/extensions.json | ||
.history/* | ||
|
||
# Miscellaneous | ||
/.angular/cache | ||
.sass-cache/ | ||
/connect.lock | ||
/coverage | ||
/libpeerconnection.log | ||
testem.log | ||
/typings | ||
|
||
# System files | ||
.DS_Store | ||
Thumbs.db |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
# ExampleAppV14 | ||
|
||
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.0.0. | ||
|
||
## Development server | ||
|
||
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. | ||
|
||
## Code scaffolding | ||
|
||
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. | ||
|
||
## Build | ||
|
||
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. | ||
|
||
## Running unit tests | ||
|
||
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). | ||
|
||
## Running end-to-end tests | ||
|
||
Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities. | ||
|
||
## Further help | ||
|
||
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,96 @@ | ||
{ | ||
"$schema": "./node_modules/@angular/cli/lib/config/schema.json", | ||
"version": 1, | ||
"cli": { | ||
"packageManager": "yarn" | ||
}, | ||
"newProjectRoot": "projects", | ||
"projects": { | ||
"example-app-v17": { | ||
"projectType": "application", | ||
"root": "", | ||
"sourceRoot": "src", | ||
"prefix": "app", | ||
"architect": { | ||
"build": { | ||
"builder": "@angular-devkit/build-angular:application", | ||
"options": { | ||
"outputPath": "dist/example-app-v17", | ||
"index": "src/index.html", | ||
"browser": "src/main.ts", | ||
"polyfills": ["zone.js"], | ||
"tsConfig": "tsconfig.app.json", | ||
"assets": [ | ||
"src/favicon.ico", | ||
"src/assets" | ||
], | ||
"styles": [ | ||
"src/styles.css" | ||
], | ||
"scripts": [] | ||
}, | ||
"configurations": { | ||
"production": { | ||
"budgets": [ | ||
{ | ||
"type": "initial", | ||
"maximumWarning": "500kb", | ||
"maximumError": "1mb" | ||
}, | ||
{ | ||
"type": "anyComponentStyle", | ||
"maximumWarning": "2kb", | ||
"maximumError": "4kb" | ||
} | ||
], | ||
"outputHashing": "all" | ||
}, | ||
"development": { | ||
"optimization": false, | ||
"extractLicenses": false, | ||
"sourceMap": true, | ||
"namedChunks": true | ||
} | ||
}, | ||
"defaultConfiguration": "production" | ||
}, | ||
"serve": { | ||
"builder": "@angular-devkit/build-angular:dev-server", | ||
"configurations": { | ||
"production": { | ||
"buildTarget": "example-app-v17:build:production" | ||
}, | ||
"development": { | ||
"buildTarget": "example-app-v17:build:development" | ||
} | ||
}, | ||
"defaultConfiguration": "development" | ||
}, | ||
"extract-i18n": { | ||
"builder": "@angular-devkit/build-angular:extract-i18n", | ||
"options": { | ||
"buildTarget": "example-app-v17:build" | ||
} | ||
}, | ||
"test": { | ||
"builder": "@angular-devkit/build-angular:karma", | ||
"options": { | ||
"polyfills": [ | ||
"zone.js", | ||
"zone.js/testing" | ||
], | ||
"tsConfig": "tsconfig.spec.json", | ||
"assets": [ | ||
"src/favicon.ico", | ||
"src/assets" | ||
], | ||
"styles": [ | ||
"src/styles.css" | ||
], | ||
"scripts": [] | ||
} | ||
} | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import jestCfg from './jest-esm.config.mjs'; | ||
|
||
/** @type {import('ts-jest/dist/types').JestConfigWithTsJest} */ | ||
const jestIsolatedCfg = { | ||
...jestCfg, | ||
transform: { | ||
'^.+\\.(ts|js|html|svg)$': [ | ||
'jest-preset-angular', | ||
{ | ||
tsconfig: '<rootDir>/tsconfig-esm.spec.json', | ||
stringifyContentPathRegex: '\\.(html|svg)$', | ||
isolatedModules: true, | ||
useESM: true, | ||
}, | ||
], | ||
}, | ||
}; | ||
|
||
export default jestIsolatedCfg; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
import ngPreset from 'jest-preset-angular/presets/index.js'; | ||
|
||
globalThis.ngJest = { | ||
tsconfig: 'tsconfig-esm.spec.json', | ||
}; | ||
|
||
/** @type {import('ts-jest/dist/types').JestConfigWithTsJest} */ | ||
const jestConfig = { | ||
...ngPreset.defaultsESM, | ||
moduleNameMapper: { | ||
tslib: 'tslib/tslib.es6.js', | ||
rxjs: '<rootDir>/node_modules/rxjs/dist/bundles/rxjs.umd.js', | ||
}, | ||
setupFilesAfterEnv: ['<rootDir>/setup-jest-esm.ts'], | ||
transform: { | ||
'^.+\\.(ts|js|html|svg)$': [ | ||
'jest-preset-angular', | ||
{ | ||
tsconfig: '<rootDir>/tsconfig-esm.spec.json', | ||
stringifyContentPathRegex: '\\.(html|svg)$', | ||
useESM: true, | ||
}, | ||
], | ||
}, | ||
}; | ||
|
||
export default jestConfig; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
import { jest } from '@jest/globals'; | ||
|
||
Object.defineProperty(window, 'CSS', { value: null }); | ||
|
||
Object.defineProperty(document, 'doctype', { | ||
value: '<!DOCTYPE html>', | ||
}); | ||
|
||
Object.defineProperty(window, 'getComputedStyle', { | ||
value: () => { | ||
return { | ||
display: 'none', | ||
appearance: ['-webkit-appearance'], | ||
}; | ||
}, | ||
}); | ||
|
||
/** | ||
* ISSUE: https://github.com/angular/material2/issues/7101 | ||
* Workaround for JSDOM missing transform property | ||
*/ | ||
Object.defineProperty(document.body.style, 'transform', { | ||
value: () => { | ||
return { | ||
enumerable: true, | ||
configurable: true, | ||
}; | ||
}, | ||
}); | ||
|
||
HTMLCanvasElement.prototype.getContext = <typeof HTMLCanvasElement.prototype.getContext>jest.fn(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
const jestCfg = require('./jest.config'); | ||
const { defaultTransformerOptions } = require('jest-preset-angular/presets'); | ||
|
||
/** @type {import('ts-jest/dist/types').JestConfigWithTsJest} */ | ||
module.exports = { | ||
...jestCfg, | ||
transform: { | ||
'^.+\\.(ts|js|mjs|html|svg)$': [ | ||
'jest-preset-angular', | ||
{ | ||
...defaultTransformerOptions, | ||
isolatedModules: true, | ||
}, | ||
], | ||
}, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
const { pathsToModuleNameMapper } = require('ts-jest'); | ||
const { paths } = require('./tsconfig.json').compilerOptions; | ||
|
||
// eslint-disable-next-line no-undef | ||
globalThis.ngJest = { | ||
tsconfig: 'tsconfig.spec.json', | ||
}; | ||
|
||
/** @type {import('ts-jest/dist/types').JestConfigWithTsJest} */ | ||
module.exports = { | ||
preset: 'jest-preset-angular', | ||
moduleNameMapper: pathsToModuleNameMapper(paths, { prefix: '<rootDir>' }), | ||
setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'], | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
{ | ||
"name": "example-app-v17", | ||
"version": "17.0.0", | ||
"scripts": { | ||
"ng": "ng", | ||
"start": "ng serve", | ||
"build": "ng build", | ||
"test": "jest --no-cache", | ||
"test-isolated": "jest -c=jest-isolated.config.js --no-cache", | ||
"test-esm": "node --experimental-vm-modules --no-warnings node_modules/jest/bin/jest.js -c=jest-esm.config.mjs --no-cache", | ||
"test-esm-isolated": "node --experimental-vm-modules --no-warnings node_modules/jest/bin/jest.js -c=jest-esm-isolated.config.mjs --no-cache" | ||
}, | ||
"private": true, | ||
"dependencies": { | ||
"@angular/animations": "^17.0.0", | ||
"@angular/common": "^17.0.0", | ||
"@angular/compiler": "^17.0.0", | ||
"@angular/core": "^17.0.0", | ||
"@angular/forms": "^17.0.0", | ||
"@angular/platform-browser": "^17.0.0", | ||
"@angular/platform-browser-dynamic": "^17.0.0", | ||
"@angular/router": "^17.0.0", | ||
"angular-in-memory-web-api": "^0.16.0", | ||
"rxjs": "^7.8.1", | ||
"tslib": "^2.6.2", | ||
"zone.js": "~0.14.2" | ||
}, | ||
"devDependencies": { | ||
"@angular-devkit/build-angular": "^17.0.0", | ||
"@angular/cli": "^17.0.0", | ||
"@angular/compiler-cli": "^17.0.0", | ||
"@types/jest": "^29.5.7", | ||
"@types/node": "^18.18.8", | ||
"jest": "^29.7.0", | ||
"jest-preset-angular": "^13.1.4", | ||
"typescript": "~5.2.2" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
import 'jest-preset-angular/setup-jest.mjs'; | ||
import './jest-global-mocks'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
import 'jest-preset-angular/setup-jest'; | ||
import './jest-global-mocks'; |
33 changes: 33 additions & 0 deletions
33
examples/example-app-v17/src/app/about/about.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; | ||
import { ComponentFixture, TestBed } from '@angular/core/testing'; | ||
import { jest } from '@jest/globals'; | ||
import { of } from 'rxjs'; | ||
|
||
import { HighlightDirective } from '../shared/highlight.directive'; | ||
import { TwainService } from '../twain/twain.service'; | ||
|
||
import { AboutComponent } from './about.component'; | ||
|
||
let fixture: ComponentFixture<AboutComponent>; | ||
|
||
describe('AboutComponent (highlightDirective)', () => { | ||
beforeEach(() => { | ||
fixture = TestBed.configureTestingModule({ | ||
imports: [AboutComponent, HighlightDirective], | ||
schemas: [CUSTOM_ELEMENTS_SCHEMA], | ||
}) | ||
.overrideProvider(TwainService, { | ||
useValue: { | ||
getQuote: jest.fn().mockReturnValue(of('Test Quote')), | ||
}, | ||
}) | ||
.createComponent(AboutComponent); | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should have skyblue <h2>', () => { | ||
const h2: HTMLElement = fixture.nativeElement.querySelector('h2'); | ||
const bgColor = h2.style.backgroundColor; | ||
expect(bgColor).toBe('skyblue'); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import { Component } from '@angular/core'; | ||
|
||
import { HighlightDirective } from '../shared/highlight.directive'; | ||
import { TwainComponent } from '../twain/twain.component'; | ||
|
||
@Component({ | ||
template: ` | ||
<h2 highlight="skyblue">About</h2> | ||
<h3>Quote of the day:</h3> | ||
<twain-quote></twain-quote> | ||
`, | ||
standalone: true, | ||
imports: [HighlightDirective, TwainComponent], | ||
}) | ||
export class AboutComponent {} |
Oops, something went wrong.