Merge pull request #1131 from stoically/update-test-sinon@4.4.0

Refactor tests and add containers feature test

.eslintignore

@@ -1 +1,2 @@
 lib/testpilot/*.js
+coverage

.gitignore

@@ -12,3 +12,7 @@ src/web-ext-artifacts/*
 
 # JetBrains IDE files
 .idea
+
+# IstanbulJS
+.nyc_output
+coverage

package.json

@@ -16,16 +16,17 @@
     "eslint-plugin-no-unsanitized": "^2.0.0",
     "eslint-plugin-promise": "^3.4.0",
     "htmllint-cli": "^0.0.5",
-    "jsdom": "^11.6.2",
     "json": "^9.0.6",
     "mocha": "^5.0.0",
     "npm-run-all": "^4.0.0",
-    "sinon": "^4.4.0",
+    "nyc": "^11.4.1",
+    "sinon": "^4.4.2",
     "sinon-chai": "^2.14.0",
     "stylelint": "^7.9.0",
     "stylelint-config-standard": "^16.0.0",
     "stylelint-order": "^0.3.0",
-    "web-ext": "^2.2.2"
+    "web-ext": "^2.2.2",
+    "webextensions-jsdom": "^0.10.1"
   },
   "homepage": "https://github.com/mozilla/multi-account-containers#readme",
   "license": "MPL-2.0",
@@ -43,7 +44,8 @@
     "lint:html": "htmllint *.html",
     "lint:js": "eslint .",
     "package": "rm -rf src/web-ext-artifacts && npm run build && mv src/web-ext-artifacts/firefox_multi-account_containers-*.zip addon.xpi",
-    "test": "npm run lint && mocha ./test/setup.js test/**/*.test.js",
+    "test": "npm run lint && npm run coverage",
-    "test-watch": "mocha ./test/setup.js test/**/*.test.js --watch"
+    "test-watch": "mocha ./test/setup.js test/**/*.test.js --watch",
+    "coverage": "nyc --reporter=html --reporter=text mocha ./test/setup.js test/**/*.test.js --timeout 60000"
   }
 }

test/.eslintrc.js

@@ -3,10 +3,16 @@ module.exports = {
       "node": true,
       "mocha": true
     },
+    "parserOptions": {
+      "ecmaFeatures": {
+        "experimentalObjectRestSpread": true
+      }
+    },
     globals: {
       "sinon": false,
       "expect": false,
       "nextTick": false,
+      "buildDom": false,
       "buildBackgroundDom": false,
       "background": false,
       "buildPopupDom": false,

test/browser.mock.js

@@ -1,137 +0,0 @@
-module.exports = () => {
-  const _storage = {};
-
-  // could maybe be replaced by https://github.com/acvetkov/sinon-chrome
-  const browserMock = {
-    _storage,
-    runtime: {
-      onMessage: {
-        addListener: sinon.stub(),
-      },
-      onMessageExternal: {
-        addListener: sinon.stub(),
-      },
-      sendMessage: sinon.stub().resolves(),
-    },
-    webRequest: {
-      onBeforeRequest: {
-        addListener: sinon.stub()
-      },
-      onCompleted: {
-        addListener: sinon.stub()
-      },
-      onErrorOccurred: {
-        addListener: sinon.stub()
-      }
-    },
-    windows: {
-      getCurrent: sinon.stub().resolves({}),
-      onFocusChanged: {
-        addListener: sinon.stub(),
-      }
-    },
-    tabs: {
-      onActivated: {
-        addListener: sinon.stub()
-      },
-      onCreated: {
-        addListener: sinon.stub()
-      },
-      onUpdated: {
-        addListener: sinon.stub()
-      },
-      sendMessage: sinon.stub(),
-      query: sinon.stub().resolves([{}]),
-      get: sinon.stub(),
-      create: sinon.stub().resolves({}),
-      remove: sinon.stub().resolves()
-    },
-    history: {
-      deleteUrl: sinon.stub()
-    },
-    storage: {
-      local: {
-        get: sinon.stub(),
-        set: sinon.stub()
-      }
-    },
-    contextualIdentities: {
-      create: sinon.stub(),
-      get: sinon.stub(),
-      query: sinon.stub().resolves([])
-    },
-    contextMenus: {
-      create: sinon.stub(),
-      remove: sinon.stub(),
-      onClicked: {
-        addListener: sinon.stub()
-      }
-    },
-    browserAction: {
-      setBadgeBackgroundColor: sinon.stub(),
-      setBadgeText: sinon.stub()
-    },
-    management: {
-      get: sinon.stub(),
-      onInstalled: {
-        addListener: sinon.stub()
-      },
-      onUninstalled: {
-        addListener: sinon.stub()
-      }
-    },
-    extension: {
-      getURL: sinon.stub().returns("moz-extension://multi-account-containers/confirm-page.html")
-    }
-  };
-
-  // inmemory local storage
-  browserMock.storage.local = {
-    get: sinon.spy(async key => {
-      if (!key) {
-        return _storage;
-      }
-      let result = {};
-      if (Array.isArray(key)) {
-        key.map(akey => {
-          if (typeof _storage[akey] !== "undefined") {
-            result[akey] = _storage[akey];
-          }
-        });
-      } else if (typeof key === "object") {
-        // TODO support nested objects
-        Object.keys(key).map(oKey => {
-          if (typeof _storage[oKey] !== "undefined") {
-            result[oKey] = _storage[oKey];
-          } else {
-            result[oKey] = key[oKey];
-          }
-        });
-      } else {
-        result = _storage[key];
-      }
-      return result;
-    }),
-    set: sinon.spy(async (key, value) => {
-      if (typeof key === "object") {
-        // TODO support nested objects
-        Object.keys(key).map(oKey => {
-          _storage[oKey] = key[oKey];
-        });
-      } else {
-        _storage[key] = value;
-      }
-    }),
-    remove: sinon.spy(async (key) => {
-      if (Array.isArray(key)) {
-        key.map(aKey => {
-          delete _storage[aKey];
-        });
-      } else {
-        delete _storage[key];
-      }
-    }),
-  };
-
-  return browserMock;
-};

test/features/assignment.test.js

@@ -1,12 +1,12 @@
 describe("Assignment Feature", () => {
-  const activeTab = {
+  const url = "http://example.com";
-    id: 1,
+
-    cookieStoreId: "firefox-container-1",
+  let activeTab;
-    url: "http://example.com",
-    index: 0
-  };
   beforeEach(async () => {
-    await helper.browser.initializeWithTab(activeTab);
+    activeTab = await helper.browser.initializeWithTab({
+      cookieStoreId: "firefox-container-1",
+      url
+    });
   });
 
   describe("click the 'Always open in' checkbox in the popup", () => {
@@ -16,23 +16,24 @@ describe("Assignment Feature", () => {
     });
 
     describe("open new Tab with the assigned URL in the default container", () => {
-      const newTab = {
+      let newTab;
-        id: 2,
-        cookieStoreId: "firefox-default",
-        url: activeTab.url,
-        index: 1,
-        active: true
-      };
       beforeEach(async () => {
         // new Tab opening activeTab.url in default container
-        await helper.browser.openNewTab(newTab);
+        newTab = await helper.browser.openNewTab({
+          cookieStoreId: "firefox-default",
+          url
+        }, {
+          options: {
+            webRequestError: true // because request is canceled due to reopening
+          }
+        });
       });
 
       it("should open the confirm page", async () => {
         // should have created a new tab with the confirm page
-        background.browser.tabs.create.should.have.been.calledWith({
+        background.browser.tabs.create.should.have.been.calledWithMatch({
-          url: "moz-extension://multi-account-containers/confirm-page.html?" +
+          url: "moz-extension://fake/confirm-page.html?" +
-               `url=${encodeURIComponent(activeTab.url)}` +
+               `url=${encodeURIComponent(url)}` +
                `&cookieStoreId=${activeTab.cookieStoreId}`,
           cookieStoreId: undefined,
           openerTabId: null,
@@ -53,16 +54,12 @@ describe("Assignment Feature", () => {
       });
 
       describe("open new Tab with the no longer assigned URL in the default container", () => {
-        const newTab = {
-          id: 3,
-          cookieStoreId: "firefox-default",
-          url: activeTab.url,
-          index: 3,
-          active: true
-        };
         beforeEach(async () => {
           // new Tab opening activeTab.url in default container
-          await helper.browser.openNewTab(newTab);
+          await helper.browser.openNewTab({
+            cookieStoreId: "firefox-default",
+            url
+          });
         });
 
         it("should not open the confirm page", async () => {

test/features/containers.test.js

@@ -0,0 +1,28 @@
+describe("Containers Management", () => {
+  beforeEach(async () => {
+    await helper.browser.initializeWithTab();
+  });
+
+  describe("creating a new container", () => {
+    beforeEach(async () => {
+      await helper.popup.clickElementById("container-add-link");
+      await helper.popup.clickElementById("edit-container-ok-link");
+    });
+
+    it("should create it in the browser as well", () => {
+      background.browser.contextualIdentities.create.should.have.been.calledOnce;
+    });
+
+    describe("removing it afterwards", () => {
+      beforeEach(async () => {
+        await helper.popup.clickElementById("edit-containers-link");
+        await helper.popup.clickLastMatchingElementByQuerySelector(".delete-container-icon");
+        await helper.popup.clickElementById("delete-container-ok-link");
+      });
+
+      it("should remove it in the browser as well", () => {
+        background.browser.contextualIdentities.remove.should.have.been.calledOnce;
+      });
+    });
+  });
+});

test/features/external-webextensions.test.js

@@ -1,12 +1,11 @@
 describe("External Webextensions", () => {
-  const activeTab = {
+  const url = "http://example.com";
-    id: 1,
+
-    cookieStoreId: "firefox-container-1",
-    url: "http://example.com",
-    index: 0
-  };
   beforeEach(async () => {
-    await helper.browser.initializeWithTab(activeTab);
+    await helper.browser.initializeWithTab({
+      cookieStoreId: "firefox-container-1",
+      url
+    });
     await helper.popup.clickElementById("container-page-assigned");
   });
 
@@ -18,25 +17,18 @@ describe("External Webextensions", () => {
 
       const message = {
         method: "getAssignment",
-        url: "http://example.com"
+        url
       };
       const sender = {
         id: "external-webextension"
       };
 
-      // currently not possible to get the return value of yielding with sinon
+      const [promise] = background.browser.runtime.onMessageExternal.addListener.yield(message, sender);
-      // so we expect that if no error is thrown and the storage was called, everything is ok
+      const answer = await promise;
-      // maybe i get around to provide a PR https://github.com/sinonjs/sinon/issues/903
+      expect(answer).to.deep.equal({
-      //
+        userContextId: "1",
-      // the alternative would be to expose the actual messageHandler and call it directly
+        neverAsk: false
-      // but personally i think that goes against the black-box-ish nature of these feature tests
+      });
-      const rejectionStub = sinon.stub();
-      process.on("unhandledRejection", rejectionStub);
-      background.browser.runtime.onMessageExternal.addListener.yield(message, sender);
-      await nextTick();
-      process.removeListener("unhandledRejection", rejectionStub);
-      rejectionStub.should.not.have.been.called;
-      background.browser.storage.local.get.should.have.been.called;
     });
   });
 
@@ -48,20 +40,16 @@ describe("External Webextensions", () => {
 
       const message = {
         method: "getAssignment",
-        url: "http://example.com"
+        url
       };
       const sender = {
         id: "external-webextension"
       };
 
-      const rejectionStub = sinon.spy();
+      const [promise] = background.browser.runtime.onMessageExternal.addListener.yield(message, sender);
-      process.on("unhandledRejection", rejectionStub);
+      return promise.catch(error => {
-      background.browser.runtime.onMessageExternal.addListener.yield(message, sender);
+        expect(error.message).to.equal("Missing contextualIdentities permission");
-      await nextTick();
+      });
-      process.removeListener("unhandledRejection", rejectionStub);
-      rejectionStub.should.have.been.calledWith(sinon.match({
-        message: "Missing contextualIdentities permission"
-      }));
     });
   });
 });

test/helper.js

@@ -1,47 +1,45 @@
 module.exports = {
   browser: {
-    async initializeWithTab(tab) {
+    async initializeWithTab(details = {
-      await buildBackgroundDom({
+      cookieStoreId: "firefox-default",
-        beforeParse(window) {
+      url: "about:newtab"
-          window.browser.tabs.get.resolves(tab);
+    }) {
-          window.browser.tabs.query.resolves([tab]);
+      let tab;
-          window.browser.contextualIdentities.get.resolves({
+      await buildDom({
-            cookieStoreId: tab.cookieStoreId
+        background: {
-          });
+          async afterBuild(background) {
-        }
+            tab = await background.browser.tabs._create(details);
-      });
+          }
-      await buildPopupDom({
+        },
-        beforeParse(window) {
+        popup: {
-          window.browser.tabs.get.resolves(tab);
+          jsdom: {
-          window.browser.tabs.query.resolves([tab]);
+            beforeParse(window) {
+              window.browser.storage.local.set({
+                "browserActionBadgesClicked": [],
+                "onboarding-stage": 5,
+                "achievements": []
+              });
+              window.browser.storage.local.set.resetHistory();
+            }
+          }
         }
       });
+
+      return tab;
     },
 
     async openNewTab(tab, options = {}) {
-      if (options.resetHistory) {
+      return background.browser.tabs._create(tab, options);
-        background.browser.tabs.create.resetHistory();
-        background.browser.tabs.remove.resetHistory();
-      }
-      background.browser.tabs.get.resolves(tab);
-      background.browser.tabs.onCreated.addListener.yield(tab);
-      const [promise] = background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: tab.id,
-        url: tab.url,
-        requestId: options.requestId
-      });
-
-      return promise;
     }
   },
 
   popup: {
     async clickElementById(id) {
-      const clickEvent = popup.document.createEvent("HTMLEvents");
+      await popup.helper.clickElementById(id);
-      clickEvent.initEvent("click");
+    },
-      popup.document.getElementById(id).dispatchEvent(clickEvent);
+
-      await nextTick();
+    async clickLastMatchingElementByQuerySelector(querySelector) {
+      await popup.helper.clickElementByQuerySelectorAll(querySelector, "last");
     }
-  },
+  }
 };

test/issues/1168.test.js

@@ -0,0 +1,32 @@
+describe("#1168", () => {
+  describe("when navigation happens too slow after opening new tab to a page that then redirects", () => {
+    let clock, tab;
+
+    beforeEach(async () => {
+      await helper.browser.initializeWithTab({
+        cookieStoreId: "firefox-container-1",
+        url: "https://bugzilla.mozilla.org"
+      });
+      await helper.popup.clickElementById("container-page-assigned");
+
+      clock = sinon.useFakeTimers();
+      tab = await helper.browser.openNewTab({});
+
+      clock.tick(2000);
+
+      await background.browser.tabs._navigate(tab.id, "https://duckduckgo.com/?q=%21bugzilla+thing&t=ffab");
+      await background.browser.tabs._redirect(tab.id, [
+        "https://bugzilla.mozilla.org"
+      ]);
+    });
+
+    it.skip("should remove the old tab", async () => {
+      expect(background.browser.tabs.create).to.have.been.calledOnce;
+      expect(background.browser.tabs.remove).to.have.been.calledWith(tab.id);
+    });
+
+    afterEach(() => {
+      clock.restore();
+    });
+  });
+});

test/issues/940.test.js

@@ -1,112 +1,80 @@
 describe("#940", () => {
   describe("when other onBeforeRequestHandlers are faster and redirect with the same requestId", () => {
     it("should not open two confirm pages", async () => {
-      // init
+      await helper.browser.initializeWithTab({
-      const activeTab = {
-        id: 1,
         cookieStoreId: "firefox-container-1",
-        url: "http://example.com",
+        url: "http://example.com"
-        index: 0
+      });
-      };
-      await helper.browser.initializeWithTab(activeTab);
-      // assign the activeTab.url
       await helper.popup.clickElementById("container-page-assigned");
 
-      // start request and don't await the requests at all
+      const responses = {};
-      // so the second request below is actually comparable to an actual redirect that also fires immediately
+      await helper.browser.openNewTab({
-      const newTab = {
+        url: "http://example.com"
-        id: 2,
+      }, {
-        cookieStoreId: "firefox-default",
+        options: {
-        url: activeTab.url,
+          webRequestRedirects: ["https://example.com"],
-        index: 1,
+          webRequestError: true
-        active: true
+        },
-      };
+        responses
-      helper.browser.openNewTab(newTab, {
-        requestId: 1
       });
 
-      // other addon sees the same request
+      const result = await responses.webRequest.onBeforeRequest[1];
-      // and redirects to the https version of activeTab.url
+      expect(result).to.deep.equal({
-      // since it's a redirect the request has the same requestId
+        cancel: true
-      background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: newTab.id,
-        url: "https://example.com",
-        requestId: 1
       });
-      await nextTick();
-
       background.browser.tabs.create.should.have.been.calledOnce;
     });
   });
 
   describe("when redirects change requestId midflight", () => {
-    let promiseResults;
+    let newTab;
+    const newTabResponses = {};
+    const redirectedRequest = async (options = {}) => {
+      global.clock = sinon.useFakeTimers();
+      newTab = await helper.browser.openNewTab({
+        url: "http://youtube.com"
+      }, {
+        options: Object.assign({
+          webRequestRedirects: [
+            "https://youtube.com",
+            "https://www.youtube.com",
+            {
+              url: "https://www.youtube.com",
+              webRequest: {
+                requestId: 2
+              }
+            }
+          ],
+          webRequestError: true
+        }, options),
+        responses: newTabResponses
+      });
+    };
+
     beforeEach(async () => {
-      // init
+      await helper.browser.initializeWithTab({
-      const activeTab = {
-        id: 1,
         cookieStoreId: "firefox-container-1",
-        url: "https://www.youtube.com",
+        url: "https://www.youtube.com"
-        index: 0
+      });
-      };
-      await helper.browser.initializeWithTab(activeTab);
-      // assign the activeTab.url
       await helper.popup.clickElementById("container-page-assigned");
-
-      // http://youtube.com
-      const newTab = {
-        id: 2,
-        cookieStoreId: "firefox-default",
-        url: "http://youtube.com",
-        index: 1,
-        active: true
-      };
-      const promise1 = helper.browser.openNewTab(newTab, {
-        requestId: 1
-      });
-
-      // https://youtube.com
-      const [promise2] = background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: newTab.id,
-        url: "https://youtube.com",
-        requestId: 1
-      });
-
-      // https://www.youtube.com
-      const [promise3] = background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: newTab.id,
-        url: "https://www.youtube.com",
-        requestId: 1
-      });
-
-      // https://www.youtube.com
-      const [promise4] = background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: newTab.id,
-        url: "https://www.youtube.com",
-        requestId: 2
-      });
-
-      promiseResults = await Promise.all([promise1, promise2, promise3, promise4]);
     });
 
     it("should not open two confirm pages", async () => {
+      await redirectedRequest();
+
       // http://youtube.com is not assigned, no cancel, no reopening
-      expect(promiseResults[0]).to.deep.equal({});
+      expect(await newTabResponses.webRequest.onBeforeRequest[0]).to.deep.equal({});
 
       // https://youtube.com is not assigned, no cancel, no reopening
-      expect(promiseResults[1]).to.deep.equal({});
+      expect(await newTabResponses.webRequest.onBeforeRequest[1]).to.deep.equal({});
 
       // https://www.youtube.com is assigned, this triggers reopening, cancel
-      expect(promiseResults[2]).to.deep.equal({
+      expect(await newTabResponses.webRequest.onBeforeRequest[2]).to.deep.equal({
         cancel: true
       });
 
       // https://www.youtube.com is assigned, this was a redirect, cancel early, no reopening
-      expect(promiseResults[3]).to.deep.equal({
+      expect(await newTabResponses.webRequest.onBeforeRequest[3]).to.deep.equal({
         cancel: true
       });
 
@@ -114,67 +82,85 @@ describe("#940", () => {
     });
 
     it("should uncancel after webRequest.onCompleted", async () => {
-      const [promise1] = background.browser.webRequest.onCompleted.addListener.yield({
+      await redirectedRequest();
-        tabId: 2
+      // remove onCompleted listeners because in the real world this request would never complete
+      // and thus might trigger unexpected behavior because the tab gets removed when reopening
+      background.browser.webRequest.onCompleted.addListener.restore();
+      background.browser.tabs.create.resetHistory();
+      // we create a tab with the same id and use the same request id to see if uncanceled
+      await helper.browser.openNewTab({
+        id: newTab.id,
+        url: "https://www.youtube.com"
+      }, {
+        options: {
+          webRequest: {
+            requestId: newTabResponses.webRequest.request.requestId
+          }
+        }
       });
-      await promise1;
 
-      const [promise2] = background.browser.webRequest.onBeforeRequest.addListener.yield({
+      background.browser.tabs.create.should.have.been.calledOnce;
-        frameId: 0,
-        tabId: 2,
-        url: "https://www.youtube.com",
-        requestId: 123
-      });
-      await promise2;
-
-      background.browser.tabs.create.should.have.been.calledTwice;
     });
 
     it("should uncancel after webRequest.onErrorOccurred", async () => {
-      const [promise1] = background.browser.webRequest.onErrorOccurred.addListener.yield({
+      await redirectedRequest();
-        tabId: 2
+      background.browser.tabs.create.resetHistory();
+      // we create a tab with the same id and use the same request id to see if uncanceled
+      await helper.browser.openNewTab({
+        id: newTab.id,
+        url: "https://www.youtube.com"
+      }, {
+        options: {
+          webRequest: {
+            requestId: newTabResponses.webRequest.request.requestId
+          },
+          webRequestError: true
+        }
       });
-      await promise1;
 
-      // request to assigned url in same tab
+      background.browser.tabs.create.should.have.been.calledOnce;
-      const [promise2] = background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: 2,
-        url: "https://www.youtube.com",
-        requestId: 123
-      });
-      await promise2;
-
-      background.browser.tabs.create.should.have.been.calledTwice;
     });
 
     it("should uncancel after 2 seconds", async () => {
-      await new Promise(resolve => setTimeout(resolve, 2000));
+      await redirectedRequest({
-      // request to assigned url in same tab
+        webRequestDontYield: ["onCompleted", "onErrorOccurred"]
-      const [promise2] = background.browser.webRequest.onBeforeRequest.addListener.yield({
-        frameId: 0,
-        tabId: 2,
-        url: "https://www.youtube.com",
-        requestId: 123
       });
-      await promise2;
+      global.clock.tick(2000);
 
-      background.browser.tabs.create.should.have.been.calledTwice;
+      background.browser.tabs.create.resetHistory();
-    }).timeout(2002);
+      // we create a tab with the same id and use the same request id to see if uncanceled
+      await helper.browser.openNewTab({
+        id: newTab.id,
+        url: "https://www.youtube.com"
+      }, {
+        options: {
+          webRequest: {
+            requestId: newTabResponses.webRequest.request.requestId
+          },
+          webRequestError: true
+        }
+      });
+
+      background.browser.tabs.create.should.have.been.calledOnce;
+    });
 
     it("should not influence the canceled url in other tabs", async () => {
-      const newTab = {
+      await redirectedRequest();
-        id: 123,
+      background.browser.tabs.create.resetHistory();
+      await helper.browser.openNewTab({
         cookieStoreId: "firefox-default",
-        url: "https://www.youtube.com",
+        url: "https://www.youtube.com"
-        index: 10,
+      }, {
-        active: true
+        options: {
-      };
+          webRequestError: true
-      await helper.browser.openNewTab(newTab, {
+        }
-        requestId: 321
       });
 
-      background.browser.tabs.create.should.have.been.calledTwice;
+      background.browser.tabs.create.should.have.been.calledOnce;
+    });
+
+    afterEach(() => {
+      global.clock.restore();
     });
   });
 });

test/setup.js

@@ -2,7 +2,6 @@ if (!process.listenerCount("unhandledRejection")) {
   // eslint-disable-next-line no-console
   process.on("unhandledRejection", r => console.log(r));
 }
-const jsdom = require("jsdom");
 const path = require("path");
 const chai = require("chai");
 const sinonChai = require("sinon-chai");
@@ -19,83 +18,43 @@ global.nextTick = () => {
 };
 
 global.helper = require("./helper");
-const browserMock = require("./browser.mock");
-const srcBasePath = path.resolve(path.join(__dirname, "..", "src"));
-const srcJsBackgroundPath = path.join(srcBasePath, "js", "background");
-global.buildBackgroundDom = async (options = {}) => {
-  const dom = await jsdom.JSDOM.fromFile(path.join(srcJsBackgroundPath, "index.html"), {
-    runScripts: "dangerously",
-    resources: "usable",
-    virtualConsole: (new jsdom.VirtualConsole).sendTo(console),
-    beforeParse(window) {
-      window.browser = browserMock();
-      window.fetch = sinon.stub().resolves({
-        json: sinon.stub().resolves({})
-      });
 
-      if (options.beforeParse) {
+const webExtensionsJSDOM = require("webextensions-jsdom");
-        options.beforeParse(window);
+const manifestPath = path.resolve(path.join(__dirname, "../src/manifest.json"));
-      }
+global.buildDom = async ({background = {}, popup = {}}) => {
-    }
+  const webExtension = await webExtensionsJSDOM.fromManifest(manifestPath, {
+    apiFake: true,
+    wiring: true,
+    sinon: global.sinon,
+    background,
+    popup
   });
-  await new Promise(resolve => {
-    dom.window.document.addEventListener("DOMContentLoaded", resolve);
-  });
-  await nextTick();
 
-  global.background = {
+  global.background = webExtension.background;
-    dom,
+  global.popup = webExtension.popup;
-    browser: dom.window.browser
-  };
 };
 
-global.buildPopupDom = async (options = {}) => {
+global.buildBackgroundDom = async background => {
-  const dom = await jsdom.JSDOM.fromFile(path.join(srcBasePath, "popup.html"), {
+  await global.buildDom({
-    runScripts: "dangerously",
+    background,
-    resources: "usable",
+    popup: false
-    virtualConsole: (new jsdom.VirtualConsole).sendTo(console),
-    beforeParse(window) {
-      window.browser = browserMock();
-      window.browser.storage.local.set("browserActionBadgesClicked", []);
-      window.browser.storage.local.set("onboarding-stage", 5);
-      window.browser.storage.local.set("achievements", []);
-      window.browser.storage.local.set.resetHistory();
-      window.fetch = sinon.stub().resolves({
-        json: sinon.stub().resolves({})
-      });
-
-      if (options.beforeParse) {
-        options.beforeParse(window);
-      }
-    }
   });
-  await new Promise(resolve => {
-    dom.window.document.addEventListener("DOMContentLoaded", resolve);
-  });
-  await nextTick();
-  dom.window.browser.runtime.sendMessage.resetHistory();
-
-  if (global.background) {
-    dom.window.browser.runtime.sendMessage = sinon.spy(function() {
-      global.background.browser.runtime.onMessage.addListener.yield(...arguments);
-    });
-  }
-
-  global.popup = {
-    dom,
-    document: dom.window.document,
-    browser: dom.window.browser
-  };
 };
 
+global.buildPopupDom = async popup => {
+  await global.buildDom({
+    popup,
+    background: false
+  });
+};
+
+
 global.afterEach(() => {
   if (global.background) {
-    global.background.dom.window.close();
+    global.background.destroy();
-    delete global.background;
   }
 
   if (global.popup) {
-    global.popup.dom.window.close();
+    global.popup.destroy();
-    delete global.popup;
   }
 });