Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fix(angular): upgrade karma and fix settings (#9056)
  • Loading branch information
Coly010 committed Feb 21, 2022
1 parent 36245e1 commit 01dba86
Show file tree
Hide file tree
Showing 9 changed files with 245 additions and 17 deletions.
4 changes: 1 addition & 3 deletions packages/angular/src/generators/init/init.spec.ts
Expand Up @@ -73,9 +73,7 @@ describe('init', () => {
// ASSERT
expect(devDependencies['karma']).toBeDefined();
expect(devDependencies['karma-chrome-launcher']).toBeDefined();
expect(
devDependencies['karma-coverage-istanbul-reporter']
).toBeDefined();
expect(devDependencies['karma-coverage']).toBeDefined();
expect(devDependencies['karma-jasmine']).toBeDefined();
expect(devDependencies['karma-jasmine-html-reporter']).toBeDefined();
expect(devDependencies['jasmine-core']).toBeDefined();
Expand Down
Expand Up @@ -61,8 +61,8 @@ module.exports = function(config) {
const baseConfig = getBaseKarmaConfig();
config.set({
...baseConfig,
coverageIstanbulReporter: {
...baseConfig.coverageIstanbulReporter,
coverageReporter: {
...baseConfig.coverageReporter,
dir: join(__dirname, '../../coverage/libs/lib1')
}
});
Expand Down
Expand Up @@ -8,8 +8,8 @@ module.exports = function(config) {
const baseConfig = getBaseKarmaConfig();
config.set({
...baseConfig,
coverageIstanbulReporter: {
...baseConfig.coverageIstanbulReporter,
coverageReporter: {
...baseConfig.coverageReporter,
dir: join(__dirname, '<%= offsetFromRoot %>coverage/<%= projectRoot %>')
}
});
Expand Down
16 changes: 11 additions & 5 deletions packages/angular/src/generators/karma/files/karma.conf.js__tmpl__
Expand Up @@ -12,16 +12,22 @@ module.exports = () => {
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('karma-coverage'),
require('@angular-devkit/build-angular/plugins/karma'),
],
client: {
jasmine: {
// you can add configuration options for Jasmine here
// the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
// for example, you can disable the random execution with `random: false`
// or set a specific seed with `seed: 4321`
},
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: join(__dirname, '../../coverage'),
reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true,
coverageReporter: {
dir: join(__dirname, './coverage'),
subdir: '.',
reporters: [{ type: 'html' }, { type: 'text-summary' }],
},
reporters: ['progress', 'kjhtml'],
port: 9876,
Expand Down
2 changes: 1 addition & 1 deletion packages/angular/src/generators/karma/karma.spec.ts
Expand Up @@ -29,7 +29,7 @@ describe('karma', () => {
const { devDependencies } = devkit.readJson(tree, 'package.json');
expect(devDependencies['karma']).toBeDefined();
expect(devDependencies['karma-chrome-launcher']).toBeDefined();
expect(devDependencies['karma-coverage-istanbul-reporter']).toBeDefined();
expect(devDependencies['karma-coverage']).toBeDefined();
expect(devDependencies['karma-jasmine']).toBeDefined();
expect(devDependencies['karma-jasmine-html-reporter']).toBeDefined();
expect(devDependencies['jasmine-core']).toBeDefined();
Expand Down
8 changes: 4 additions & 4 deletions packages/angular/src/generators/karma/karma.ts
Expand Up @@ -20,12 +20,12 @@ export function karmaGenerator(tree: Tree, options: GeneratorOptions) {
tree,
{},
{
karma: '~5.0.0',
karma: '~6.3.0',
'karma-chrome-launcher': '~3.1.0',
'karma-coverage-istanbul-reporter': '~3.0.2',
'karma-coverage': '~2.2.0',
'karma-jasmine': '~4.0.0',
'karma-jasmine-html-reporter': '^1.5.0',
'jasmine-core': '~3.6.0',
'karma-jasmine-html-reporter': '~1.7.0',
'jasmine-core': '~3.10.0',
'jasmine-spec-reporter': '~5.0.0',
'@types/jasmine': '~3.5.0',
}
Expand Down
@@ -0,0 +1,72 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Migrate Karma Config should successfully migrate outdate karma setup 1`] = `
"{
\\"name\\": \\"test-name\\",
\\"dependencies\\": {},
\\"devDependencies\\": {
\\"jasmine-core\\": \\"~3.10.0\\",
\\"karma\\": \\"~6.3.0\\",
\\"karma-coverage\\": \\"~2.2.0\\",
\\"karma-jasmine-html-reporter\\": \\"~1.7.0\\"
}
}
"
`;

exports[`Migrate Karma Config should successfully migrate outdate karma setup 2`] = `
"// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
const { join } = require('path');
const { constants } = require('karma');
module.exports = () => {
return {
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage'),
require('@angular-devkit/build-angular/plugins/karma'),
],
client: {
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageReporter: {
dir: join(__dirname, './coverage'),
subdir: '.',
reporters: [{ type: 'html' }, { type: 'text-summary' }],
fixWebpackSourcePaths: true,
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: constants.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: true,
};
};"
`;

exports[`Migrate Karma Config should successfully migrate outdate karma setup 3`] = `
"// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
const { join } = require('path');
const getBaseKarmaConfig = require('../../karma.conf');
module.exports = function(config) {
const baseConfig = getBaseKarmaConfig();
config.set({
...baseConfig,
coverageReporter: {
...baseConfig.coverageReporter,
dir: join(__dirname, '../../coverage/apps/test')
}
});
};"
`;
@@ -0,0 +1,92 @@
import { addProjectConfiguration } from '@nrwl/devkit';
import { createTreeWithEmptyWorkspace } from '@nrwl/devkit/testing';

import migrateKarmaConfig from './migrate-karma-conf';

describe('Migrate Karma Config', () => {
it('should successfully migrate outdate karma setup', async () => {
// ARRANGE
const tree = createTreeWithEmptyWorkspace(2);
tree.write(
'karma.conf.js',
`// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
const { join } = require('path');
const { constants } = require('karma');
module.exports = () => {
return {
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma'),
],
client: {
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: join(__dirname, '../../coverage'),
reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true,
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: constants.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: true,
};
};`
);

addProjectConfiguration(tree, 'test', {
root: 'apps/test',
targets: {
test: {
executor: '@angular-devkit/build-angular:karma',
options: {
karmaConfig: 'karma.conf.js',
},
},
},
});

tree.write(
'apps/test/karma.conf.js',
`// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
const { join } = require('path');
const getBaseKarmaConfig = require('../../karma.conf');
module.exports = function(config) {
const baseConfig = getBaseKarmaConfig();
config.set({
...baseConfig,
coverageIstanbulReporter: {
...baseConfig.coverageIstanbulReporter,
dir: join(__dirname, '../../coverage/apps/test')
}
});
};`
);

// ACT
await migrateKarmaConfig(tree);

// ASSERT
const packageJson = tree.read('package.json', 'utf-8');
const rootKarmaContents = tree.read('karma.conf.js', 'utf-8');
const appKarmaContents = tree.read('apps/test/karma.conf.js', 'utf-8');

expect(packageJson).toMatchSnapshot();
expect(rootKarmaContents).toMatchSnapshot();
expect(appKarmaContents).toMatchSnapshot();
});
});
@@ -0,0 +1,60 @@
import type { Tree } from '@nrwl/devkit';
import {
addDependenciesToPackageJson,
joinPathFragments,
readProjectConfiguration,
formatFiles,
} from '@nrwl/devkit';
import { forEachExecutorOptions } from '@nrwl/workspace/src/utilities/executor-options-utils';
export default async function (tree: Tree) {
const executorName = '@angular-devkit/build-angular:karma';

forEachExecutorOptions(tree, executorName, ({ karmaConfig }, projectName) => {
const project = readProjectConfiguration(tree, projectName);

const pathToKarma = joinPathFragments(project.root, karmaConfig);
if (!tree.exists(pathToKarma)) {
return;
}

const karmaContents = tree.read(pathToKarma, 'utf-8');
const updatedKarmaContents = karmaContents.replace(
/coverageIstanbulReporter/g,
'coverageReporter'
);

tree.write(pathToKarma, updatedKarmaContents);
});

const pathToRootKarmaConf = 'karma.conf.js';
if (!tree.exists(pathToRootKarmaConf)) {
return;
}

const rootKarmaContents = tree.read(pathToRootKarmaConf, 'utf-8');
const updatedKarmaContents = rootKarmaContents
.replace(/coverageIstanbulReporter/g, 'coverageReporter')
.replace(/karma-coverage-istanbul-reporter/, 'karma-coverage')
.replace(
/reports: \['html', 'lcovonly'\]/,
`subdir: '.',\nreporters: [{ type: 'html' }, { type: 'text-summary' }]`
)
.replace(/'\.\.\/\.\.\/coverage'/, `'./coverage'`);

tree.write(pathToRootKarmaConf, updatedKarmaContents);

const installPackages = addDependenciesToPackageJson(
tree,
{},
{
karma: '~6.3.0',
'karma-coverage': '~2.2.0',
'karma-jasmine-html-reporter': '~1.7.0',
'jasmine-core': '~3.10.0',
}
);

await formatFiles(tree);

return installPackages;
}

0 comments on commit 01dba86

Please sign in to comment.