chore: extract hook setup (#10442)

This commit is contained in:
Nikolay Vitkov 2023-06-23 16:02:52 +02:00 committed by GitHub
parent a88d1936ca
commit b6a733cdfe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 148 additions and 118 deletions

View File

@ -0,0 +1,22 @@
<% if(testingFramework == 'node') { %>
import * as assert from 'assert';
import {describe, it} from 'node:test';
<% } %><% if(testingFramework == 'mocha') { %>
import * as assert from 'assert';
<% } %>
import {setupBrowserHooks, getBrowserState} from './utils';
describe('App test', function () {
setupBrowserHooks();
it('is running', async function () {
const {page} = getBrowserState();
await page.goto('http://localhost:4200');
const element = await page.waitForSelector('text/sandbox app is running!');
<% if(testingFramework == 'jasmine' || testingFramework == 'jest') { %>
expect(element).not.toBeNull();
<% } %><% if(testingFramework == 'mocha' || testingFramework == 'node') { %>
assert.ok(element);
<% } %>
});
});

View File

@ -1,21 +1,12 @@
import * as puppeteer from 'puppeteer';
<% if(testingFramework == 'node') { %>
import {
describe,
it,
before,
beforeEach,
after,
afterEach,
} from 'node:test';
<% } %><% if(testingFramework == 'mocha' || testingFramework == 'node') { %>
import * as assert from 'assert';
import {before, beforeEach, after, afterEach} from 'node:test';
<% } %>
import * as puppeteer from 'puppeteer';
describe('App test', function () {
let browser: puppeteer.Browser;
let page: puppeteer.Page;
let browser: puppeteer.Browser;
let page: puppeteer.Page;
export function setupBrowserHooks(): void {
<% if(testingFramework == 'jasmine' || testingFramework == 'jest') { %>
beforeAll(async () => {
browser = await puppeteer.launch();
@ -28,7 +19,6 @@ describe('App test', function () {
beforeEach(async () => {
page = await browser.newPage();
await page.goto('<%= baseUrl %>');
});
afterEach(async () => {
@ -44,16 +34,19 @@ describe('App test', function () {
await browser.close();
});
<% } %>
}
it('is running', async function () {
const element = await page.waitForSelector(
'text/<%= project %> app is running!'
export function getBrowserState(): {
browser: puppeteer.Browser;
page: puppeteer.Page;
} {
if (!browser) {
throw new Error(
'No browser state found! Ensure `setupBrowserHooks()` is called.'
);
<% if(testingFramework == 'jasmine' || testingFramework == 'jest') { %>
expect(element).not.toBeNull();
<% } %><% if(testingFramework == 'mocha' || testingFramework == 'node') { %>
assert.ok(element);
<% } %>
});
});
}
return {
browser,
page,
};
}

View File

@ -1,15 +1,11 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../tsconfig.json",
"compilerOptions": {
<% if(testingFramework == 'jest') { %>
"esModuleInterop": true,
<% } %><% if(testingFramework == 'node') { %>
"compilerOptions": {<% if(testingFramework == 'jest') { %>
"esModuleInterop": true,<% } %><% if(testingFramework == 'node') { %>
"module": "CommonJS",
"rootDir": "tests/",
"outDir": "test/",
<% } %>
"outDir": "build/",<% } %>
"types": ["<%= testingFramework %>"]
},
"include": ["tests/**/*.e2e.ts"]
"include": ["tests/**/*.ts"]
}

View File

@ -1,3 +1,3 @@
# Compiled e2e tests output Node auto resolves files in folders named 'test'
test/
build/

View File

@ -34,7 +34,7 @@ import {
type NodePackage,
updateAngularJsonScripts,
} from '../utils/packages.js';
import {type SchematicsOptions} from '../utils/types.js';
import {TestingFramework, type SchematicsOptions} from '../utils/types.js';
// You don't have to export the function as default. You can also have more than one rule
// factory per file.
@ -101,7 +101,11 @@ function addPuppeteerFiles(options: SchematicsOptions): Rule {
return addBaseFiles(tree, context, {
projects,
options,
options: {
...options,
ext:
options.testingFramework === TestingFramework.Node ? 'test' : 'e2e',
},
});
};
}

View File

@ -33,7 +33,11 @@ import {SchematicsOptions, TestingFramework} from './types.js';
export interface FilesOptions {
projects: any;
options: SchematicsOptions;
options: {
testingFramework: TestingFramework;
exportConfig?: boolean;
ext?: string;
};
applyPath: string;
relativeToWorkspacePath: string;
movePath?: string;

View File

@ -1,85 +1,14 @@
import https from 'https';
import {join} from 'path';
import {JsonObject} from '@angular-devkit/core';
import {
SchematicTestRunner,
UnitTestTree,
} from '@angular-devkit/schematics/testing';
import expect from 'expect';
import sinon from 'sinon';
const WORKSPACE_OPTIONS = {
name: 'workspace',
newProjectRoot: 'projects',
version: '14.0.0',
};
const APPLICATION_OPTIONS = {
name: 'sandbox',
};
function getProjectFile(file: string): string {
return `/${WORKSPACE_OPTIONS.newProjectRoot}/${APPLICATION_OPTIONS.name}/${file}`;
}
function getAngularJsonScripts(
tree: UnitTestTree,
isDefault = true
): {
builder: string;
configurations: Record<string, any>;
options: Record<string, any>;
} {
const angularJson = tree.readJson('angular.json') as any;
const e2eScript = isDefault ? 'e2e' : 'puppeteer';
return angularJson['projects']?.[APPLICATION_OPTIONS.name]?.['architect'][
e2eScript
];
}
function getPackageJson(tree: UnitTestTree): {
scripts: Record<string, string>;
devDependencies: string[];
} {
const packageJson = tree.readJson('package.json') as JsonObject;
return {
scripts: packageJson['scripts'] as any,
devDependencies: Object.keys(
packageJson['devDependencies'] as Record<string, string>
),
};
}
async function buildTestingTree(userOptions?: Record<string, any>) {
const runner = new SchematicTestRunner(
'schematics',
join(__dirname, '../../lib/schematics/collection.json')
);
const options = {
isDefaultTester: true,
exportConfig: false,
testingFramework: 'jasmine',
...userOptions,
};
let workingTree: UnitTestTree;
// Build workspace
workingTree = await runner.runExternalSchematic(
'@schematics/angular',
'workspace',
WORKSPACE_OPTIONS
);
// Build dummy application
workingTree = await runner.runExternalSchematic(
'@schematics/angular',
'application',
APPLICATION_OPTIONS,
workingTree
);
return await runner.runSchematic('ng-add', options, workingTree);
}
import {
buildTestingTree,
getAngularJsonScripts,
getPackageJson,
getProjectFile,
} from './utils.js';
describe('@puppeteer/ng-schematics: ng-add', () => {
// Stop outgoing Request for version fetching
@ -103,6 +32,7 @@ describe('@puppeteer/ng-schematics: ng-add', () => {
expect(tree.files).toContain(getProjectFile('e2e/tsconfig.json'));
expect(tree.files).toContain(getProjectFile('e2e/tests/app.e2e.ts'));
expect(tree.files).toContain(getProjectFile('e2e/tests/utils.ts'));
expect(devDependencies).toContain('puppeteer');
expect(scripts['e2e']).toBe('ng e2e');
expect(builder).toBe('@puppeteer/ng-schematics:puppeteer');
@ -198,6 +128,8 @@ describe('@puppeteer/ng-schematics: ng-add', () => {
const {options} = getAngularJsonScripts(tree);
expect(tree.files).toContain(getProjectFile('e2e/.gitignore'));
expect(tree.files).not.toContain(getProjectFile('e2e/tests/app.e2e.ts'));
expect(tree.files).toContain(getProjectFile('e2e/tests/app.test.ts'));
expect(options['commands']).toEqual([
[`tsc`, '-p', 'e2e/tsconfig.json'],
['node', '--test', 'e2e/'],

View File

@ -0,0 +1,81 @@
import {join} from 'path';
import {JsonObject} from '@angular-devkit/core';
import {
SchematicTestRunner,
UnitTestTree,
} from '@angular-devkit/schematics/testing';
const WORKSPACE_OPTIONS = {
name: 'workspace',
newProjectRoot: 'projects',
version: '14.0.0',
};
const APPLICATION_OPTIONS = {
name: 'sandbox',
};
export function getProjectFile(file: string): string {
return `/${WORKSPACE_OPTIONS.newProjectRoot}/${APPLICATION_OPTIONS.name}/${file}`;
}
export function getAngularJsonScripts(
tree: UnitTestTree,
isDefault = true
): {
builder: string;
configurations: Record<string, any>;
options: Record<string, any>;
} {
const angularJson = tree.readJson('angular.json') as any;
const e2eScript = isDefault ? 'e2e' : 'puppeteer';
return angularJson['projects']?.[APPLICATION_OPTIONS.name]?.['architect'][
e2eScript
];
}
export function getPackageJson(tree: UnitTestTree): {
scripts: Record<string, string>;
devDependencies: string[];
} {
const packageJson = tree.readJson('package.json') as JsonObject;
return {
scripts: packageJson['scripts'] as any,
devDependencies: Object.keys(
packageJson['devDependencies'] as Record<string, string>
),
};
}
export async function buildTestingTree(
userOptions?: Record<string, any>
): Promise<UnitTestTree> {
const runner = new SchematicTestRunner(
'schematics',
join(__dirname, '../../lib/schematics/collection.json')
);
const options = {
isDefaultTester: true,
exportConfig: false,
testingFramework: 'jasmine',
...userOptions,
};
let workingTree: UnitTestTree;
// Build workspace
workingTree = await runner.runExternalSchematic(
'@schematics/angular',
'workspace',
WORKSPACE_OPTIONS
);
// Build dummy application
workingTree = await runner.runExternalSchematic(
'@schematics/angular',
'application',
APPLICATION_OPTIONS,
workingTree
);
return await runner.runSchematic('ng-add', options, workingTree);
}

View File

@ -2,7 +2,6 @@
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"baseUrl": "tsconfig",
"lib": ["ES2018"],
"module": "CommonJS",
"noEmitOnError": true,
"rootDir": "src/",
@ -10,8 +9,7 @@
"skipDefaultLibCheck": true,
"skipLibCheck": true,
"sourceMap": true,
"types": ["node"],
"target": "ES6"
"types": ["node"]
},
"include": ["src/**/*"],
"exclude": ["src/**/files/**/*"],