Clear mirage deprecations (#664)

In v3.x functions from miragejs will no longer be exported by mirage and
must be pulled directly from miragejs.

The configuration system has been modified to match the upstream
expectations and by more explicit as well.

Using embroider macros we can detect if ember-cli-mirage and miragejs
are present and only include this code when that is true. For our own
local tests we then add mirage as a dev dependency and require it as an
optional peer dependency so embroider will know how it should work.

* Move ember-auto-import to dependencies

This is required for the importSync embroiderr macro to work.

addon/mirage/index.js

@@ -1,6 +1,11 @@
 import RSVP from 'rsvp';
-import Response from 'ember-cli-mirage/response';
+
 import { extractFormData, extractFileMetadata } from './utils';
+import {
+  macroCondition,
+  dependencySatisfies,
+  importSync,
+} from '@embroider/macros';
 
 const NETWORK = {
   wired: 50000, // 500 Mb/s
@@ -14,61 +19,73 @@ const NETWORK = {
 };
 
 export function upload(fn, options = { network: null, timeout: null }) {
-  return function (db, request) {
-    let speed = Infinity;
+  if (
+    macroCondition(
+      dependencySatisfies('miragejs', '*') &&
+        dependencySatisfies('ember-cli-mirage', '*')
+    )
+  ) {
+    const { Response } = importSync('miragejs');
+    return function (db, request) {
+      let speed = Infinity;
 
-    if (NETWORK[options.network]) {
-      speed = NETWORK[options.network] * 1024;
-    }
+      if (NETWORK[options.network]) {
+        speed = NETWORK[options.network] * 1024;
+      }
 
-    let { file, data } = extractFormData(request.requestBody);
-    let loaded = 0;
-    let total = file.value.size;
+      let { file, data } = extractFormData(request.requestBody);
+      let loaded = 0;
+      let total = file.value.size;
 
-    return new RSVP.Promise((resolve) => {
-      let start = new Date().getTime();
-      let metadata = extractFileMetadata(file.value);
+      return new RSVP.Promise((resolve) => {
+        let start = new Date().getTime();
+        let metadata = extractFileMetadata(file.value);
 
-      let upload = () => {
-        let timedOut =
-          options.timeout && new Date().getTime() - start > options.timeout;
-        if (timedOut || loaded >= total) {
-          request.upload.onprogress({
-            lengthComputable: true,
-            total,
-            loaded: Math.min(loaded, total),
-          });
+        let upload = () => {
+          let timedOut =
+            options.timeout && new Date().getTime() - start > options.timeout;
+          if (timedOut || loaded >= total) {
+            request.upload.onprogress({
+              lengthComputable: true,
+              total,
+              loaded: Math.min(loaded, total),
+            });
 
-          metadata
-            .then((metadata) => {
-              request.requestBody = Object.assign(
-                {
-                  [file.key]: metadata,
-                },
-                data
-              );
-              if (timedOut) {
-                resolve(new Response(408));
-                return;
-              }
+            metadata
+              .then((metadata) => {
+                request.requestBody = Object.assign(
+                  {
+                    [file.key]: metadata,
+                  },
+                  data
+                );
+                if (timedOut) {
+                  resolve(new Response(408));
+                  return;
+                }
 
-              resolve(fn.call(this, db, request));
-            })
-            .catch((error) => {
-              resolve(new Response(500, {}, { error: error.message }));
+                resolve(fn.call(this, db, request));
+              })
+              .catch((error) => {
+                resolve(new Response(500, {}, { error: error.message }));
+              });
+          } else {
+            request.upload.onprogress({
+              lengthComputable: true,
+              total,
+              loaded,
             });
-        } else {
-          request.upload.onprogress({
-            lengthComputable: true,
-            total,
-            loaded,
-          });
 
-          loaded += speed / 20;
-          setTimeout(upload, 50);
-        }
-      };
-      upload();
-    });
-  };
+            loaded += speed / 20;
+            setTimeout(upload, 50);
+          }
+        };
+        upload();
+      });
+    };
+  } else {
+    throw new Error(
+      'You must add ember-cli-mirage and miragejs to your app to use this helper.'
+    );
+  }
 }

package.json

@@ -51,9 +51,11 @@
   },
   "dependencies": {
     "@ember/test-waiters": "^3.0.0",
+    "@embroider/macros": "^1.0.0",
     "@glimmer/component": "^1.0.4",
     "@glimmer/tracking": "^1.0.4",
     "broccoli-funnel": "^3.0.8",
+    "ember-auto-import": "^2.0.0",
     "ember-cli-babel": "^7.26.6",
     "ember-cli-htmlbars": "^5.7.1",
     "ember-cli-typescript": "^4.2.1",
@@ -91,7 +93,6 @@
     "@typescript-eslint/parser": "^5.6.0",
     "babel-eslint": "^10.1.0",
     "broccoli-asset-rev": "^3.0.0",
-    "ember-auto-import": "^2.0.0",
     "ember-cli": "3.28.0",
     "ember-cli-content-security-policy": "^2.0.0-3",
     "ember-cli-dependency-checker": "^3.2.0",
@@ -117,6 +118,7 @@
     "eslint-plugin-qunit": "^7.0.0",
     "fake-xml-http-request": "^2.1.2",
     "loader.js": "^4.7.0",
+    "miragejs": "^0.1.43",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.3.2",
     "qunit": "^2.16.0",
@@ -127,8 +129,19 @@
     "typescript": "^4.5.3",
     "webpack": "5"
   },
+  "peerDependencies": {
+    "ember-cli-mirage": "*",
+    "miragejs": "*"
+  },
+  "peerDependenciesMeta": {
+    "ember-cli-mirage": {
+      "optional": true
+    },
+    "miragejs": {
+      "optional": true
+    }
+  },
   "resolutions": {
-    "ember-auto-import": "^2.0.0",
     "ember-cli-babel": "^7.26.6"
   },
   "engines": {

tests/dummy/mirage/config.js

@@ -1,19 +1,29 @@
 import { upload } from 'ember-file-upload/mirage';
+import { discoverEmberDataModels } from 'ember-cli-mirage';
+import { createServer } from 'miragejs';
 
-export default function () {
-  this.post(
-    '/photos/new',
-    upload(function (db, request) {
-      let { type, name, size, url } = request.requestBody.file;
-      return db.create('photo', {
-        filename: name,
-        filesize: size,
-        uploadedAt: new Date(),
-        url,
-        type: type.split('/')[0],
-      });
-    })
-  );
+export default function (config) {
+  let finalConfig = {
+    ...config,
+    models: { ...discoverEmberDataModels(), ...config.models },
+    routes() {
+      this.post(
+        '/photos/new',
+        upload(function (db, request) {
+          let { type, name, size, url } = request.requestBody.file;
+          return db.create('photo', {
+            filename: name,
+            filesize: size,
+            uploadedAt: new Date(),
+            url,
+            type: type.split('/')[0],
+          });
+        })
+      );
 
-  this.passthrough('*');
+      this.passthrough('*');
+    },
+  };
+
+  return createServer(finalConfig);
 }

tests/dummy/mirage/models/photo.js

@@ -1,3 +1,3 @@
-import { Model } from 'ember-cli-mirage';
+import { Model } from 'miragejs';
 
 export default class Photo extends Model {}

tests/dummy/mirage/serializers/application.js

@@ -1,3 +1,3 @@
-import { JSONAPISerializer } from 'ember-cli-mirage';
+import { JSONAPISerializer } from 'miragejs';
 
 export default class ApplicationSerializer extends JSONAPISerializer {}