fix(angular): ensure apps/libs layout is created when migrating from …

…angular cli to nx monorepo layout (nrwl#13577)

e2e/angular-core/src/ng-add.test.ts

@@ -284,19 +284,17 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     // Restore e2e directory
     runCommand('mv e2e-bak e2e');
 
-    // TODO: this functionality is currently broken, this validation doesn't exist
-    // // Remove src
-    // runCommand('mv src src-bak');
-    // expect(() => runNgAdd('@nrwl/angular', '--npm-scope projscope --skip-install')).toThrow(
-    //   'Path: src does not exist'
-    // );
-
-    // // Put src back
-    // runCommand('mv src-bak src');
+    // Remove src
+    runCommand('mv src src-bak');
+    expect(() =>
+      runNgAdd('@nrwl/angular', '--npm-scope projscope --skip-install')
+    ).toThrow('The project source root "src" could not be found.');
+
+    // Put src back
+    runCommand('mv src-bak src');
   });
 
-  //TODO: reenable
-  xit('should handle a workspace with cypress v9', () => {
+  it('should handle a workspace with cypress v9', () => {
     addCypress9();
 
     // Remove cypress.json
@@ -383,8 +381,7 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     });
   });
 
-  //TODO: reenable
-  xit('should handle a workspace with cypress v10', () => {
+  it('should handle a workspace with cypress v10', () => {
     addCypress10();
 
     // Remove cypress.config.ts

packages/angular/src/generators/karma-project/__snapshots__/karma-project.v14.spec.ts.snap

@@ -0,0 +1,101 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`karmaProject support angular v14 --root-project should generate the right karma.conf.js file for a nested project in a workspace with a project at the root 1`] = `
+"// Karma configuration file, see link for more information
+// https://karma-runner.github.io/6.4/config/configuration-file.html
+
+const { join } = require('path');
+const setBaseKarmaConfig = require('../../karma.conf');
+
+module.exports = function (config) {
+  setBaseKarmaConfig(config);
+
+  config.set({
+    coverageReporter: {
+      dir: join(__dirname, '../../coverage/libs/nested-lib')
+    }
+  });
+};
+"
+`;
+
+exports[`karmaProject support angular v14 --root-project should support a project located at the root 1`] = `
+"// Karma configuration file, see link for more information
+// https://karma-runner.github.io/6.4/config/configuration-file.html
+
+const { constants } = require('karma');
+const { join } = require('path');
+
+module.exports = (config) => {
+  config.set({
+    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: {
+      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
+    },
+    jasmineHtmlReporter: {
+      suppressAll: true, // removes the duplicated traces
+    },
+    coverageReporter: {
+      dir: join(__dirname, 'coverage/root-app'),
+      subdir: '.',
+      reporters: [{ type: 'html' }, { type: 'text-summary' }],
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: constants.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: true,
+    restartOnFileChange: true,
+  });
+};
+"
+`;
+
+exports[`karmaProject support angular v14 should create a karma.conf.js 1`] = `
+"// Karma configuration file, see link for more information
+// https://karma-runner.github.io/6.4/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/libs/lib1')
+    }
+  });
+};
+"
+`;
+
+exports[`karmaProject support angular v14 should generate files 1`] = `
+"{
+  \\"extends\\": \\"./tsconfig.json\\",
+  \\"compilerOptions\\": {
+    \\"outDir\\": \\"../../dist/out-tsc\\",
+    \\"types\\": [\\"jasmine\\", \\"node\\"]
+  },
+  \\"files\\": [\\"src/test.ts\\"],
+  \\"include\\": [\\"**/*.spec.ts\\", \\"**/*.test.ts\\", \\"**/*.d.ts\\"]
+}
+"
+`;

packages/angular/src/generators/karma-project/angular-v14/files/common/karma.conf.js__tmpl__

@@ -0,0 +1,16 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/6.4/config/configuration-file.html
+
+const { join } = require('path');
+const getBaseKarmaConfig = require('<%= offsetFromRoot %>karma.conf');
+
+module.exports = function(config) {
+  const baseConfig = getBaseKarmaConfig();
+  config.set({
+    ...baseConfig,
+    coverageReporter: {
+      ...baseConfig.coverageReporter,
+      dir: join(__dirname, '<%= offsetFromRoot %>coverage/<%= projectRoot %>')
+    }
+  });
+};

packages/angular/src/generators/karma-project/angular-v14/files/common/src/test.ts__tmpl__

@@ -0,0 +1,22 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+<% if (isLibrary) { %>
+  import 'zone.js/dist/zone';
+  <% } %>
+import 'zone.js/dist/zone-testing';
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
+
+declare const require: any;
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting()
+);
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);

packages/angular/src/generators/karma-project/angular-v14/files/common/tsconfig.spec.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "<%= offsetFromRoot %>dist/out-tsc",
+    "types": ["jasmine", "node"]
+  },
+  "files": ["src/test.ts"],
+  "include": ["**/*.spec.ts", "**/*.test.ts", "**/*.d.ts"]
+}

packages/angular/src/generators/karma-project/angular-v14/files/root-project/karma.conf.js__tmpl__

@@ -0,0 +1,44 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/6.4/config/configuration-file.html
+
+const { constants } = require('karma');
+const { join } = require('path');
+
+module.exports = (config) => {
+  config.set({
+    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: {
+      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
+    },
+    jasmineHtmlReporter: {
+      suppressAll: true, // removes the duplicated traces
+    },
+    coverageReporter: {
+      dir: join(__dirname, 'coverage/<%= projectName %>'),
+      subdir: '.',
+      reporters: [{ type: 'html' }, { type: 'text-summary' }],
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: constants.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: true,
+    restartOnFileChange: true,
+  });
+};

packages/angular/src/generators/karma-project/angular-v14/files/workspace-with-root-project/karma.conf.js__tmpl__

@@ -0,0 +1,15 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/6.4/config/configuration-file.html
+
+const { join } = require('path');
+const setBaseKarmaConfig = require('<%= offsetFromRoot %>karma.conf');
+
+module.exports = function (config) {
+  setBaseKarmaConfig(config);
+
+  config.set({
+    coverageReporter: {
+      dir: join(__dirname, '<%= offsetFromRoot %>coverage/<%= projectRoot %>')
+    }
+  });
+};

packages/angular/src/generators/karma-project/angular-v14/karma-project.ts

@@ -0,0 +1,27 @@
+import type { GeneratorCallback, Tree } from '@nrwl/devkit';
+import { formatFiles } from '@nrwl/devkit';
+import { checkProjectTestTarget } from './lib/check-test-target';
+import { generateKarmaProjectFiles } from './lib/generate-karma-project-files';
+import { updateTsConfigs } from './lib/update-tsconfig';
+import { updateWorkspaceConfig } from './lib/update-workspace-config';
+import type { KarmaProjectOptions } from './schema';
+import { karmaGenerator } from '../../karma/karma';
+
+export async function karmaProjectGenerator(
+  tree: Tree,
+  options: KarmaProjectOptions
+): Promise<GeneratorCallback> {
+  const installTask = await karmaGenerator(tree, options);
+  checkProjectTestTarget(tree, options.project);
+  generateKarmaProjectFiles(tree, options.project);
+  updateTsConfigs(tree, options.project);
+  updateWorkspaceConfig(tree, options.project);
+
+  if (!options.skipFormat) {
+    await formatFiles(tree);
+  }
+
+  return installTask;
+}
+
+export default karmaProjectGenerator;

packages/angular/src/generators/karma-project/angular-v14/lib/check-test-target.ts

@@ -0,0 +1,9 @@
+import type { Tree } from '@nrwl/devkit';
+import { readProjectConfiguration } from '@nrwl/devkit';
+
+export function checkProjectTestTarget(tree: Tree, project: string): void {
+  const projectConfig = readProjectConfiguration(tree, project);
+  if (projectConfig.targets.test) {
+    throw new Error(`"${project}" already has a test target.`);
+  }
+}

packages/angular/src/generators/karma-project/angular-v14/lib/generate-karma-project-files.ts

@@ -0,0 +1,62 @@
+import type { Tree } from '@nrwl/devkit';
+import {
+  generateFiles,
+  getProjects,
+  joinPathFragments,
+  offsetFromRoot,
+  readProjectConfiguration,
+} from '@nrwl/devkit';
+
+export function generateKarmaProjectFiles(tree: Tree, project: string): void {
+  const projectConfig = readProjectConfiguration(tree, project);
+  generateFiles(
+    tree,
+    joinPathFragments(__dirname, '..', 'files', 'common'),
+    projectConfig.root,
+    {
+      tmpl: '',
+      isLibrary: projectConfig.projectType === 'library',
+      projectRoot: projectConfig.root,
+      offsetFromRoot: offsetFromRoot(projectConfig.root),
+    }
+  );
+
+  if (projectConfig.root === '' || projectConfig.root === '.') {
+    generateFiles(
+      tree,
+      joinPathFragments(__dirname, '..', 'files', 'root-project'),
+      projectConfig.root,
+      {
+        tmpl: '',
+        projectName: project,
+      }
+    );
+  } else if (isWorkspaceWithProjectAtRoot(tree)) {
+    generateFiles(
+      tree,
+      joinPathFragments(
+        __dirname,
+        '..',
+        'files',
+        'workspace-with-root-project'
+      ),
+      projectConfig.root,
+      {
+        tmpl: '',
+        projectRoot: projectConfig.root,
+        offsetFromRoot: offsetFromRoot(projectConfig.root),
+      }
+    );
+  }
+}
+
+function isWorkspaceWithProjectAtRoot(tree: Tree): boolean {
+  const projects = getProjects(tree);
+  for (const [, project] of projects) {
+    if (project.root === '.' || project.root === '') {
+      return true;
+    }
+  }
+
+  return false;
+}