Replaced source-map with source-map-js

Author: Brian Vaughn

packages/react-devtools-extensions/build.js

@@ -93,12 +93,6 @@ const build = async (tempPath, manifestPath) => {
     STATIC_FILES.map(file => copy(join(__dirname, file), join(zipPath, file))),
   );
 
-  // The "source-map" library requires this chunk of WASM to be bundled at runtime.
-  await copy(
-    join(__dirname, 'node_modules', 'source-map', 'lib', 'mappings.wasm'),
-    join(zipPath, 'mappings.wasm'),
-  );
-
   const commit = getGitCommit();
   const dateString = new Date().toLocaleDateString();
   const manifest = JSON.parse(readFileSync(copiedManifestPath).toString());

packages/react-devtools-extensions/chrome/manifest.json

@@ -32,8 +32,7 @@
     "main.html",
     "panel.html",
     "build/react_devtools_backend.js",
-    "build/renderer.js",
-    "mappings.wasm"
+    "build/renderer.js"
   ],
 
   "background": {

packages/react-devtools-extensions/edge/manifest.json

@@ -32,8 +32,7 @@
     "main.html",
     "panel.html",
     "build/react_devtools_backend.js",
-    "build/renderer.js",
-    "mappings.wasm"
+    "build/renderer.js"
   ],
 
   "background": {

packages/react-devtools-extensions/firefox/manifest.json

@@ -37,8 +37,7 @@
     "main.html",
     "panel.html",
     "build/react_devtools_backend.js",
-    "build/renderer.js",
-    "mappings.wasm"
+    "build/renderer.js"
   ],
 
   "background": {

packages/react-devtools-extensions/package.json

@@ -62,7 +62,7 @@
     "rollup-plugin-babel": "^4.0.1",
     "rollup-plugin-commonjs": "^9.3.4",
     "rollup-plugin-node-resolve": "^2.1.1",
-    "source-map": "^0.8.0-beta.0",
+    "source-map-js": "^0.6.2",
     "sourcemap-codec": "^1.4.8",
     "style-loader": "^0.23.1",
     "webpack": "^4.43.0",

packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js

@@ -25,23 +25,6 @@ function requireText(path, encoding) {
   }
 }
 
-const chromeGlobal = {
-  extension: {
-    getURL: jest.fn((...args) => {
-      const {join} = require('path');
-      return join(
-        __dirname,
-        '..',
-        '..',
-        'node_modules',
-        'source-map',
-        'lib',
-        'mappings.wasm',
-      );
-    }),
-  },
-};
-
 describe('parseHookNames', () => {
   let fetchMock;
   let inspectHooks;
@@ -57,9 +40,6 @@ describe('parseHookNames', () => {
     fetchMock = require('jest-fetch-mock');
     fetchMock.enableMocks();
 
-    // Mock out portion of browser API used by parseHookNames to initialize "source-map".
-    global.chrome = chromeGlobal;
-
     inspectHooks = require('react-debug-tools/src/ReactDebugHooks')
       .inspectHooks;
     parseHookNames = require('../parseHookNames/parseHookNames').parseHookNames;
@@ -734,9 +714,6 @@ describe('parseHookNames worker', () => {
       };
     });
 
-    // Mock out portion of browser API used by parseHookNames to initialize "source-map".
-    global.chrome = chromeGlobal;
-
     inspectHooks = require('react-debug-tools/src/ReactDebugHooks')
       .inspectHooks;
     parseHookNames = require('../parseHookNames').parseHookNames;

packages/react-devtools-extensions/src/parseHookNames/index.js

@@ -1,5 +1,3 @@
-/* global chrome */
-
 /**
  * Copyright (c) Facebook, Inc. and its affiliates.
  *
@@ -15,14 +13,11 @@
 import WorkerizedParseHookNames from './parseHookNames.worker';
 import typeof * as ParseHookNamesModule from './parseHookNames';
 
-// $FlowFixMe
-const wasmMappingsURL = chrome.extension.getURL('mappings.wasm');
-
 const workerizedParseHookNames: ParseHookNamesModule = WorkerizedParseHookNames();
 
 type ParseHookNames = $PropertyType<ParseHookNamesModule, 'parseHookNames'>;
 
 export const parseHookNames: ParseHookNames = hooksTree =>
-  workerizedParseHookNames.parseHookNames(hooksTree, wasmMappingsURL);
+  workerizedParseHookNames.parseHookNames(hooksTree);
 
 export const purgeCachedMetadata = workerizedParseHookNames.purgeCachedMetadata;

packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js

@@ -9,7 +9,7 @@
 
 import {parse} from '@babel/parser';
 import LRU from 'lru-cache';
-import {SourceMapConsumer} from 'source-map';
+import {SourceMapConsumer} from 'source-map-js';
 import {getHookName} from '../astUtils';
 import {areSourceMapsAppliedToErrors} from '../ErrorTester';
 import {__DEBUG__} from 'react-devtools-shared/src/constants';
@@ -110,7 +110,6 @@ const originalURLToMetadataCache: LRUCache<
 
 export async function parseHookNames(
   hooksTree: HooksTree,
-  wasmMappingsURL: string,
 ): Thenable<HookNames | null> {
   const hooksList: Array<HooksNode> = [];
   flattenHooksList(hooksTree, hooksList);
@@ -169,9 +168,7 @@ export async function parseHookNames(
   }
 
   return loadSourceFiles(locationKeyToHookSourceData)
-    .then(() =>
-      extractAndLoadSourceMaps(locationKeyToHookSourceData, wasmMappingsURL),
-    )
+    .then(() => extractAndLoadSourceMaps(locationKeyToHookSourceData))
     .then(() => parseSourceAST(locationKeyToHookSourceData))
     .then(() => updateLruCache(locationKeyToHookSourceData))
     .then(() => findHookNames(hooksList, locationKeyToHookSourceData));
@@ -193,7 +190,6 @@ function decodeBase64String(encoded: string): Object {
 
 function extractAndLoadSourceMaps(
   locationKeyToHookSourceData: Map<string, HookSourceData>,
-  wasmMappingsURL: string,
 ): Promise<*> {
   // SourceMapConsumer.initialize() does nothing when running in Node (aka Jest)
   // because the wasm file is automatically read from the file system
@@ -204,8 +200,6 @@ function extractAndLoadSourceMaps(
         'extractAndLoadSourceMaps() Initializing source-map library ...',
       );
     }
-
-    SourceMapConsumer.initialize({'lib/mappings.wasm': wasmMappingsURL});
   }
 
   // Deduplicate fetches, since there can be multiple location keys per source map.
@@ -264,11 +258,7 @@ function extractAndLoadSourceMaps(
             if (hookMap != null) {
               hookSourceData.hookMap = hookMap;
             }
-            setPromises.push(
-              new SourceMapConsumer(parsed).then(sourceConsumer => {
-                hookSourceData.sourceConsumer = sourceConsumer;
-              }),
-            );
+            hookSourceData.sourceConsumer = new SourceMapConsumer(parsed);
             break;
           }
         } else {

yarn.lock

@@ -14168,6 +14168,11 @@ source-list-map@^2.0.0:
   resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-2.0.1.tgz#3993bd873bfc48479cca9ea3a547835c7c154b34"
   integrity sha512-qnQ7gVMxGNxsiL4lEuJwe/To8UnK7fAnmbGEEH8RpLouuKbeEm0lhbQVFIrNSuB+G7tVrAlVsZgETT5nljf+Iw==
 
+source-map-js@^0.6.2:
+  version "0.6.2"
+  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-0.6.2.tgz#0bb5de631b41cfbda6cfba8bd05a80efdfd2385e"
+  integrity sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==
+
 source-map-resolve@^0.5.0:
   version "0.5.3"
   resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.3.tgz#190866bece7553e1f8f267a2ee82c606b5509a1a"
@@ -14223,13 +14228,6 @@ source-map@^0.7.3:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
   integrity sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==
 
-source-map@^0.8.0-beta.0:
-  version "0.8.0-beta.0"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.8.0-beta.0.tgz#d4c1bb42c3f7ee925f005927ba10709e0d1d1f11"
-  integrity sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA==
-  dependencies:
-    whatwg-url "^7.0.0"
-
 sourcemap-codec@^1.4.1, sourcemap-codec@^1.4.4, sourcemap-codec@^1.4.8:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"