Merge pull request #470 from kratiahuja/new-import-api

Register fastboot transform

Author: kratiahuja

README.md

@@ -131,7 +131,7 @@ By default, FastBoot waits for the `beforeModel`, `model`, and
 client. If you have asynchrony that runs outside of those contexts, your
 response may not reflect the state that you want.
 
-To solve this, the `fastboot` service has `deferRendering` method that accepts 
+To solve this, the `fastboot` service has `deferRendering` method that accepts
 a promise. It will chain all promises passed to it, and the FastBoot server will
 wait until all of these promises resolve before sending the response to
 the client. These promises must be chained before the rendering is
@@ -142,7 +142,7 @@ defer the rendering of the page.
 
 The following example demonstrates how the `deferRendering` method can be
 used to ensure posts data has been loaded asynchronously by a component before
-rendering the entire page. Note how the call should be wrapped in a `fastboot.isFastboot` 
+rendering the entire page. Note how the call should be wrapped in a `fastboot.isFastboot`
 check since the method will throw an exception outside of that context:
 
 ```js
@@ -383,8 +383,20 @@ export default Ember.Route.extend({
 There are two places where the inclusion of incompatible JavaScript libraries could
 occur:
 
- 1. `app.import` in the application's `ember-cli-build.js`
- 2. `app.import` in an addon's `included` hook
+#### `app.import` in the application's `ember-cli-build.js`
+
+If your Ember application is importing an incompatible Javascript library,you can use `app.import` with the `using` API.
+
+```js
+app.import('vendor/fastboot-incompatible.js', {
+  using: [
+    {
+      transformation: 'fastbootShim'
+    }
+  ]
+});
+```
+#### `app.import` in an addon's `included` hook
 
 You can include the incompatible Javascript libraries by wrapping them with a `FastBoot` variable check. In the browser, `FastBoot` global variable is not defined.
 

index.js

@@ -16,6 +16,7 @@ const migrateInitializers = require('./lib/build-utilities/migrate-initializers'
 const Concat = require('broccoli-concat');
 const Funnel = require('broccoli-funnel');
 const p = require('ember-cli-preprocess-registry/preprocessors');
+const fastbootTransform = require('fastboot-transform');
 const existsSync = fs.existsSync;
 
 let checker;
@@ -27,6 +28,8 @@ function getVersionChecker(context) {
   return checker;
 }
 
+
+
 /*
  * Main entrypoint for the Ember CLI addon.
  */
@@ -63,6 +66,17 @@ module.exports = {
     migrateInitializers(this.project);
   },
 
+  /**
+   * Registers the fastboot shim that allows apps and addons to wrap non-compatible
+   * libraries in Node with a FastBoot check using `app.import`.
+   *
+   */
+  importTransforms() {
+    return {
+      fastbootShim: fastbootTransform
+    }
+  },
+
   /**
    * Inserts placeholders into index.html that are used by the FastBoot server
    * to insert the rendered content into the right spot. Also injects a module
@@ -206,8 +220,8 @@ module.exports = {
   /**
    * Need to handroll our own clone algorithm since JSON.stringy changes regex
    * to empty objects which breaks hostWhiteList property of fastboot.
-   * 
-   * @param {Object} config 
+   *
+   * @param {Object} config
    */
   _cloneConfigObject(config) {
     if (config === null || typeof config !== 'object') {

package.json

@@ -29,7 +29,6 @@
     "ember-cli-version-checker": "^2.0.0",
     "fastboot": "^1.1.0",
     "fastboot-express-middleware": "^1.1.0",
-    "fs-extra": "^4.0.0",
     "json-stable-stringify": "^1.0.1",
     "md5-hex": "^2.0.0",
     "silent-error": "^1.0.0"
@@ -42,7 +41,7 @@
     "chai-fs": "^1.0.0",
     "co": "^4.6.0",
     "ember-ajax": "^3.0.0",
-    "ember-cli": "~2.15.1",
+    "ember-cli": "~2.16.2",
     "ember-cli-addon-tests": "^0.11.0",
     "ember-cli-dependency-checker": "^2.0.1",
     "ember-cli-eslint": "^4.1.0",
@@ -59,6 +58,8 @@
     "ember-resolver": "^4.3.0",
     "ember-sinon": "^1.0.0",
     "ember-source": "~2.16.0",
+    "fastboot-transform": "^0.1.2",
+    "fs-extra": "^4.0.0",
     "glob": "^7.0.0",
     "loader.js": "^4.2.3",
     "mocha": "^4.0.0",

test/fixtures/dummy/app/router.js

@@ -8,6 +8,7 @@ var Router = Ember.Router.extend({
 Router.map(function() {
   this.route('posts');
   this.route('boom');
+  this.route('imports');
 });
 
 export default Router;

test/fixtures/dummy/app/routes/imports.js

@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Route.extend({
+  model: function() {
+    return {
+      importStatus: window.browserImportStatus || 'FastBoot default default value'
+    };
+  }
+});

test/fixtures/dummy/app/templates/imports.hbs

@@ -0,0 +1 @@
+FastBoot compatible vendor file: {{model.importStatus}}

test/fixtures/dummy/ember-cli-build.js

@@ -0,0 +1,17 @@
+/*jshint node:true*/
+/* global require, module */
+var EmberApp = require('ember-cli/lib/broccoli/ember-app');
+
+module.exports = function(defaults) {
+  var app = new EmberApp(defaults, {});
+
+  app.import('vendor/fastboot-incompatible.js', {
+    using: [
+      {
+        transformation: 'fastbootShim'
+      }
+    ]
+  });
+
+  return app.toTree();
+};

test/fixtures/dummy/vendor/fastboot-incompatible.js

@@ -0,0 +1 @@
+window.browserImportStatus = 'This file was never imported in FastBoot';

test/simple-test.js

@@ -111,6 +111,21 @@ describe('simple acceptance', function() {
       });
   });
 
+  it('/imports HTML contents', function() {
+    return request({
+      url: 'http://localhost:49741/imports',
+      headers: {
+        'Accept': 'text/html'
+      }
+    })
+      .then(function(response) {
+        console.log(response.body);
+        expect(response.statusCode).to.equal(200);
+        expect(response.headers["content-type"]).to.eq("text/html; charset=utf-8");
+        expect(response.body).to.contain("FastBoot compatible vendor file: FastBoot default default value");
+      });
+  });
+
   it('/assets/vendor.js', function() {
     return request('http://localhost:49741/assets/vendor.js')
       .then(function(response) {

testem.js

@@ -9,11 +9,14 @@ module.exports = {
     'Chrome'
   ],
   browser_args: {
-    Chrome: [
+    Chrome: {
+      mode: 'ci',
+      args: [
       '--disable-gpu',
       '--headless',
       '--remote-debugging-port=9222',
       '--window-size=1440,900'
-    ]
+      ]
+    }
   }
 };