chore: Add Mocha option to ng-schematic (#9259)

**What kind of change does this PR introduce?**

Adds Mocha as option for `ng-schematics`

**Did you add tests for your changes?**

Yes

**If relevant, did you update the documentation?**

No

**Summary**

User want a simple solution for the Testing library of their choose 

**Does this PR introduce a breaking change?**

No

**Other information**
There are some improvements around the Babel that we can make so we
don't have duplicate code and files (In a Feature PR)
This commit is contained in:
Nikolay Vitkov 2022-11-14 09:30:49 +01:00 committed by GitHub
parent 1bbecb3bae
commit 86abe68849
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 62 additions and 13 deletions

View File

@ -1,12 +1,21 @@
import * as puppeteer from 'puppeteer'; import * as puppeteer from 'puppeteer';
<% if(testingFramework == 'mocha') { %>
import * as assert from 'assert';
<% } %>
describe('App test', function () { describe('App test', function () {
let browser: puppeteer.Browser; let browser: puppeteer.Browser;
let page: puppeteer.Page; let page: puppeteer.Page;
<% if(testingFramework == 'jasmine' || testingFramework == 'jest') { %>
beforeAll(async () => { beforeAll(async () => {
browser = await puppeteer.launch(); browser = await puppeteer.launch();
}); });
<% } %><% if(testingFramework == 'mocha') { %>
before(async () => {
browser = await puppeteer.launch();
});
<% } %>
beforeEach(async () => { beforeEach(async () => {
page = await browser.newPage(); page = await browser.newPage();
@ -17,19 +26,25 @@ describe('App test', function () {
await page.close(); await page.close();
}); });
<% if(testingFramework == 'jest') { %> <% if(testingFramework == 'jest') { %>
afterAll(async () => { afterAll(async () => {
await browser.close(); await browser.close();
}); });
<% } %> <% } %><% if(testingFramework == 'mocha') { %>
after(async () => {
await browser.close();
});
<% } %>
it('is running', async function () { it('is running', async function () {
const element = await page.waitForSelector( const element = await page.waitForSelector(
'text/<%= project %> app is running!' 'text/<%= project %> app is running!'
); );
<% if(testingFramework == 'jasmine' || testingFramework == 'jest') { %> <% if(testingFramework == 'jasmine' || testingFramework == 'jest') { %>
expect(element).not.toBeNull(); expect(element).not.toBeNull();
<% } %> <% } %><% if(testingFramework == 'mocha') { %>
assert.ok(element);
<% } %>
}); });
}); });

View File

@ -0,0 +1,4 @@
module.exports = {
file: ['e2e/babel.js'],
spec: './e2e/tests/**/*.e2e.ts',
};

View File

@ -0,0 +1,4 @@
require('@babel/register')({
extensions: ['.js', '.ts'],
presets: ['@babel/preset-env', '@babel/preset-typescript'],
});

View File

@ -13,7 +13,7 @@
"testingFramework": { "testingFramework": {
"description": "", "description": "",
"type": "string", "type": "string",
"enum": ["jasmine", "jest"], "enum": ["jasmine", "jest", "mocha"],
"default": "jasmine", "default": "jasmine",
"x-prompt": { "x-prompt": {
"message": "With what Testing Library do you wish to integrate?", "message": "With what Testing Library do you wish to integrate?",
@ -26,6 +26,10 @@
{ {
"value": "jest", "value": "jest",
"label": "Use Jest [https://jestjs.io/]" "label": "Use Jest [https://jestjs.io/]"
},
{
"value": "mocha",
"label": "Use Mocha [https://mochajs.org/]"
} }
] ]
} }

View File

@ -127,6 +127,8 @@ export function getScriptFromOptions(options: SchematicsOptions): string {
return 'jasmine --config=./e2e/support/jasmine.json'; return 'jasmine --config=./e2e/support/jasmine.json';
case TestingFramework.Jest: case TestingFramework.Jest:
return 'jest -c e2e/jest.config.js'; return 'jest -c e2e/jest.config.js';
case TestingFramework.Mocha:
return 'mocha --config=./e2e/.mocharc.js';
default: default:
throw new SchematicsException('Testing framework not supported.'); throw new SchematicsException('Testing framework not supported.');
} }

View File

@ -108,19 +108,23 @@ export function getDependenciesFromOptions(
options: SchematicsOptions options: SchematicsOptions
): string[] { ): string[] {
const dependencies = ['puppeteer']; const dependencies = ['puppeteer'];
const babelPackages = [
'@babel/core',
'@babel/register',
'@babel/preset-env',
'@babel/preset-typescript',
];
switch (options.testingFramework) { switch (options.testingFramework) {
case TestingFramework.Jasmine: case TestingFramework.Jasmine:
dependencies.push( dependencies.push('jasmine', ...babelPackages);
'jasmine',
'@babel/core',
'@babel/register',
'@babel/preset-env',
'@babel/preset-typescript'
);
break; break;
case TestingFramework.Jest: case TestingFramework.Jest:
dependencies.push('jest', '@types/jest', 'ts-jest'); dependencies.push('jest', '@types/jest', 'ts-jest');
break; break;
case TestingFramework.Mocha:
dependencies.push('mocha', '@types/mocha', ...babelPackages);
break;
default: default:
throw new SchematicsException(`Testing framework not supported.`); throw new SchematicsException(`Testing framework not supported.`);
} }

View File

@ -122,7 +122,7 @@ describe('@puppeteer/ng-schematics: ng-add', () => {
expect(devDependencies).toContain('jasmine'); expect(devDependencies).toContain('jasmine');
expect(devDependencies).toContain('@babel/core'); expect(devDependencies).toContain('@babel/core');
expect(devDependencies).toContain('@babel/register'); expect(devDependencies).toContain('@babel/register');
expect(devDependencies).toContain('@babel/register'); expect(devDependencies).toContain('@babel/preset-typescript');
}); });
it('should create Jest files and update "package.json"', async () => { it('should create Jest files and update "package.json"', async () => {
@ -137,4 +137,20 @@ describe('@puppeteer/ng-schematics: ng-add', () => {
expect(devDependencies).toContain('@types/jest'); expect(devDependencies).toContain('@types/jest');
expect(devDependencies).toContain('ts-jest'); expect(devDependencies).toContain('ts-jest');
}); });
it('should create Jasmine files and update "package.json"', async () => {
const tree = await buildTestingTree({
testingFramework: 'mocha',
});
const {scripts, devDependencies} = getPackageJson(tree);
expect(tree.files).toContain(getProjectFile('e2e/.mocharc.js'));
expect(tree.files).toContain(getProjectFile('e2e/babel.js'));
expect(scripts['e2e']).toBe('mocha --config=./e2e/.mocharc.js');
expect(devDependencies).toContain('mocha');
expect(devDependencies).toContain('@types/mocha');
expect(devDependencies).toContain('@babel/core');
expect(devDependencies).toContain('@babel/register');
expect(devDependencies).toContain('@babel/preset-typescript');
});
}); });