fix(ng-mocks): a17 support

help-me-mom · Nov 18, 2023 · ea19983 · ea19983
1 parent 6da66ad
commit ea19983
Show file tree

Hide file tree

Showing 29 changed files with 21,341 additions and 47 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -61,6 +61,10 @@ executors:
     docker:
       - image: satantime/puppeteer-node:18.18.2
     resource_class: medium
+  a17:
+    docker:
+      - image: satantime/puppeteer-node:20.9.0
+    resource_class: medium
 
 commands:
   install:
@@ -597,6 +601,7 @@ workflows:
                 - a14
                 - a15
                 - a16
+                - a17
 
       # testing a5 (exceptional)
       - E2E Test:
@@ -674,6 +679,7 @@ workflows:
               dir:
                 - a15
                 - a16
+                - a17
 
       # testing lib build
       - Lib Build:
@@ -698,6 +704,7 @@ workflows:
                 - a14
                 - a15
                 - a16
+                - a17
 
       # testing lib build
       - Lib Build:

diff --git a/.dockerignore b/.dockerignore
@@ -13,6 +13,7 @@
 /e2e/a14/node_modules
 /e2e/a15/node_modules
 /e2e/a16/node_modules
+/e2e/a17/node_modules
 /e2e/jasmine/node_modules
 /e2e/jest/node_modules
 /e2e/min/node_modules

diff --git a/.eslintrc.yml b/.eslintrc.yml
@@ -27,6 +27,7 @@ settings:
         - ./e2e/a14/tsconfig.json
         - ./e2e/a15/tsconfig.json
         - ./e2e/a16/tsconfig.json
+        - ./e2e/a17/tsconfig.json
         - ./e2e/jasmine/tsconfig.json
         - ./e2e/jest/tsconfig.json
         - ./e2e/min/tsconfig.json
@@ -57,6 +58,7 @@ overrides:
         - ./e2e/a14/tsconfig.json
         - ./e2e/a15/tsconfig.json
         - ./e2e/a16/tsconfig.json
+        - ./e2e/a17/tsconfig.json
         - ./e2e/jasmine/tsconfig.json
         - ./e2e/jest/tsconfig.json
         - ./e2e/min/tsconfig.json

diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -129,6 +129,14 @@ updates:
     commit-message:
       prefix: 'chore(deps)'
 
+  - package-ecosystem: 'npm'
+    directory: /e2e/a17/
+    open-pull-requests-limit: 0
+    schedule:
+      interval: 'daily'
+    commit-message:
+      prefix: 'chore(deps)'
+
   - package-ecosystem: 'npm'
     directory: /e2e/jasmine/
     open-pull-requests-limit: 0

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -165,7 +165,6 @@ The next step is:
   - `description` should be `Angular 17`
   - `private` should be `true`
   - replace `scripts` as it is in the prev version: `ng-mocks/e2e/a16/package.json`
-  - add `peerDependencies` as it is in the prev version: `ng-mocks/e2e/a16/package.json`
   - remove flexible versions (`^~`) in `dependencies` as it is in the prev version: `ng-mocks/e2e/a16/package.json`
   - remove flexible versions (`^~`) in `devDependencies` as it is in the prev version: `ng-mocks/e2e/a16/package.json`
   - in `devDependencies`, add `@types/jest`, `jest`, `jest-preset-angular`, `ng-packagr`, `puppeteer`, `ts-node` which support the desired angular version
@@ -203,28 +202,25 @@ The next step is:
 - update `ng-mocks/.circleci/config.yml`, search for `a16` and copy blocks to support `a17`
 - update `ng-mocks/.eslintrc.yml`, search for `a16` and copy blocks to support `a17`
 - execute `sh docker-compose.sh a17` in `ng-mocks` to install dependencies for `a17`, it might require `--force` at this moment
-- update `ng-mocks/renovate.json`
-  - scroll to the end of the file
-  - duplicate all rules of the prev version: `"additionalBranchPrefix": "e2e/a16/"`
-  - in the new rules, replace `a16` by `a17`
-  - in the new rules, update `allowedVersions` according to `package.json` of `a17`
 
 ### Step #4 - update ng-mocks dependencies
 
-- update `ng-mocks/package.json` to point to the desired angular version
-- execute `sh docker-compose.sh root` in `ng-mocks` to install new dependencies
+- update `ng-mocks/package.json` to point to the new angular version in dependencies
+- execute `sh docker-compose.sh root` in `ng-mocks` to install the dependencies
 
 ### Step #5 - verify that`ng-mocks` does not fail with the new version
 
+Replace `a16` with the new version below.
+
 - execute `nvm install` in `ng-mocks`
 - execute `nvm use`
 - execute `npm run build`
-- execute `npm run clean:a17`
-- execute `npm run s:a17`
-- execute `npm run s:app:a17`
-- execute `npm run s:test:a17`
-- execute `npm run test:a17`
-- tests should pass successfully
+- execute `npm run clean:a16`
+- execute `npm run s:a16`
+- execute `npm run s:app:a16`
+- execute `npm run s:test:a16`
+- execute `npm run test:a16`
+- tests should pass successfully without failures
 
 ### Step #6 - update version references
 
@@ -233,3 +229,10 @@ The next step is:
 - update the version table in `ng-mocks/README.md`
 - update `description` in `libs/ng-mocks/package.json`
 - update `peerDependencies` in `libs/ng-mocks/package.json`
+
+### Step #7 - verify
+
+- create a PR against the main branch
+- verify that CI doesn't fail
+- verify that CI has covered the new version
+- [release the new version of `ng-mocks`](#how-to-release-ng-mocks)
diff --git a/README.md b/README.md
@@ -15,6 +15,7 @@ The current version of the library **has been tested** and **can be used** with:
 
 | Angular | ng-mocks | Jasmine | Jest | Ivy |
 | ------: | :------: | :-----: | :--: | :-: |
+|      17 |  latest  |   yes   | yes  | yes |
 |      16 |  latest  |   yes   | yes  | yes |
 |      15 |  latest  |   yes   | yes  | yes |
 |      14 |  latest  |   yes   | yes  | yes |
@@ -73,6 +74,8 @@ An example of a spec for a profile edit component.
 // cover behavior of the component.
 describe('profile:builder', () => {
   // Helps to reset customizations after each test.
+  // Alternatively, you can enable
+  // automatic resetting in test.ts.
   MockInstance.scope();
 
   // Let's configure TestBed via MockBuilder.

diff --git a/docker-compose.sh b/docker-compose.sh
@@ -9,7 +9,7 @@ if [ "$1" = "" ] || [ "$1" = "root" ]; then
   docker-compose up --build -- ng-mocks && \
     nvm install && \
     nvm use && \
-    node ./node_modules/puppeteer/lib/esm/puppeteer/node/install.js
+    node ./node_modules/puppeteer/install.mjs
 fi
 
 if [ "$1" = "" ] || [ "$1" = "docs" ]; then
@@ -25,7 +25,7 @@ if [ "$1" = "" ] || [ "$1" = "e2e" ]; then
     cd ./tests-e2e && \
     nvm install && \
     nvm use && \
-    node ./node_modules/puppeteer/lib/esm/puppeteer/node/install.js && \
+    node ./node_modules/puppeteer/install.mjs && \
     cd ..
 fi
 
@@ -149,12 +149,21 @@ if [ "$1" = "" ] || [ "$1" = "a16" ]; then
     cd ../..
 fi
 
+if [ "$1" = "" ] || [ "$1" = "a17" ]; then
+  docker-compose up --build -- a17 && \
+    cd ./e2e/a17 && \
+    nvm install && \
+    nvm use && \
+    node ./node_modules/puppeteer/install.mjs && \
+    cd ../..
+fi
+
 if [ "$1" = "" ] || [ "$1" = "jasmine" ]; then
   docker-compose up --build -- jasmine && \
     cd ./e2e/jasmine && \
     nvm install && \
     nvm use && \
-    node ./node_modules/puppeteer/lib/esm/puppeteer/node/install.js && \
+    node ./node_modules/puppeteer/install.mjs && \
     cd ../..
 fi
 
@@ -167,7 +176,7 @@ if [ "$1" = "" ] || [ "$1" = "min" ]; then
     cd ./e2e/min && \
     nvm install && \
     nvm use && \
-    node ./node_modules/puppeteer/lib/esm/puppeteer/node/install.js && \
+    node ./node_modules/puppeteer/install.mjs && \
     cd ../..
 fi
 

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -203,6 +203,18 @@ services:
       - install
       - --no-audit
 
+  a17:
+    image: satantime/puppeteer-node:20.9.0
+    working_dir: /app
+    volumes:
+      - ./e2e/a17:/app
+      - gyp:/root/.node-gyp
+      - npm:/root/.npm
+    command:
+      - npm
+      - install
+      - --no-audit
+
   jasmine:
     image: satantime/puppeteer-node:20.9.0
     working_dir: /app

diff --git a/docs/articles/extra/mock-form-controls.md b/docs/articles/extra/mock-form-controls.md
@@ -139,6 +139,8 @@ A usage example of mock FormControl with ngModel in Angular tests
 ```ts title="https://github.com/help-me-mom/ng-mocks/blob/master/examples/MockForms/test.spec.ts"
 describe('MockForms', () => {
   // Helps to reset customizations after each test.
+  // Alternatively, you can enable
+  // automatic resetting in test.ts.
   MockInstance.scope();
 
   beforeEach(() => {

diff --git a/docs/articles/index.md b/docs/articles/index.md
@@ -26,20 +26,21 @@ keeping interfaces as they are, but suppressing their implementation.
 
 The current version of `ng-mocks` has been tested and **can be used** with:
 
-|  Angular |                           ng-mocks                            | Jasmine | Jest | Ivy |
-| -------: | :-----------------------------------------------------------: | :-----: | :--: | :-: |
-|       16 |                            latest                             |   yes   | yes  | yes |
-|       15 |                            latest                             |   yes   | yes  | yes |
-|       14 |                            latest                             |   yes   | yes  | yes |
-|       13 |                            latest                             |   yes   | yes  | yes |
-|       12 |                            latest                             |   yes   | yes  | yes |
-|       11 |                            latest                             |   yes   | yes  | yes |
-|       10 |                            latest                             |   yes   | yes  | yes |
-|        9 |                            latest                             |   yes   | yes  | yes |
-|        8 |                            latest                             |   yes   | yes  |     |
-|        7 |                            latest                             |   yes   | yes  |     |
-|        6 |                            latest                             |   yes   | yes  |     |
-|        5 |                            latest                             |   yes   | yes  |     |
+| Angular | ng-mocks | Jasmine | Jest | Ivy |
+|--------:|:--------:| :-----: | :--: | :-: |
+|      17 |  latest  |   yes   | yes  | yes |
+|      16 |  latest  |   yes   | yes  | yes |
+|      15 |  latest  |   yes   | yes  | yes |
+|      14 |  latest  |   yes   | yes  | yes |
+|      13 |  latest  |   yes   | yes  | yes |
+|      12 |  latest  |   yes   | yes  | yes |
+|      11 |  latest  |   yes   | yes  | yes |
+|      10 |  latest  |   yes   | yes  | yes |
+|       9 |  latest  |   yes   | yes  | yes |
+|       8 |  latest  |   yes   | yes  |     |
+|       7 |  latest  |   yes   | yes  |     |
+|       6 |  latest  |   yes   | yes  |     |
+|       5 |  latest  |   yes   | yes  |     |
 
 In the header menu we can find **preconfigured sandboxes**, where we could **check all the features**.
 To focus on a particular one, simply prefix it with `fdescribe` or `fit`.
@@ -85,7 +86,8 @@ An example of a spec for a profile edit component.
 // cover behavior of the component.
 describe('profile:builder', () => {
   // Helps to reset customizations after each test.
-  // Alternatively, you can enable automatic resetting in test.ts.
+  // Alternatively, you can enable
+  // automatic resetting in test.ts.
   MockInstance.scope();
 
   // Let's configure TestBed via MockBuilder.

diff --git a/docs/articles/migrations.md b/docs/articles/migrations.md
@@ -10,6 +10,11 @@ Below you can find critical changes. They happen on major releases.
 
 If you are facing an issue, despite the instructions, please, feel free to [contact us](need-help.md).
 
+## From 16 to 17
+
+There are no special cases.
+The update should be straight forward.
+
 ## From 15 to 16
 
 There are no special cases.

diff --git a/e2e/a17/.gitignore b/e2e/a17/.gitignore
@@ -0,0 +1,4 @@
+/dist
+/node_modules
+/src/app
+/src/test
diff --git a/e2e/a17/.nvmrc b/e2e/a17/.nvmrc
@@ -0,0 +1 @@
+20.9.0
diff --git a/e2e/a17/angular.json b/e2e/a17/angular.json
@@ -0,0 +1,73 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "a17": {
+      "projectType": "application",
+      "schematics": {},
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:application",
+          "options": {
+            "outputPath": "dist/a17",
+            "index": "src/index.html",
+            "browser": "src/main.ts",
+            "polyfills": ["zone.js"],
+            "tsConfig": "tsconfig.json"
+          },
+          "configurations": {
+            "production": {
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "a17:build:production"
+            },
+            "development": {
+              "buildTarget": "a17:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "polyfills": ["zone.js", "zone.js/testing"],
+            "tsConfig": "tsconfig.json",
+            "karmaConfig": "karma.conf.js"
+          }
+        }
+      }
+    },
+    "lib": {
+      "projectType": "library",
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "ng-package.json",
+            "tsConfig": "tsconfig.json"
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/e2e/a17/jest.config.ts b/e2e/a17/jest.config.ts
@@ -0,0 +1,13 @@
+export default {
+  preset: 'jest-preset-angular',
+  workerIdleMemoryLimit: '1024MB',
+  maxWorkers: 1,
+  setupFilesAfterEnv: ['<rootDir>/src/setup-jest.ts'],
+  testEnvironmentOptions: {
+    url: 'http://localhost',
+  },
+  testPathIgnorePatterns: ['<rootDir>/src/test.ts'],
+  transform: {
+    '^.+\\.(ts|mjs|js|html)$': ['jest-preset-angular', { tsconfig: './tsconfig.json' }],
+  },
+};