update ts options

Author: ALEX-ANV

apps/codelab/src/app/components/angular-test-runner/angular-test-runner.component.ts

@@ -12,54 +12,13 @@ import {
   SimpleChanges,
   ViewChild,
 } from '@angular/core';
-import babel_traverse from '@babel/traverse';
-import * as babylon from 'babylon';
-import * as babel_types from 'babel-types';
+import { createSystemJsSandbox } from '@codelab/code-demos/src/lib/shared/sandbox';
+import { ScriptLoaderService } from '@codelab/code-demos/src/lib/shared/script-loader.service';
 import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
 import { Subscription } from 'rxjs/internal/Subscription';
+import { TestRunResult } from '@codelab/utils/src/lib/test-results/common';
 import { handleTestMessage } from './tests';
-import { TestRunResult } from "@codelab/utils";
-import { createSystemJsSandbox } from "@codelab/code-demos";
-import { getTypeScript, ScriptLoaderService } from '@codelab/sandbox-runner';
-
-const ts = getTypeScript();
-
-// TODO(kirjs): This is a duplicate
-export function addMetaInformation(sandbox, files: { [key: string]: string }) {
-  // sandbox.evalJs(`System.registry.delete(System.normalizeSync('./code'));`);
-
-  (sandbox.iframe.contentWindow as any).System.register(
-    'code',
-    [],
-    function (exports) {
-      return {
-        setters: [],
-        execute: function () {
-          exports('ts', ts);
-          exports('babylon', babylon);
-          exports('babel_traverse', babel_traverse);
-          exports('babel_types', babel_types);
-          Object.entries(files)
-            .filter(([moduleName]) => moduleName.match(/\.ts$/))
-            .forEach(([path, code]) => {
-              exports(path.replace(/[\/.-]/gi, '_'), code);
-              exports(
-                path.replace(/[\/.-]/gi, '_') + '_AST',
-                ts.createSourceFile(path, code, ts.ScriptTarget.ES5)
-              );
-            });
-
-          Object.entries(files)
-            .filter(([moduleName]) => moduleName.match(/\.html/))
-            .forEach(([path, code]) => {
-              const templatePath = path.replace(/[\/.-]/gi, '_');
-              exports(templatePath, code);
-            });
-        },
-      };
-    }
-  );
-}
+import { addMetaInformation } from "@codelab/code-demos/src/lib/shared/helpers";
 
 @Component({
   selector: 'codelab-simple-angular-test-runner',
@@ -127,8 +86,8 @@ export class SimpleAngularTestRunnerComponent
       },
       ({ evalJs }) => {
         evalJs(this.scriptLoaderService.getScript('chai'));
-        // evalJs(this.scriptLoaderService.getScript('shim'));
         evalJs(this.scriptLoaderService.getScript('zone'));
+        evalJs(this.scriptLoaderService.getScript('reflectMetadata'));
       }
     );
 
@@ -162,7 +121,7 @@ export class SimpleAngularTestRunnerComponent
         .some((a) => a);
 
       if (!hasErrors) {
-        sandbox.evalJs(`System.import('${this.bootstrap}')`);
+        sandbox.evalJs(`System.import('./${this.bootstrap}')`);
       }
     });
   }

libs/code-demos/src/lib/code-demo-runner/code-demo-runner.component.ts

@@ -91,7 +91,7 @@ export class CodeDemoRunnerComponent
         url: this.url,
       },
       ({ evalJs }) => {
-        // evalJs(this.scriptLoaderService.getScript('shim'));
+        evalJs(this.scriptLoaderService.getScript('reflectMetadata'));
         evalJs(this.scriptLoaderService.getScript('zone'));
       }
     );
@@ -157,7 +157,7 @@ export class CodeDemoRunnerComponent
 
       if (jsFiles.length) {
         if (this.bootstrap && !hasErrors) {
-          sandbox.evalJs(`System.import('${this.bootstrap}')`);
+          sandbox.evalJs(`System.import('./${this.bootstrap}')`);
         }
       }
     });

libs/code-demos/src/lib/runner/compile-ts-files.ts

@@ -30,24 +30,16 @@ interface Output {
 }
 
 const compilerOptions: TsTypes.CompilerOptions = {
+  baseUrl: './',
   module: ts.ModuleKind.System,
   target: ts.ScriptTarget.ES2017,
   experimentalDecorators: true,
   emitDecoratorMetadata: true,
   noImplicitAny: true,
   declaration: true,
-  baseUrl: './',
   lib: ['dom', 'es6'],
 };
 
-// TODO(sancheez): List of named imports
-const namedRegisterModules = [
-  'main',
-  'code',
-  'tests/test',
-  'bootstrap'
-];
-
 
 type ObservableFiles = Observable<Files>;
 
@@ -77,14 +69,10 @@ function watch(
         return undefined;
       }
 
-      const namedModule = namedRegisterModules.find((item) => fileName.toLowerCase().includes(item));
-
       const baseName = fileName.replace('.ts', '');
 
-      const name = namedModule ? baseName:  `./${baseName}`;
-
       return ts.ScriptSnapshot.fromString(
-        `/// <amd-module name="${name}" />\n` + file.file
+        `/// <amd-module name="./${baseName}" />\n` + file.file
       );
     },
     getCurrentDirectory: () =>  options.baseUrl,

libs/code-demos/src/lib/shared/helpers.ts

@@ -6,10 +6,8 @@ import * as babylon from 'babylon';
 import * as babel_types from 'babel-types';
 
 export function addMetaInformation(sandbox, files: { [key: string]: string }) {
-  // sandbox.evalJs(`System.registry.delete(System.normalizeSync('./code'));`);
-
   (sandbox.iframe.contentWindow as any).System.register(
-    'code',
+    './code',
     [],
     function (exports) {
       return {