Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: support Angular 13 in CJS mode #1122

Merged
merged 1 commit into from
Nov 4, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 2 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,5 @@ node_modules/
src/config/setup-jest.ts
coverage/
website
src/transformers/downlevel_decorators_transform
src/ngtsc
7 changes: 4 additions & 3 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -74,10 +74,11 @@ jobs:
- name: Install
run: yarn --immutable
- name: Run unit tests
run: yarn test
run: yarn test-unit-ci
- name: Run E2E tests in CJS mode
run: yarn e2e-cjs
- name: Run E2E tests in ESM mode
run: yarn e2e-esm
# TODO: Enable when fully support ESM with Angular 13
# - name: Run E2E tests in ESM mode
# run: yarn e2e-esm
- name: Run tests in example projects
run: yarn test-examples
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -17,3 +17,5 @@ e2e/**/.yarn/*
!e2e/**/.yarn/releases
!e2e/**/.yarn/sdks
!e2e/**/.yarn/versions
src/transformers/downlevel_decorators_transform
src/ngtsc
12 changes: 0 additions & 12 deletions e2e/ast-transformers/downlevel-ctor/jest-esm.config.js

This file was deleted.

11 changes: 0 additions & 11 deletions e2e/ast-transformers/downlevel-ctor/jest.config.js

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/** @type {import('ts-jest/dist/types').ProjectConfigTsJest} */
module.exports = {
displayName: 'replace-resources',
displayName: 'ng-jit-transformers',
preset: '<rootDir>/../../../node_modules/ts-jest/presets/default-esm',
globals: {
'ts-jest': {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
/** @type {import('ts-jest/dist/types').ProjectConfigTsJest} */
module.exports = {
displayName: 'replace-resources',
displayName: 'ng-jit-transformers',
globals: {
'ts-jest': {
tsconfig: '<rootDir>/../../tsconfig.json',
stringifyContentPathRegex: '\\.html$',
},
},
resolver: '<rootDir>/../../../build/resolvers/ng-jest-resolver',
setupFilesAfterEnv: ['<rootDir>/../../../setup-jest.js'],
testEnvironment: 'jsdom',
transform: {
'^.+\\.(ts|js|html)$': '<rootDir>/../../../build/index.js',
'^.+\\.(ts|js|mjs|html)$': '<rootDir>/../../../build/index.js',
},
transformIgnorePatterns: ['node_modules/(?!@angular|tslib)'],
};
4 changes: 3 additions & 1 deletion e2e/async/jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,9 @@ module.exports = {
},
},
},
resolver: '<rootDir>/../../build/resolvers/ng-jest-resolver',
testEnvironment: 'jsdom',
setupFilesAfterEnv: ['<rootDir>/../../setup-jest.js'],
transform: { '^.+\\.(ts|js|html)$': '<rootDir>/../../build/index.js' },
transform: { '^.+\\.(ts|mjs|js|html)$': '<rootDir>/../../build/index.js' },
transformIgnorePatterns: ['node_modules/(?!@angular)'],
};
3 changes: 1 addition & 2 deletions e2e/jest-esm.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,7 @@ require('../ngcc-jest-processor');
/** @type {import('ts-jest/dist/types').ProjectConfigTsJest} */
module.exports = {
projects: [
'<rootDir>/ast-transformers/downlevel-ctor/jest-esm.config.js',
'<rootDir>/ast-transformers/replace-resources/jest-esm.config.js',
'<rootDir>/ast-transformers/ng-jit-transformers/jest-esm.config.js',
'<rootDir>/async/jest-esm.config.js',
'<rootDir>/custom-typings/jest-esm.config.js',
'<rootDir>/jest-globals/jest-esm.config.js',
Expand Down
3 changes: 1 addition & 2 deletions e2e/jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,8 @@ require('../ngcc-jest-processor');
/** @type {import('ts-jest/dist/types').ProjectConfigTsJest} */
module.exports = {
projects: [
'<rootDir>/ast-transformers/downlevel-ctor',
'<rootDir>/ast-transformers/hoisting',
'<rootDir>/ast-transformers/replace-resources',
'<rootDir>/ast-transformers/ng-jit-transformers',
'<rootDir>/async',
'<rootDir>/custom-typings',
'<rootDir>/jest-globals',
Expand Down
4 changes: 3 additions & 1 deletion e2e/snapshot-serializers/jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ module.exports = {
stringifyContentPathRegex: '\\.html$',
},
},
resolver: '<rootDir>/../../build/resolvers/ng-jest-resolver',
setupFilesAfterEnv: ['<rootDir>/../../setup-jest.js'],
snapshotSerializers: [
'<rootDir>/../../build/serializers/html-comment',
Expand All @@ -15,6 +16,7 @@ module.exports = {
],
testEnvironment: 'jsdom',
transform: {
'^.+\\.(ts|js|html)$': '<rootDir>/../../build/index.js',
'^.+\\.(ts|js|mjs|html)$': '<rootDir>/../../build/index.js',
},
transformIgnorePatterns: ['node_modules/(?!@angular)'],
};
3 changes: 0 additions & 3 deletions e2e/with-babel/tsconfig-esm.json

This file was deleted.

16 changes: 16 additions & 0 deletions examples/example-app-v13/.browserslistrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries

# For the full list of supported browsers by the Angular framework, please see:
# https://angular.io/guide/browser-support

# You can see what browsers were selected by your queries by running:
# npx browserslist

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions
last 2 iOS major versions
Firefox ESR
16 changes: 16 additions & 0 deletions examples/example-app-v13/.editorconfig
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
46 changes: 46 additions & 0 deletions examples/example-app-v13/.gitignore
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

# dependencies
/node_modules

# profiling files
chrome-profiler-events*.json

# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace

# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*

# misc
/.angular/cache
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings

# System Files
.DS_Store
Thumbs.db
27 changes: 27 additions & 0 deletions examples/example-app-v13/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
# ExampleAppV13

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.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.
109 changes: 109 additions & 0 deletions examples/example-app-v13/angular.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,109 @@
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"cli": {
"packageManager": "yarn"
},
"newProjectRoot": "projects",
"projects": {
"example-app-v13": {
"projectType": "application",
"schematics": {
"@schematics/angular:application": {
"strict": true
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/example-app-v13",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"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"
}
],
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"outputHashing": "all"
},
"development": {
"buildOptimizer": false,
"optimization": false,
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"browserTarget": "example-app-v13:build:production"
},
"development": {
"browserTarget": "example-app-v13:build:development"
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "example-app-v13:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.css"
],
"scripts": []
}
}
}
}
},
"defaultProject": "example-app-v13"
}
14 changes: 14 additions & 0 deletions examples/example-app-v13/jest-esm.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
require('jest-preset-angular/ngcc-jest-processor');

/** @type {import('@jest/types').Config.InitialOptions} */
module.exports = {
preset: 'jest-preset-angular/presets/defaults-esm',
globals: {
'ts-jest': {
useESM: true,
stringifyContentPathRegex: '\\.(html|svg)$',
tsconfig: '<rootDir>/tsconfig-esm.spec.json',
},
},
setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
};
24 changes: 24 additions & 0 deletions examples/example-app-v13/jest-global-mocks.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
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,
};
},
});
7 changes: 7 additions & 0 deletions examples/example-app-v13/jest.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
require('jest-preset-angular/ngcc-jest-processor');

/** @type {import('@jest/types').Config.InitialOptions} */
module.exports = {
preset: 'jest-preset-angular',
setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
};