Upgrade to jest 22

package.json

@@ -70,7 +70,7 @@
     "babel-cli": "^6.26.0",
     "babel-core": "^6.26.0",
     "babel-eslint": "^8.2.1",
-    "babel-jest": "^20.0.3",
+    "babel-jest": "^22.4.1",
     "babel-loader": "^7.1.2",
     "babel-plugin-transform-class-properties": "^6.24.1",
     "babel-plugin-transform-runtime": "^6.23.0",
@@ -97,7 +97,7 @@
     "html-webpack-plugin": "^2.30.1",
     "http-server": "^0.11.1",
     "husky": "^0.14.3",
-    "jest": "^20.0.3",
+    "jest": "^22.4.2",
     "json-loader": "^0.5.7",
     "lint-staged": "^6.1.0",
     "local-web-server": "^2.4.0",
@@ -118,7 +118,8 @@
   "jest": {
     "collectCoverageFrom": [
       "src/**/*.{js,jsx}",
-      "!**/node_modules/**"
+      "!**/node_modules/**",
+      "!src/types/libdef/**"
     ],
     "testEnvironment": "jsdom",
     "moduleFileExtensions": [
@@ -132,6 +133,7 @@
       "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/test/fixtures/mocks/file-mock.js",
       "\\.(css|less)$": "<rootDir>/src/test/fixtures/mocks/style-mock.js"
     },
+    "restoreMocks": true,
     "setupTestFrameworkScriptFile": "./src/test/setup.js",
     "verbose": true
   },

src/actions/receive-profile.js

@@ -83,6 +83,9 @@ let requestIdleCallbackPolyfill: (
 
 if (typeof window === 'object' && window.requestIdleCallback) {
   requestIdleCallbackPolyfill = window.requestIdleCallback;
+} else if (typeof process === 'object' && process.nextTick) {
+  // Node environment
+  requestIdleCallbackPolyfill = process.nextTick;
 } else {
   requestIdleCallbackPolyfill = callback => setTimeout(callback, 0);
 }

src/profile-logic/errors.js

@@ -0,0 +1,23 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// @flow
+
+import type { Library } from './symbol-store';
+
+// Used during the symbolication process to express that we couldn't find
+// symbols for a specific library
+export class SymbolsNotFoundError extends Error {
+  library: Library;
+  error: ?Error;
+
+  constructor(message: string, library: Library, error?: Error) {
+    super(message);
+    // Workaround for a babel issue when extending Errors
+    (this: any).__proto__ = SymbolsNotFoundError.prototype;
+    this.name = 'SymbolsNotFoundError';
+    this.library = library;
+    this.error = error;
+  }
+}

src/profile-logic/symbol-store-db-worker.js

@@ -2,7 +2,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-import { SymbolStoreDB } from './symbol-store-db';
+import SymbolStoreDB from './symbol-store-db';
 import { provideWorkerSide } from '../utils/promise-worker';
 
 provideWorkerSide(self, SymbolStoreDB);

src/profile-logic/symbol-store-db.js

@@ -4,6 +4,8 @@
 
 // @flow
 
+import { SymbolsNotFoundError } from './errors';
+
 import type {
   IDBFactory,
   IDBDatabase,
@@ -38,7 +40,7 @@ const kTwoWeeksInMilliseconds = 2 * 7 * 24 * 60 * 60 * 1000;
  * @class SymbolStoreDB
  * @classdesc Where does this description show up?
  */
-export class SymbolStoreDB {
+export default class SymbolStoreDB {
   _dbPromise: Promise<IDBDatabase> | null;
   _maxCount: number;
   _maxAge: number; // in milliseconds
@@ -196,7 +198,10 @@ export class SymbolStoreDB {
             updateDateReq.onsuccess = () => resolve([addrs, index, buffer]);
           } else {
             reject(
-              new Error('The requested library does not exist in the database.')
+              new SymbolsNotFoundError(
+                'The requested library does not exist in the database.',
+                { debugName, breakpadId }
+              )
             );
           }
         };

src/profile-logic/symbol-store.js

@@ -3,10 +3,11 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 // @flow
-import { SymbolStoreDB } from './symbol-store-db';
+import SymbolStoreDB from './symbol-store-db';
+import { SymbolsNotFoundError } from './errors';
 import type { SymbolTableAsTuple } from './symbol-store-db';
 
-type Library = {
+export type Library = {
   debugName: string,
   breakpadId: string,
 };
@@ -57,8 +58,9 @@ export class SymbolStore {
 
     if (this._failedRequests.has(libid)) {
       return Promise.reject(
-        new Error(
-          "We've tried to request a symbol table for this library before and failed, so we're not trying again."
+        new SymbolsNotFoundError(
+          "We've tried to request a symbol table for this library before and failed, so we're not trying again.",
+          lib
         )
       );
     }
@@ -74,15 +76,24 @@ export class SymbolStore {
     // Try to get the symbol table from the database
     const symbolTablePromise = this._db
       .getSymbolTable(debugName, breakpadId)
-      .catch(() => {
+      .catch(e => {
+        if (!(e instanceof SymbolsNotFoundError)) {
+          // rethrow JavaScript programming errors
+          throw e;
+        }
+
         // Request the symbol table from the symbol provider.
         const symbolTablePromise = this._symbolProvider
           .requestSymbolTable(debugName, breakpadId)
           .catch(error => {
             console.error(`Failed to symbolicate library ${debugName}`, error);
             this._failedRequests.add(libid);
             this._requestedSymbolTables.delete(libid);
-            throw error;
+            throw new SymbolsNotFoundError(
+              `Failed to symbolicate library ${debugName}`,
+              lib,
+              error
+            );
           });
 
         // Once the symbol table comes in, store it in the database, but don't

src/profile-logic/symbolication.js

@@ -5,6 +5,7 @@
 
 import bisection from 'bisection';
 import { resourceTypes } from './profile-data';
+import { SymbolsNotFoundError } from './errors';
 
 import type {
   Profile,
@@ -270,7 +271,11 @@ async function symbolicateThread(
               );
             });
         })
-        .catch(() => {
+        .catch(e => {
+          if (!(e instanceof SymbolsNotFoundError)) {
+            // rethrow JavaScript programming error
+            throw e;
+          }
           // We could not find symbols for this library.
           // Don't throw, so that the resulting promise will be resolved, thereby
           // indicating that we're done symbolicating with lib.

src/test/components/__snapshots__/FlameGraph.test.js.snap

@@ -69,7 +69,7 @@ exports[`renders FlameGraph correctly 1`] = `
     <div
       className="flameGraphLabels grippy"
       title="thread: \\"Empty\\" (0)
-    process: \\"default\\" (0)"
+process: \\"default\\" (0)"
     >
       <span>
         Empty

src/test/components/__snapshots__/MarkerChart.test.js.snap

@@ -7,7 +7,7 @@ exports[`renders MarkerChart correctly 1`] = `
   <div
     className="markerChartLabels grippy"
     title="thread: \\"Empty\\" (0)
-  process: \\"default\\" (0)"
+process: \\"default\\" (0)"
   >
     <span
       className="markerChartLabelsName"
@@ -337,7 +337,18 @@ Array [
   Array [
     "set fillStyle",
     Object {
-      "addColorStop": [Function],
+      "addColorStop": [MockFunction] {
+        "calls": Array [
+          Array [
+            0,
+            "rgba(255, 255, 255, 0.8)",
+          ],
+          Array [
+            1,
+            "rgba(255, 255, 255, 0.0)",
+          ],
+        ],
+      },
     },
   ],
   Array [

src/test/components/__snapshots__/ProfileSharing.test.js.snap

@@ -43,7 +43,7 @@ exports[`app/ProfileSharing renders the ProfileSharing buttons 1`] = `
             >
               <p>
                 You’re about to upload your profile publicly where anyone will be able to access it.
-                      To better diagnose performance problems profiles include the following information:
+      To better diagnose performance problems profiles include the following information:
               </p>
               <ul>
                 <li>
@@ -58,7 +58,7 @@ exports[`app/ProfileSharing renders the ProfileSharing buttons 1`] = `
               </ul>
               <p>
                 To view all the information you can download the full profile to a file and open the
-                      json structure with a text editor.
+      json structure with a text editor.
               </p>
             </section>
           </div>
@@ -272,7 +272,7 @@ exports[`app/ProfileSharing renders the ProfileSharing buttons 2`] = `
             >
               <p>
                 You’re about to upload your profile publicly where anyone will be able to access it.
-                      To better diagnose performance problems profiles include the following information:
+      To better diagnose performance problems profiles include the following information:
               </p>
               <ul>
                 <li>
@@ -287,7 +287,7 @@ exports[`app/ProfileSharing renders the ProfileSharing buttons 2`] = `
               </ul>
               <p>
                 To view all the information you can download the full profile to a file and open the
-                      json structure with a text editor.
+      json structure with a text editor.
               </p>
             </section>
           </div>

src/test/components/__snapshots__/ProfileViewerHeader.test.js.snap

@@ -124,7 +124,7 @@ exports[`calltree/ProfileViewerHeader renders the header 1`] = `
               onTouchEnd={[Function]}
               onTouchStart={[Function]}
               title="thread: \\"Main Thread\\" (0)
-            process: \\"default\\" (0)"
+process: \\"default\\" (0)"
             >
               <h1
                 className="profileThreadHeaderBarThreadName"
@@ -173,7 +173,7 @@ exports[`calltree/ProfileViewerHeader renders the header 1`] = `
               onTouchEnd={[Function]}
               onTouchStart={[Function]}
               title="thread: \\"Thread with dropped samples\\" (0)
-            process: \\"default\\" (0)"
+process: \\"default\\" (0)"
             >
               <h1
                 className="profileThreadHeaderBarThreadName"
@@ -256,7 +256,7 @@ exports[`calltree/ProfileViewerHeader renders the header 1`] = `
               onTouchEnd={[Function]}
               onTouchStart={[Function]}
               title="thread: \\"Thread with dropped samples\\" (0)
-            process: \\"default\\" (0)"
+process: \\"default\\" (0)"
             >
               <h1
                 className="profileThreadHeaderBarThreadName"

src/test/components/__snapshots__/StackChart.test.js.snap

@@ -84,7 +84,7 @@ exports[`renders StackChartGraph correctly 1`] = `
     <div
       className="stackChartLabels grippy"
       title="thread: \\"Empty\\" (0)
-    process: \\"default\\" (0)"
+process: \\"default\\" (0)"
     >
       <span>
         Empty

src/test/store/receive-profile.test.js

@@ -4,6 +4,7 @@
 // @flow
 
 import sinon from 'sinon';
+
 import { blankStore } from '../fixtures/stores';
 import * as ProfileViewSelectors from '../../reducers/profile-view';
 import * as UrlStateSelectors from '../../reducers/url-state';
@@ -18,6 +19,13 @@ import {
 import preprocessedProfile from '../fixtures/profiles/profile-2d-canvas.json';
 import getGeckoProfile from '../fixtures/profiles/gecko-profile';
 
+// Mocking SymbolStoreDB
+import exampleSymbolTable from '../fixtures/example-symbol-table';
+import SymbolStoreDB from '../../profile-logic/symbol-store-db';
+jest.mock('../../profile-logic/symbol-store-db');
+
+import { TextDecoder } from 'text-encoding';
+
 describe('actions/receive-profile', function() {
   /**
    * This function allows to observe all state changes in a Redux store while
@@ -66,13 +74,23 @@ describe('actions/receive-profile', function() {
         getSymbolTable: () => Promise.resolve(),
       };
       window.geckoProfilerPromise = Promise.resolve(geckoProfiler);
+
+      // This is a mock implementation because of the `mock` call above, but
+      // Flow doesn't know this.
+      (SymbolStoreDB: any).mockImplementation(() => ({
+        getSymbolTable: jest.fn().mockResolvedValue(exampleSymbolTable),
+      }));
+
+      window.TextDecoder = TextDecoder;
     });
 
     afterEach(function() {
       clock.restore();
 
       geckoProfiler = null;
       delete window.geckoProfilerPromise;
+      delete window.TextDecoder;
+      delete window.requestIdleCallback;
     });
 
     it('can retrieve a profile from the addon', async function() {

src/test/unit/symbol-store-db.test.js

@@ -3,7 +3,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 import 'babel-polyfill';
-import { SymbolStoreDB } from '../../profile-logic/symbol-store-db';
+import SymbolStoreDB from '../../profile-logic/symbol-store-db';
 import exampleSymbolTable from '../fixtures/example-symbol-table';
 import fakeIndexedDB from 'fake-indexeddb';
 import FDBKeyRange from 'fake-indexeddb/lib/FDBKeyRange';