bin/BrowserSystem.js includes compiler, polyfills, System, and WebPag…

Now includes compiler, polyfills, System, and WebPageTranscoder. Read traceurOptions attribute from <script type=module traceurOptions="--asyncFunctions">. Use bin/BrowserSystem.js + System.import in repl.html to demo dynamic import. Use bin/BrowserSystem.js + System.loadScriptTypeModule() in async.html/await.html to demo script tag import. Review URL: https://api.github.com/repos/google/traceur-compiler/issues/2103 Closes #2103.
google · Apr 10, 2016 · 412a09e · 412a09e
1 parent a73f12b
commit 412a09e
Show file tree

Hide file tree

Showing 13 changed files with 39 additions and 45 deletions.
diff --git a/Makefile b/Makefile
@@ -222,8 +222,10 @@ build/compiled-by-previous-traceur.js: src/loader/version.js \
 debug: build/compiled-by-previous-traceur.js $(SRC)
 	./traceur --debug --out bin/traceur.js --sourcemap $(RUNTIME_SCRIPTS) $(TFLAGS) $(SRC)
 
-bin/BrowserSystem.js: src/browser/System.js
-	./traceur --out $@ $(TFLAGS) $^
+# Stand-alone browser support, incl. runtime, polyfills, compiler, and System
+bin/BrowserSystem.js: src/browser/System.js src/WebPageTranscoder.js $(SRC_ALL)
+	node_modules/traceur/traceur  --source-maps=file --out $@ --referrer='traceur@$(PACKAGE_VERSION)/bin/' \
+	  $(RUNTIME_SCRIPTS) $(TFLAGS) $(SRC) src/browser/System.js
 
 #
 # Rules to test traceur.js compiled through path that first compiles out modules then es6.

diff --git a/demo/1947/index.html b/demo/1947/index.html
@@ -3,7 +3,7 @@
 <head lang="en">
 <meta charset="UTF-8">
 <title></title>
-<script src="../../bin/traceur.js"></script>
+<script src="../../bin/BrowserSystem.js"></script>
 <script src="../../src/bootstrap.js"></script>
 </head>
 <body>

diff --git a/demo/async.html b/demo/async.html
@@ -24,22 +24,13 @@
   line-height: 22px;
   letter-spacing: -2px;
 }
-
 </style>
-<script src="../bin/traceur.js"></script>
-</head>
-<body>
-
-<div id="box">Traceur<br>Rocks!</div>
-
+<script src="../bin/BrowserSystem.js"></script>
 <script>
-new traceur.WebPageTranscoder(document.location.href, {
-  asyncFunctions: true,
-  asyncGenerators: true,
-  forOn: true
-}).run();
+System.loadScriptTypeModule();
 </script>
-<script type="module">
+
+<script type="module" traceurOptions="--async-functions --async-generators --for-on">
 
 import Observable from './resources/Observable.js';
 
@@ -60,5 +51,8 @@
 followMouse();
 
 </script>
+</head>
+<body>
+  <div id="box">Traceur<br>Rocks!</div>
 </body>
 </html>
diff --git a/demo/await.html b/demo/await.html
@@ -19,18 +19,11 @@
 }
 
 </style>
-<script src="../bin/traceur.js"></script>
-</head>
-<body>
-
-<div id="box">Traceur<br>Rocks!</div>
-
+<script src="../bin/BrowserSystem.js"></script>
 <script>
-new traceur.WebPageTranscoder(document.location.href,{
-  asyncFunctions: true
-}).run();
+System.loadScriptTypeModule();
 </script>
-<script type="module">
+<script type="module" traceurOptions="--async-functions">
 
 function awaitTimeout(ms) {
   return new Promise((resolve) => {
@@ -72,5 +65,8 @@
 animateAsyncVertical();
 
 </script>
+</head>
+<body>
+  <div id="box">Traceur<br>Rocks!</div>
 </body>
 </html>
diff --git a/demo/repl.html b/demo/repl.html
@@ -45,7 +45,6 @@
 <script src="../third_party/CodeMirror-4.0.3/mode/javascript/javascript.js"></script>
 <script src="../third_party/CodeMirror-4.0.3/keymap/sublime.js"></script>
 
-<script src="../bin/traceur.js"></script>
 <script src="../bin/BrowserSystem.js"></script>
 
 <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Droid+Sans+Mono|Droid+Sans">

diff --git a/package.json b/package.json
@@ -24,7 +24,9 @@
   },
   "files": [
     "bin/traceur.js",
+    "bin/traceur.js.map",
     "bin/traceur-runtime.js",
+    "bin/BrowserSystem.js",
     "src/",
     "dist/",
     "traceur"

diff --git a/src/WebPageTranscoder.js b/src/WebPageTranscoder.js
@@ -14,10 +14,8 @@
 
 // Applies Traceur to all scripts in a Web page.
 
-import {Loader} from './loader/Loader.js';
-import {BrowserTraceurLoader} from './loader/TraceurLoader.js';
 import {ErrorReporter} from './util/ErrorReporter.js';
-import {Options} from './Options.js';
+import {CommandOptions} from './Options.js';
 import {webLoader} from './loader/webLoader.js';
 
 export const scriptSelector = 'script[type="module"],script[type="text/traceur"]';
@@ -48,17 +46,22 @@ export class WebPageTranscoder {
   }
 
   addFileFromScriptElement(scriptElement, name, content) {
+    let options = this.traceurOptions_;
+    let elementOptionString = scriptElement.getAttribute('traceurOptions');
+    if (elementOptionString) {
+      options = CommandOptions.fromString(elementOptionString);
+    }
     let nameInfo = {
       address: name,
       referrerName: window.location.href,
       name: name,
-      metadata: {traceurOptions: this.traceurOptions_}
+      metadata: {traceurOptions: options}
     };
     let loadingResult;
     if (scriptElement.type === 'module')
-      loadingResult = this.loader.module(content, nameInfo);
+      loadingResult = System.module(content, nameInfo);
     else
-      loadingResult = this.loader.script(content, nameInfo);
+      loadingResult = System.script(content, nameInfo);
     loadingResult.catch(function(error) {
       console.error(error.stack || error);
     });
@@ -107,13 +110,6 @@ export class WebPageTranscoder {
     return this.reporter_;
   }
 
-  get loader() {
-    if (!this.loader_) {
-      this.loader_ = new BrowserTraceurLoader();
-    }
-    return this.loader_;
-  }
-
   putFile(file) {
     let scriptElement = document.createElement('script');
     scriptElement.setAttribute('data-traceur-src-url', file.name);

diff --git a/src/bootstrap.js b/src/bootstrap.js
@@ -12,4 +12,4 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-new traceur.WebPageTranscoder(document.location.href).run();
+System.loadScriptTypeModule(/* Use default options */);
diff --git a/src/loader/TraceurLoader.js b/src/loader/TraceurLoader.js
@@ -15,9 +15,11 @@
 import {isAbsolute, resolveUrl} from '../util/url.js';
 import {Loader} from './Loader.js';
 import {LoaderCompiler} from './LoaderCompiler.js';
+import {Options} from '../Options.js';
 import {systemjs} from './system-map.js';
 import {webLoader} from './webLoader.js';
 import {version} from './version.js';
+import {WebPageTranscoder} from '../WebPageTranscoder.js';
 
 var uniqueNameCount = 0;
 
@@ -312,4 +314,7 @@ export class BrowserTraceurLoader extends TraceurLoader {
   constructor() {
     super(webLoader, window.location.href, new LoaderCompiler());
   }
+  loadScriptTypeModule(traceurOptions = new Options()) {
+    new traceur.WebPageTranscoder(document.location.href, traceurOptions).run();
+  }
 }
diff --git a/test/manual/browser_error.html b/test/manual/browser_error.html
@@ -1,4 +1,4 @@
-<script src="../../bin/traceur.js"></script>
+<script src="../../bin/BrowserSystem.js"></script>
 <script src="../../src/bootstrap.js"></script>
 <script type="module">
     class Foo {}

diff --git a/test/unit/system/ScriptTypeTextTraceur.html b/test/unit/system/ScriptTypeTextTraceur.html
@@ -2,7 +2,7 @@
 <html>
 <head>
     <title>Hello, World!</title>
-    <script src="../../../bin/traceur.js"></script>
+    <script src="../../../bin/BrowserSystem.js"></script>
     <script src="../../../src/bootstrap.js"></script>
 </head>
 <body>

diff --git a/test/unit/tools/HTMLImportTranscoder/basic/index.html b/test/unit/tools/HTMLImportTranscoder/basic/index.html
@@ -2,7 +2,7 @@
 <html>
 <head>
     <title>Basic HTML Import Test</title>
-    <script src="../../../../../bin/traceur.js"></script>
+    <script src="../../../../../bin/BrowserSystem.js"></script>
     <script src="../../../../../src/bootstrap.js"></script>
     <script src="../../../../../node_modules/webcomponents.js/HTMLImports.js"></script>
     <link rel="import" href="a.html">

diff --git a/test/unit/tools/HTMLImportTranscoder/import-order/index.html b/test/unit/tools/HTMLImportTranscoder/import-order/index.html
@@ -2,7 +2,7 @@
 <html>
 <head>
   <title>HTML Import Order Test</title>
-  <script src="../../../../../bin/traceur.js"></script>
+  <script src="../../../../../bin/BrowserSystem.js"></script>
   <script src="../../../../../src/bootstrap.js"></script>
   <script src="../../../../../node_modules/webcomponents.js/HTMLImports.js"></script>
   <script>