fix: not all schematic collections get picked up and displayed

apps/angular-console-e2e/src/integration/extensions.spec.ts

@@ -3,11 +3,13 @@ import {
   clickOnTask,
   goBack,
   goToExtensions,
+  goToGenerate,
   openProject,
   projectPath,
   taskListHeaders,
   tasks,
-  texts
+  texts,
+  waitForActionToComplete
 } from './utils';
 
 describe('Extensions', () => {
@@ -33,24 +35,28 @@ describe('Extensions', () => {
   });
 
   it('adds an extension', () => {
-    clickOnTask('Available Extensions', '@progress/kendo-angular-menu', false);
-    cy.get('div.context-title').contains(
-      '@progress/kendo-angular-menu extension'
-    );
+    clickOnTask('Available Extensions', '@angular/material', false);
+    cy.get('div.context-title').contains('@angular/material');
 
     cy.get('button')
       .contains('Add')
       .click();
 
-    cy.wait(100);
+    checkDisplayedCommand(`$ ng add @angular/material`);
 
-    checkDisplayedCommand(`$ ng add @progress/kendo-angular-menu`);
+    waitForActionToComplete();
 
     goBack();
 
     cy.get('div.title').contains('Add/Remove CLI Extensions');
     taskListHeaders($p => {
       expect(texts($p)[0]).to.equal('Available Extensions');
     });
+
+    // check that the schematics added by angular material are available
+    goToGenerate();
+    taskListHeaders($p => {
+      expect(texts($p)[0]).to.equal('@angular/material');
+    });
   });
 });

apps/angular-console-e2e/src/integration/generate.spec.ts

@@ -22,7 +22,7 @@ describe('Generate', () => {
 
   it('filters schematics', () => {
     taskListHeaders($p => {
-      expect($p.length).to.equal(1);
+      expect($p.length).to.equal(2);
       expect(texts($p)[0]).to.equal('@schematics/angular');
     });
 

apps/angular-console-e2e/src/integration/tasks.spec.ts

@@ -10,7 +10,7 @@ import {
   taskListHeaders,
   tasks,
   texts,
-  waitForBuild
+  waitForActionToComplete
 } from './utils';
 
 describe('Tasks', () => {
@@ -74,7 +74,7 @@ describe('Tasks', () => {
       .contains('Run')
       .click();
 
-    waitForBuild();
+    waitForActionToComplete();
     checkFileExists(`dist/proj/main.js`);
 
     goBack();

apps/angular-console-e2e/src/integration/utils.ts

@@ -175,14 +175,19 @@ export function waitForAutocomplete() {
   cy.wait(700);
 }
 
-export function waitForBuild() {
-  cy.wait(35000);
-}
-
 export function waitForNgNew() {
   cy.wait(120000);
 }
 
+export function waitForActionToComplete() {
+  cy.wait(100); // this is to give the app time ot disable the button first
+  cy.get('button.action-button:enabled[color="primary"]', {
+    timeout: 120000
+  }).should($p => {
+    expect($p.length).to.equal(1);
+  });
+}
+
 export function autocompletion(callback: (s: any) => void) {
   cy.get('div.mat-autocomplete-panel').within(() => {
     cy.root()

libs/feature-generate/src/lib/schematics/schematics.component.ts

@@ -55,14 +55,7 @@ export class SchematicsComponent {
     map(r => {
       const collections: Array<SchematicCollection> = (r as any).data.workspace
         .schematicCollections;
-      return collections
-        .map(c => {
-          const s = [...c.schematics].sort((a, b) =>
-            a.name.localeCompare(b.name)
-          );
-          return { ...c, schematics: s };
-        })
-        .filter(c => c.schematics.length > 0);
+      return collections.filter(c => c.schematics.length > 0);
     })
   );
 

libs/ui/src/lib/flags/flags.component.ts

@@ -217,7 +217,6 @@ export class FlagsComponent {
     this.subscription = this.formGroup.valueChanges
       .pipe(startWith(this.formGroup.value))
       .subscribe(value => {
-        console.log('changes', value);
         this.emitNext(value);
       });
   }

package.json

@@ -138,7 +138,8 @@
     "universal-analytics": "^0.4.17",
     "uuid": "^3.3.2",
     "xterm": "3.4.1",
-    "zone.js": "^0.8.26"
+    "zone.js": "^0.8.26",
+    "strip-json-comments": "2.0.1"
   },
   "jest": {
     "modulePathIgnorePatterns": [

server/package.json

@@ -24,6 +24,7 @@
     "universal-analytics": "^0.4.17",
     "uuid": "^3.3.2",
     "apollo-server-express": "^2.0.4",
+    "strip-json-comments": "2.0.1",
     "electron-store": "2.0.0"
   },
   "devDependencies": {

server/src/api/commands.ts

@@ -1,6 +1,5 @@
-import { listFilesRec } from '../utils';
-
 import * as os from 'os';
+
 const spawn = require('node-pty-prebuilt').spawn;
 
 interface CommandResult {
@@ -12,7 +11,6 @@ interface CommandResult {
 
 let commandRunIndex = 0;
 export let commandInProgress: CommandResult | null;
-export const files: { [path: string]: string[] } = {};
 
 export function runCommand(cwd: string, program: string, cmds: string[]) {
   stopAllCommands();
@@ -49,12 +47,3 @@ export function stopAllCommands() {
   }
   commandInProgress = null;
 }
-
-export function listFiles(path: string) {
-  setTimeout(() => {
-    files[path] = listFilesRec(path);
-    setTimeout(() => {
-      listFiles(path);
-    }, 60000);
-  }, 0);
-}

server/src/api/read-projects.ts

@@ -61,7 +61,7 @@ export function readSchema(basedir: string, builder: string) {
 function readBuildersFile(basedir: string, npmPackage: string): any {
   const packageJson = readJsonFile(
     path.join(npmPackage, 'package.json'),
-    basedir
+    path.join(basedir, 'node_modules')
   );
   const b = packageJson.json.builders;
   const buildersPath = b.startsWith('.') ? b : `./${b}`;

server/src/api/read-schematic-collections.ts

@@ -1,5 +1,10 @@
 import * as path from 'path';
-import { normalizeSchema, readJsonFile } from '../utils';
+import {
+  fileExistsSync,
+  listOfUnnestedNpmPackages,
+  normalizeSchema,
+  readJsonFile
+} from '../utils';
 
 interface SchematicCollection {
   name: string;
@@ -22,10 +27,34 @@ interface Schematic {
   }[];
 }
 
-export function readSchematicCollections(
+export function readAllSchematicCollections(basedir: string) {
+  const nodeModulesDir = path.join(basedir, 'node_modules');
+  const packages = listOfUnnestedNpmPackages(nodeModulesDir);
+  const schematicCollections = packages.filter(p => {
+    try {
+      return !!readJsonFile(path.join(p, 'package.json'), nodeModulesDir).json
+        .schematics;
+    } catch (e) {
+      if (
+        e.message &&
+        (e.message.indexOf('no such file') > -1 ||
+          e.message.indexOf('not a directory') > -1)
+      ) {
+        return false;
+      } else {
+        throw e;
+      }
+    }
+  });
+  return schematicCollections.map(c =>
+    readSchematicCollections(nodeModulesDir, c)
+  );
+}
+
+function readSchematicCollections(
   basedir: string,
   collectionName: string
-): SchematicCollection[] {
+): SchematicCollection {
   const packageJson = readJsonFile(
     path.join(collectionName, 'package.json'),
     basedir
@@ -34,42 +63,24 @@ export function readSchematicCollections(
     packageJson.json.schematics,
     path.dirname(packageJson.path)
   );
-  const collectionSchematics = [];
-  let ex = [] as any[];
-  if (collection.json.extends) {
-    const e = Array.isArray(collection.json.extends)
-      ? collection.json.extends
-      : [collection.json.extends];
-    ex = [...ex, ...e];
-  }
-
   const schematicCollection = {
     name: collectionName,
     schematics: [] as Schematic[]
   };
   Object.entries(collection.json.schematics).forEach(([k, v]: [any, any]) => {
-    if (!v.hidden) {
-      if (v.extends) {
-        ex.push(v.extends.split(':')[0]);
-      } else {
-        const schematicSchema = readJsonFile(
-          v.schema,
-          path.dirname(collection.path)
-        );
+    if (!v.hidden && !v.extends) {
+      const schematicSchema = readJsonFile(
+        v.schema,
+        path.dirname(collection.path)
+      );
 
-        schematicCollection.schematics.push({
-          name: k,
-          collection: collectionName,
-          schema: normalizeSchema(schematicSchema.json),
-          description: v.description
-        });
-      }
+      schematicCollection.schematics.push({
+        name: k,
+        collection: collectionName,
+        schema: normalizeSchema(schematicSchema.json),
+        description: v.description
+      });
     }
   });
-
-  let res = [schematicCollection];
-  new Set(ex).forEach(e => {
-    res = [...res, ...readSchematicCollections(basedir, e)];
-  });
-  return res;
+  return schematicCollection;
 }

server/src/schema/resolvers.ts

@@ -4,7 +4,9 @@ import {
   filterByName,
   findClosestNg,
   findExecutable,
-  readJsonFile
+  readJsonFile,
+  files,
+  cacheFiles
 } from '../utils';
 import {
   completeFiles,
@@ -13,7 +15,7 @@ import {
   completeProjects
 } from '../api/completions';
 
-import { readSchematicCollections } from '../api/read-schematic-collections';
+import { readAllSchematicCollections } from '../api/read-schematic-collections';
 import {
   readDescription,
   readProjects,
@@ -26,8 +28,6 @@ import { openInEditor, readEditors } from '../api/read-editors';
 import { readNpmScripts, readNpmScriptSchema } from '../api/read-npm-scripts';
 import { readDirectory } from '../api/read-directory';
 import {
-  listFiles,
-  files,
   commandInProgress,
   runCommand,
   stopAllCommands
@@ -76,14 +76,7 @@ const Workspace = {
     if (!directoryExists(path.join(p, 'node_modules'))) {
       throw new Error(`node_modules is not found`);
     }
-
-    const angularJson = readJsonFile('./angular.json', p).json;
-    const collectionName =
-      angularJson.cli && angularJson.cli.defaultCollection
-        ? angularJson.cli.defaultCollection
-        : '@schematics/angular';
-
-    return filterByName(readSchematicCollections(p, collectionName), args);
+    return filterByName(readAllSchematicCollections(p), args);
   },
   npmScripts(workspace: any, args: any) {
     return filterByName(workspace.npmScripts, args);
@@ -128,7 +121,7 @@ const Database = {
   workspace(_root, args: any) {
     try {
       if (!files[args.path]) {
-        listFiles(args.path);
+        cacheFiles(args.path);
       }
       const packageJson = readJsonFile('./package.json', args.path).json;
       const angularJson = readJsonFile('./angular.json', args.path).json;

server/src/server.ts

@@ -6,7 +6,7 @@ import {
   filterByName,
   findClosestNg,
   findExecutable,
-  listFilesRec,
+  listFiles,
   readJsonFile
 } from './utils';
 import { schema } from './schema';