feat: add automatic mock for angular entities (#2908)

Author: MillerSvt

e2e/automocks/__mocks__/test-manual-mock.component.ts

@@ -0,0 +1,13 @@
+import { Component, input } from '@angular/core';
+
+@Component({
+    selector: 'test',
+    template: 'this is a manual mock for test',
+    standalone: true,
+    styles: [':host { display: block; }'],
+})
+export class TestComponent {
+    public value = input.required<string>();
+
+    method() {}
+}

e2e/automocks/__tests__/test-automocks.ts

@@ -0,0 +1,34 @@
+import { Component } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+
+import * as testManualMockComponent from '../test-manual-mock.component';
+import * as testModule from '../test.module';
+
+jest.mock('../test.module');
+jest.mock('../test-manual-mock.component');
+
+it('should mock module', () => {
+    @Component({
+        template: `
+            <test [value]="'value'">{{ 'test' | test }}</test>
+            <div test [value]="'value'">{{ 'test' | test }}</div>
+        `,
+        imports: [testModule.TestModule],
+    })
+    class TestComponent {}
+
+    jest.spyOn(console, 'error');
+
+    expect(() => TestBed.createComponent(TestComponent).detectChanges()).not.toThrow();
+
+    expect(console.error).not.toHaveBeenCalled();
+});
+
+it('should ignore modules with manual mock', () => {
+    const fixture = TestBed.createComponent(testManualMockComponent.TestComponent);
+
+    fixture.detectChanges();
+
+    expect(fixture.debugElement.nativeElement.innerHTML).toBe('this is a manual mock for test');
+    expect(jest.isMockFunction(fixture.componentInstance.method)).toBeFalsy();
+});

e2e/automocks/jest-cjs.config.ts

@@ -0,0 +1,20 @@
+import type { JestConfigWithTsJest } from 'ts-jest';
+
+const config: JestConfigWithTsJest = {
+    displayName: 'e2e-automocks',
+    testEnvironment: 'jsdom',
+    setupFilesAfterEnv: ['<rootDir>/../setup-test-env.ts', '<rootDir>/setup-test-env.ts'],
+    transform: {
+        '^.+\\.(ts|mjs|js|html)$': [
+            '<rootDir>/../../build/index.js',
+            {
+                babelConfig: true,
+                tsconfig: '<rootDir>/tsconfig-cjs.spec.json',
+                stringifyContentPathRegex: '\\.(html|svg)$',
+            },
+        ],
+    },
+    transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
+};
+
+export default config;

e2e/automocks/jest-esm.config.ts

@@ -0,0 +1,19 @@
+import type { JestConfigWithTsJest } from 'ts-jest';
+
+const config: JestConfigWithTsJest = {
+    displayName: 'e2e-automocks',
+    extensionsToTreatAsEsm: ['.ts', '.mts'],
+    setupFilesAfterEnv: ['<rootDir>/../setup-test-env.mts', '<rootDir>/setup-test-env.mts'],
+    transform: {
+        '^.+\\.(ts|mts|mjs|js|html)$': [
+            '<rootDir>/../../build/index.js',
+            {
+                babelConfig: true,
+                useESM: true,
+                tsconfig: '<rootDir>/tsconfig-esm.spec.json',
+            },
+        ],
+    },
+};
+
+export default config;

e2e/automocks/jest-transpile-cjs.config.ts

@@ -0,0 +1,20 @@
+import type { JestConfigWithTsJest } from 'ts-jest';
+
+const config: JestConfigWithTsJest = {
+    displayName: 'e2e-automocks',
+    testEnvironment: 'jsdom',
+    setupFilesAfterEnv: ['<rootDir>/../setup-test-env.ts', '<rootDir>/setup-test-env.ts'],
+    transform: {
+        '^.+\\.(ts|mjs|js|html)$': [
+            '<rootDir>/../../build/index.js',
+            {
+                babelConfig: true,
+                tsconfig: '<rootDir>/tsconfig-transpile-cjs.spec.json',
+                stringifyContentPathRegex: '\\.(html|svg)$',
+            },
+        ],
+    },
+    transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
+};
+
+export default config;

e2e/automocks/jest-transpile-esm.config.ts

@@ -0,0 +1,19 @@
+import type { JestConfigWithTsJest } from 'ts-jest';
+
+const config: JestConfigWithTsJest = {
+    displayName: 'e2e-automocks',
+    extensionsToTreatAsEsm: ['.ts', '.mts'],
+    setupFilesAfterEnv: ['<rootDir>/../setup-test-env.mts', '<rootDir>/setup-test-env.mts'],
+    transform: {
+        '^.+\\.(ts|mts|mjs|js|html)$': [
+            '<rootDir>/../../build/index.js',
+            {
+                babelConfig: true,
+                useESM: true,
+                tsconfig: '<rootDir>/tsconfig-transpile-esm.spec.json',
+            },
+        ],
+    },
+};
+
+export default config;

e2e/automocks/setup-test-env.mts

@@ -0,0 +1,3 @@
+import { setupAutoMocks } from '../../setup-env/automocks.mjs';
+
+setupAutoMocks();

e2e/automocks/setup-test-env.ts

@@ -0,0 +1,3 @@
+import { setupAutoMocks } from '../../setup-env/automocks.js';
+
+setupAutoMocks();

e2e/automocks/test-manual-mock.component.ts

@@ -0,0 +1,13 @@
+import { Component, input } from '@angular/core';
+
+@Component({
+    selector: 'test',
+    template: 'this is a test',
+    standalone: true,
+    styles: [':host { display: block; }'],
+})
+export class TestComponent {
+    public value = input.required<string>();
+
+    method() {}
+}

e2e/automocks/test.component.ts

@@ -0,0 +1,13 @@
+import { Component, input } from '@angular/core';
+
+@Component({
+    selector: 'test',
+    template: 'this is a test',
+    standalone: true,
+    styles: [':host { display: block; }'],
+})
+export class TestComponent {
+    public value = input.required<string>();
+
+    method() {}
+}