Merge pull request #124 from typed-ember/mirage

Support ember-cli-mirage out of the box

Author: chriskrycho

README.md

@@ -22,6 +22,7 @@ Use TypeScript in your Ember 2.x and 3.x apps!
       * [Fixing the Ember Data `error TS2344` problem](#fixing-the-ember-data-error-ts2344-problem)
   * [Type definitions outside `node_modules/@types`](#type-definitions-outside-node_modulestypes)
   * [ember-browserify](#ember-browserify)
+  * [ember-cli-mirage](#ember-cli-mirage)
   * ["TypeScript is complaining about multiple copies of the same types"](#typescript-is-complaining-about-multiple-copies-of-the-same-types)
     * [Just tell me how to fix it](#just-tell-me-how-to-fix-it)
     * [Why is this happening?](#why-is-this-happening)
@@ -410,7 +411,7 @@ If you're using [ember-browserify], you're used to writing imports like this:
 [ember-browserify]: https://github.com/ef4/ember-browserify
 
 ```js
-import 'npm:my-module' from 'my-module';
+import MyModule from 'npm:my-module';
 ```
 
 If the `my-module` has types, you will not be able to resolve them this way by default. You can add a simple tweak to your `tsconfig.json` to resolve the types correctly, hwowever:
@@ -426,6 +427,47 @@ If the `my-module` has types, you will not be able to resolve them this way by d
 }
 ```
 
+### ember-cli-mirage
+
+Mirage adds files from a nonstandard location to your application tree, so you'll need to tell the TypeScript compiler about how that layout works.
+
+For an app, this should look roughly like:
+
+```js
+{
+  "compilerOptions": {
+    "paths": {
+      // ...
+      "my-app-name/mirage/*": "mirage/*",
+    }
+  },
+  "include": [
+    "app",
+    "tests",
+    "mirage"
+  ]
+}
+```
+
+And for an addon:
+
+```js
+{
+  "compilerOptions": {
+    "paths": {
+      // ...
+      "dummy/mirage/*": "tests/dummy/mirage/*",
+    }
+  },
+  "include": [
+    "addon",
+    "tests"
+  ]
+}
+```
+
+Note that if Mirage was present when you installed ember-cli-typescript (or if you run `ember g ember-cli-typescript`), this configuration should be automatically set up for you.
+
 ### "TypeScript is complaining about multiple copies of the same types!"
 
 You may sometimes see TypeScript errors indicating that you have duplicate type definitions for Ember, Ember Data, etc. This is usually the result of an annoying quirk of the way both npm and yarn resolve your dependencies in their lockfiles.

blueprints/ember-cli-typescript/index.js

@@ -29,9 +29,15 @@ module.exports = {
 
   locals() {
     let inRepoAddons = (this.project.pkg['ember-addon'] || {}).paths || [];
+    let hasMirage = 'ember-cli-mirage' in (this.project.pkg.devDependencies || {});
     let isAddon = this.project.isEmberCLIAddon();
     let includes = [isAddon ? 'addon' : 'app', 'tests'].concat(inRepoAddons);
 
+    // Mirage is already covered for addons because it's under `tests/`
+    if (hasMirage && !isAddon) {
+      includes.push('mirage');
+    }
+
     return {
       includes: JSON.stringify(includes, null, 2).replace(/\n/g, '\n  '),
       pathsFor: dasherizedName => {
@@ -40,6 +46,10 @@ module.exports = {
           [`${appName}/tests/*`]: ['tests/*'],
         };
 
+        if (hasMirage) {
+          paths[`${appName}/mirage/*`] = [`${isAddon ? 'tests/dummy/' : ''}mirage/*`];
+        }
+
         if (isAddon) {
           paths[`${appName}/*`] = ['tests/dummy/app/*'];
         } else {

lib/incremental-typescript-compiler.js

@@ -55,7 +55,12 @@ module.exports = class IncrementalTypescriptCompiler {
       [`${this._relativeAppRoot()}/app`]: 'app',
     });
 
-    let tree = new MergeTrees(addonAppTrees.concat([triggerTree, appTree]), { overwrite: true });
+    let mirage = this._mirageDirectory();
+    let mirageTree = mirage && new TypescriptOutput(this, {
+      [mirage]: 'app/mirage',
+    });
+
+    let tree = new MergeTrees(addonAppTrees.concat([triggerTree, appTree, mirageTree].filter(Boolean)), { overwrite: true });
     return new Funnel(tree, { srcDir: 'app' });
   }
 
@@ -159,6 +164,31 @@ module.exports = class IncrementalTypescriptCompiler {
     this._buildDeferred.resolve();
   }
 
+  _mirageDirectory() {
+    let mirage = this.project.addons.find(addon => addon.name === 'ember-cli-mirage');
+    if (mirage) {
+      // Be a little defensive, since we're using an internal Mirage API
+      if (
+        typeof mirage._shouldIncludeFiles !== 'function' ||
+        typeof mirage.mirageDirectory !== 'string'
+      ) {
+        this.ui.writeWarnLine(
+          `Couldn't determine whether to include Mirage files. This is likely a bug in ember-cli-typescript; ` +
+            `please file an issue at https://github.com/typed-ember/ember-cli-typescript`
+        );
+        return;
+      }
+
+      if (mirage._shouldIncludeFiles()) {
+        let source = mirage.mirageDirectory;
+        if (source.indexOf(this.project.root) === 0) {
+          source = source.substring(this.project.root.length + 1);
+        }
+        return source;
+      }
+    }
+  }
+
   _touchRebuildTrigger() {
     debugAutoresolve('touching rebuild trigger.');
     fs.writeFileSync(`${this._triggerDir}/tsc-delayed-rebuild`, '', 'utf-8');

node-tests/blueprints/ember-cli-typescript-test.js

@@ -118,4 +118,62 @@ describe('Acceptance: ember-cli-typescript generator', function() {
         expect(projectTypes).to.include(ects.APP_DECLARATIONS);
       });
   });
+
+  it('app with Mirage', function() {
+    const args = ['ember-cli-typescript'];
+
+    return helpers
+      .emberNew()
+      .then(() => {
+        const packagePath = path.resolve(process.cwd(), 'package.json');
+        const contents = JSON.parse(fs.readFileSync(packagePath, { encoding: 'utf8' }));
+        contents.devDependencies['ember-cli-mirage'] = '*';
+        fs.writeFileSync(packagePath, JSON.stringify(contents, null, 2));
+      })
+      .then(() => helpers.emberGenerate(args))
+      .then(() => {
+        const tsconfig = file('tsconfig.json');
+        expect(tsconfig).to.exist;
+
+        const json = JSON.parse(tsconfig.content);
+        expect(json.compilerOptions.paths).to.deep.equal({
+          'my-app/tests/*': ['tests/*'],
+          'my-app/mirage/*': ['mirage/*'],
+          'my-app/*': ['app/*'],
+          '*': ['types/*'],
+        });
+
+        expect(json.include).to.deep.equal(['app', 'tests', 'mirage']);
+      });
+  });
+
+  it('addon with Mirage', function() {
+    const args = ['ember-cli-typescript'];
+
+    return helpers
+      .emberNew({ target: 'addon' })
+      .then(() => {
+        const packagePath = path.resolve(process.cwd(), 'package.json');
+        const contents = JSON.parse(fs.readFileSync(packagePath, { encoding: 'utf8' }));
+        contents.devDependencies['ember-cli-mirage'] = '*';
+        fs.writeFileSync(packagePath, JSON.stringify(contents, null, 2));
+      })
+      .then(() => helpers.emberGenerate(args))
+      .then(() => {
+        const tsconfig = file('tsconfig.json');
+        expect(tsconfig).to.exist;
+
+        const json = JSON.parse(tsconfig.content);
+        expect(json.compilerOptions.paths).to.deep.equal({
+          'dummy/tests/*': ['tests/*'],
+          'dummy/mirage/*': ['tests/dummy/mirage/*'],
+          'dummy/*': ['tests/dummy/app/*'],
+          'my-addon': ['addon'],
+          'my-addon/*': ['addon/*'],
+          '*': ['types/*'],
+        });
+
+        expect(json.include).to.deep.equal(['addon', 'tests']);
+      });
+  });
 });