"From source" NgFactory compilation / unit tests (some Babel transpilation issues remain)

Author: clbond

.gitignore

@@ -9,8 +9,9 @@ source/**/*.ngfactory.ts
 source/**/*.ngfactory.js
 source/**/*.ngsummary.json
 source/**/*.ngstyle.ts
+source/**/*.shim.ngstyle.ts
 source/**/*.shim.ts
-source/**/*.shim.jsq
+source/**/*.shim.js
 source/**/*.metadata.json
 source/**/*.js
 source/**/*.js.map

source/application/builder/from-source.ts

@@ -1,15 +1,17 @@
 import {NgModuleFactory} from '@angular/core';
 
 import {ApplicationBase} from './application';
-import {CompilerException} from 'exception';
+import {Compiler} from '../compiler';
 import {Project} from '../project';
 
 export class ApplicationFromSource<V> extends ApplicationBase<V, any> {
   constructor(public project: Project) {
     super();
   }
 
-  protected getModuleFactory(): Promise<NgModuleFactory<any>> {
-    throw new CompilerException('Not implemented');
+  protected async getModuleFactory(): Promise<NgModuleFactory<any>> {
+    const compiler = new Compiler(this.project);
+
+    return await compiler.compile();
   }
 }

…application/builder/tests/application.ts …application/builder/tests/from-module.tssource/application/builder/tests/application.ts renamed to source/application/builder/tests/from-module.ts source/application/builder/tests/application.ts renamed to source/application/builder/tests/from-module.ts

@@ -9,7 +9,7 @@ import {
   trimDocument,
 } from 'test-fixtures';
 
-describe('Application builder', () => {
+describe('ApplicationFromModule', () => {
   it('should require a template document in order to render', async (done) => {
     const application = new ApplicationFromModule(moduleFromComponent(BasicInlineComponent));
     try {

source/application/builder/tests/from-source.ts

@@ -0,0 +1,31 @@
+import {ApplicationFromSource} from '../from-source';
+
+import {templateDocument, getApplicationProject} from 'test-fixtures';
+
+xdescribe('ApplicationFromSource', () => {
+  it('can compile a project from source and load a NgFactory module', async (done) => {
+    const application =
+      new ApplicationFromSource(
+        getApplicationProject(
+          'test-fixtures/application-basic-inline',
+          'BasicInlineApplication'));
+
+    application.templateDocument(templateDocument);
+
+    const snapshot = await application.render();
+
+    snapshot.subscribe(
+      r => {
+        expect(r.exceptions).not.toBeNull();
+        expect(r.exceptions.length).toBe(0);
+        expect(r.route).not.toBeNull();
+        expect(r.route.path.length).toBe(0); // route: /
+        expect(r.variant).toBeUndefined();
+        expect(r.applicationState).toBeUndefined();
+        const expr = /<application ng-version="([\d\.]+)"><div>Hello!<\/div><\/application>/;
+        expect(expr.test(r.renderedDocument)).toBeTruthy();
+        done();
+      },
+      exception => fail(exception));
+  });
+});

source/application/compiler/compiler.ts

@@ -1,7 +1,4 @@
-import {
-  NgModuleFactory,
-  NgModule
-} from '@angular/core';
+import {NgModuleFactory} from '@angular/core';
 
 import {
   CompilerHost,
@@ -21,7 +18,6 @@ import {dirname} from 'path';
 import {CompileOptions, loadProjectOptions} from './options';
 import {CompilerException} from 'exception';
 import {Project} from '../project';
-import {Reflector} from 'platform';
 import {VirtualMachine} from './vm';
 import {diagnosticsToException} from './diagnostics';
 import {templateCompiler} from './template';
@@ -33,8 +29,11 @@ export class Compiler {
   constructor(private project: Project) {
     this.options = loadProjectOptions(project);
 
-    if (project.ngModule == null ||
-        project.ngModule.length < 2) {
+    const {rootModule} = project;
+
+    const none = (identifier: string) => identifier == null || identifier.length === 0;
+
+    if (rootModule == null || none(rootModule.source) || none(rootModule.symbol)) {
       throw new CompilerException('Compiler requires a module ID and an export name in ngModule');
     }
   }
@@ -44,23 +43,23 @@ export class Compiler {
     try {
       await this.compileToVm(vm);
 
-      const [moduleId, exported] = this.project.ngModule;
+      const {source, symbol} = this.project.rootModule;
 
-      const requiredModule = vm.require(`${moduleId}.ngfactory`); // use the compiled template, not the jit version
+      const requiredModule = vm.require(`${source}.ngfactory`); // use the compiled template, not the jit version
       if (requiredModule == null) {
-        throw new CompilerException(`Attempted to require ${moduleId}.ngfactory but received a null or undefined object`);
+        throw new CompilerException(`Attempted to load ${source}.ngfactory but received a null or undefined object`);
       }
 
-      const rootModule =
-        !exported
-          ? requiredModule
-          : requiredModule[exported];
+      const factorySymbol =
+        /NgFactory$/.test(symbol) === false
+          ? `${symbol}NgFactory`
+          : `${symbol}`;
 
-      if (Reflector.decorated(rootModule, NgModule) === false) {
-        throw new CompilerException(`Root module type ${rootModule.name} is not decorated with @NgModule`);
+      if (requiredModule.hasOwnProperty(factorySymbol) === false) {
+        throw new CompilerException(`Module ${source} does not export a ${factorySymbol} symbol`);
       }
 
-      return rootModule;
+      return requiredModule[factorySymbol];
     }
     finally {
       vm.dispose();

source/application/compiler/tests/compiler.ts

@@ -1,22 +1,15 @@
-import {dirname} from 'path';
-
-import {filesystemSearchUpward} from 'test-fixtures';
+import {getApplicationProject} from 'test-fixtures';
 
 import {Compiler} from '../compiler';
 
-describe('Compiler', () => {
-  const createCompiler = () => {
-    const tsconfig = filesystemSearchUpward(__dirname, 'tsconfig.json');
-
-    return new Compiler({
-      basePath: dirname(tsconfig),
-      ngModule: ['test-fixtures/application-basic-inline', 'BasicInlineApplication'],
-      tsconfig,
-    });
-  };
+xdescribe('Compiler', () => {
+  it('should be able to build a TypeScript application and produce in-memory artifacts', async () => {
+    const compiler =
+      new Compiler(
+        getApplicationProject(
+          'test-fixtures/application-basic-inline',
+          'BasicInlineApplication'));
 
-  xit('should be able to build a TypeScript application and produce in-memory artifacts', async () => {
-    const compiler = createCompiler();
     const module = await compiler.compile();
     expect(module).not.toBeNull();
     expect(typeof module).toBe('function');

source/application/compiler/vm/vm.ts

@@ -83,13 +83,15 @@ const normalizeModuleId = (to: string, from?: string): string => {
 };
 
 const baseRequire = (moduleId: string) => {
+  console.log('base require', moduleId);
+
   // For whatever reason, the unbundled JS code in the Angular npm module is compiled into
   // ES2015 code which cannot be run on most NodeJS versions. So for Angular, we transpile
   // using Babel from ES2015 -> ES5 so that we can get broadly-compatible code (like what
   // is in the umd bundles) which we can execute in our VM. Ideally, this hack would not
   // be necessary. Other libraries are just require()d normally without the transpilation
   // because they do not require it and it would be a performance drain.
-  if (/^@angular\//.test(moduleId)) {
+  if (/^\@angular\//.test(moduleId)) {
     return transpile(moduleId);
   }
   return require(moduleId);

source/application/project.ts

@@ -5,6 +5,9 @@ export interface Project {
   // path to the tsconfig.json file for this project
   tsconfig: string;
 
-  // path to the application root NgModule, and the name of that module
-  ngModule: [string, string];
+  // path to the application root NgModule file, and the name of that module
+  rootModule: {
+    source: string;
+    symbol: string;
+  }
 }

source/exception.ts

@@ -24,7 +24,6 @@ export class Exception extends Error {
 export class ApplicationException extends Exception {}
 export class CompilerException extends Exception {}
 export class ModuleException extends Exception {}
-export class PathException extends Exception {}
 export class PlatformException extends Exception {}
 export class RendererException extends Exception {}
 export class ResourceException extends Exception {}

source/route/tests/renderable.ts

@@ -3,14 +3,14 @@ import {renderableRoutes} from 'index';
 import {
   BasicInlineComponent,
   moduleFactoryFromComponent,
-  documentTemplate
+  templateDocument
 } from 'test-fixtures';
 
 describe('renderable routes', () => {
   it('should return a single route for an NgModule that does not use Router', async (done) => {
     const moduleFactory = await moduleFactoryFromComponent(BasicInlineComponent);
 
-    const routes = renderableRoutes(moduleFactory, documentTemplate);
+    const routes = renderableRoutes(moduleFactory, templateDocument);
 
     routes.then(result => {
       expect(result.length).toBe(1);