From 6bd90f898289466832f91cde9e1304955a7d43e3 Mon Sep 17 00:00:00 2001 From: JeB <9823087+just-jeb@users.noreply.github.com> Date: Mon, 7 Jun 2021 14:41:55 +0300 Subject: [PATCH] feat(jest): update to jest-preset-angular@9 (#913) --- MIGRATION.MD | 7 +++++ README.md | 10 +++--- package.json | 4 +-- .../src/generic-browser-builder.ts | 31 +++++++++---------- .../custom-webpack/src/transform-factories.ts | 23 +++++++------- packages/jest/README.md | 12 +++---- .../jest/examples/multiple-apps/package.json | 2 +- .../jest/examples/simple-app/package.json | 2 +- packages/jest/package.json | 6 ++-- 9 files changed, 49 insertions(+), 48 deletions(-) diff --git a/MIGRATION.MD b/MIGRATION.MD index ceca430a4..93c983536 100644 --- a/MIGRATION.MD +++ b/MIGRATION.MD @@ -1,7 +1,14 @@ # Migration from version 11 to version 12 +## Custom webpack builder + No breaking changes (except for updating to Angular 12) +## Jest builder (since 12.1.0) +1. Jest 27 is required now +2. `jest-preset-angular` has been updated to version 9, which uses Angular compiler instead of `ts-jest` in order to transform the TS files. Make sure you understand the implications and perform all the necessary changes to your code base as described in `jest-preset-angular` [CHANGELOG](https://github.com/thymikee/jest-preset-angular/blob/master/CHANGELOG.md). + + # Migration from version 10 to version 11 ## Custom webpack builder diff --git a/README.md b/README.md index 36b173966..7fe5e0ade 100644 --- a/README.md +++ b/README.md @@ -10,11 +10,11 @@ Builders' and Angular **major** versions **must** match. ## Previous versions - - [Version 11](https://github.com/just-jeb/angular-builders/tree/11.x.x) - - [Version 10](https://github.com/just-jeb/angular-builders/tree/10.x.x) - - [Version 9](https://github.com/just-jeb/angular-builders/tree/9.x.x) - - [Version 8](https://github.com/just-jeb/angular-builders/tree/8.x.x) - - [Version 7](https://github.com/just-jeb/angular-builders/tree/7.x.x) +- [Version 11](https://github.com/just-jeb/angular-builders/tree/11.x.x) +- [Version 10](https://github.com/just-jeb/angular-builders/tree/10.x.x) +- [Version 9](https://github.com/just-jeb/angular-builders/tree/9.x.x) +- [Version 8](https://github.com/just-jeb/angular-builders/tree/8.x.x) +- [Version 7](https://github.com/just-jeb/angular-builders/tree/7.x.x) # Builders diff --git a/package.json b/package.json index ad89d0da0..782517d6d 100644 --- a/package.json +++ b/package.json @@ -38,14 +38,14 @@ "@types/webpack-merge": "^5.0.0", "cpy-cli": "^3.0.0", "husky": "^6.0.0", - "jest": "^26.2.1", + "jest": "^27.0.0", "lerna": "^4.0.0", "lint-staged": "^11.0.0", "lodash": "^4.17.11", "prettier": "^2.0.0", "quicktype": "^15.0.174", "rimraf": "^3.0.0", - "ts-jest": "^26.1.1", + "ts-jest": "^27.0.0", "ts-node": "~10.0.0", "typescript": "4.3" }, diff --git a/packages/custom-webpack/src/generic-browser-builder.ts b/packages/custom-webpack/src/generic-browser-builder.ts index ab4b30a58..313eb8ec1 100644 --- a/packages/custom-webpack/src/generic-browser-builder.ts +++ b/packages/custom-webpack/src/generic-browser-builder.ts @@ -25,20 +25,19 @@ export type BuilderExecutor = } ) => any; -export const executeBrowserBasedBuilder = ( - executebBuilder: BuilderExecutor -): BuilderHandlerFn => ( - options: O, - context: BuilderContext -): ReturnType => { - async function setup() { - const browserTarget = targetFromTargetString(options.browserTarget); - return (context.getTargetOptions(browserTarget) as unknown) as CustomWebpackSchema; - } +export const executeBrowserBasedBuilder = + ( + executebBuilder: BuilderExecutor + ): BuilderHandlerFn => + (options: O, context: BuilderContext): ReturnType => { + async function setup() { + const browserTarget = targetFromTargetString(options.browserTarget); + return context.getTargetOptions(browserTarget) as unknown as CustomWebpackSchema; + } - return from(setup()).pipe( - switchMap(customWebpackOptions => - executebBuilder(options, context, getTransforms(customWebpackOptions, context)) - ) - ); -}; + return from(setup()).pipe( + switchMap(customWebpackOptions => + executebBuilder(options, context, getTransforms(customWebpackOptions, context)) + ) + ); + }; diff --git a/packages/custom-webpack/src/transform-factories.ts b/packages/custom-webpack/src/transform-factories.ts index 5860c0b86..7a2c8ce54 100644 --- a/packages/custom-webpack/src/transform-factories.ts +++ b/packages/custom-webpack/src/transform-factories.ts @@ -10,18 +10,17 @@ import { tsNodeRegister } from './utils'; export const customWebpackConfigTransformFactory: ( options: CustomWebpackSchema, context: BuilderContext -) => ExecutionTransformer = ( - options, - { workspaceRoot, target } -) => browserWebpackConfig => { - return CustomWebpackBuilder.buildWebpackConfig( - normalize(workspaceRoot), - options.customWebpackConfig, - browserWebpackConfig, - options, - target - ); -}; +) => ExecutionTransformer = + (options, { workspaceRoot, target }) => + browserWebpackConfig => { + return CustomWebpackBuilder.buildWebpackConfig( + normalize(workspaceRoot), + options.customWebpackConfig, + browserWebpackConfig, + options, + target + ); + }; export const indexHtmlTransformFactory: ( options: CustomWebpackSchema, diff --git a/packages/jest/README.md b/packages/jest/README.md index 4dd6840d4..1e70c90ba 100644 --- a/packages/jest/README.md +++ b/packages/jest/README.md @@ -27,7 +27,7 @@ The builder comes to provide zero configuration setup for Jest while keeping the npm remove karma karma-chrome-launcher karma-coverage-istanbul-reporter karma-jasmine karma-jasmine-html-reporter rm ./karma.conf.js ./src/test.ts ``` -2. Install the builder (and `jest` if you still haven't): +2. Install the builder (and `jest` if you still haven't): ```console npm i -D jest @types/jest @angular-builders/jest ``` @@ -65,10 +65,6 @@ The builder comes to provide zero configuration setup for Jest while keeping the ``` - Run the tests: `ng test` -## Ivy compatibility - -Ivy compiler is enabled by default in version 9 so if you use it, make sure you run `ngcc` in a `postinstall` hook. For more details refer to [this](https://github.com/just-jeb/angular-builders/issues/679#issuecomment-587525674) issue. - ## Multi-projects workspace support The builder supports multi-project workspaces out of the box, the only thing required is editing _tsconfig.spec.json_ in the relevant project directory as described [above](#updating-typescript-configurations). @@ -91,12 +87,12 @@ The builder supports multi-project workspaces out of the box, the only thing req Thus, if you don't provide `configPath` in options, and you'd like to customize the configuration of a single project in your workspace, you only have to add _jest.config.js_ in this project's root directory and specify the configuration delta in this file. Or, if you'd like the same custom configuration to be applied to all the projects in the workspace, you just specify it in _package.json_. Another option in such a case is creating a single config file in the workspace root and specifying it in _angular.json_ for each project. -- `tsConfig` - path to tsconfig file. If the path is relative then it is evaluated relative to the _project root_. Defaults to `tsconfig.spec.json` that is located in _project root_. -- `globalMocks` - there are 4 global mocks (that lack implementation in JSDom) enabled by default: +- `tsConfig` - path to tsconfig file. If the path is relative then it is evaluated relative to the _project root_. Defaults to `tsconfig.spec.json` that is located in _project root_. +- `globalMocks` - there are 4 global mocks (that lack implementation in JSDom) enabled by default: `["getComputedStyle", "doctype", "styleTransform", "matchMedia"]`. Their implementation can be found [here](./src/global-mocks). If you want to disable one or more of these mocks just pass an updated array in options. - For example: + For example: ```json "options": { "globalMocks": ["getComputedStyle", "doctype"] diff --git a/packages/jest/examples/multiple-apps/package.json b/packages/jest/examples/multiple-apps/package.json index f5cb1a187..937ef02f1 100644 --- a/packages/jest/examples/multiple-apps/package.json +++ b/packages/jest/examples/multiple-apps/package.json @@ -35,7 +35,7 @@ "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", "jasmine-spec-reporter": "~5.0.0", - "jest": "^26.1.0", + "jest": "^27.0.0", "ng-packagr": "^12.0.0", "protractor": "~7.0.0", "ts-node": "~8.2.0", diff --git a/packages/jest/examples/simple-app/package.json b/packages/jest/examples/simple-app/package.json index 6609c5076..d00b7b3d4 100644 --- a/packages/jest/examples/simple-app/package.json +++ b/packages/jest/examples/simple-app/package.json @@ -35,7 +35,7 @@ "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", "jasmine-spec-reporter": "~5.0.0", - "jest": "^26.1.0", + "jest": "^27.0.0", "jest-junit": "^6.4.0", "protractor": "~7.0.0", "ts-node": "~8.2.0", diff --git a/packages/jest/package.json b/packages/jest/package.json index aecca5a18..0673885c1 100644 --- a/packages/jest/package.json +++ b/packages/jest/package.json @@ -41,13 +41,13 @@ "dependencies": { "@angular-devkit/architect": ">=0.1200.0 < 0.1300.0", "@angular-devkit/core": "^12.0.0", - "jest-preset-angular": "^8.4.0", + "jest-preset-angular": "^9.0.1", "lodash": "^4.17.15" }, "peerDependencies": { - "jest": ">=26" + "jest": ">=27" }, "devDependencies": { - "jest": "^26.1.0" + "jest": "^27.0.0" } }