From a93f5a5021652c504957308d27e6c723e3a6d231 Mon Sep 17 00:00:00 2001 From: Brian Vaughn Date: Thu, 19 Aug 2021 11:25:38 -0400 Subject: [PATCH] Replace "source-map" library with "source-map-js" (#22126) --- packages/react-devtools-extensions/build.js | 6 ----- .../chrome/manifest.json | 3 +-- .../edge/manifest.json | 3 +-- .../firefox/manifest.json | 3 +-- .../react-devtools-extensions/package.json | 2 +- .../src/SourceMapMetadataConsumer.js | 21 +++++++++++++---- .../src/__tests__/parseHookNames-test.js | 23 ------------------- .../src/parseHookNames/index.js | 7 +----- .../src/parseHookNames/parseHookNames.js | 22 +++++------------- yarn.lock | 12 ++++------ 10 files changed, 32 insertions(+), 70 deletions(-) diff --git a/packages/react-devtools-extensions/build.js b/packages/react-devtools-extensions/build.js index afd4b6fd23b07..76b7aee68cb36 100644 --- a/packages/react-devtools-extensions/build.js +++ b/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()); diff --git a/packages/react-devtools-extensions/chrome/manifest.json b/packages/react-devtools-extensions/chrome/manifest.json index 94fb4a5b221c8..36119681dc3e8 100644 --- a/packages/react-devtools-extensions/chrome/manifest.json +++ b/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": { diff --git a/packages/react-devtools-extensions/edge/manifest.json b/packages/react-devtools-extensions/edge/manifest.json index e3291f353cae5..65ab76b74d16a 100644 --- a/packages/react-devtools-extensions/edge/manifest.json +++ b/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": { diff --git a/packages/react-devtools-extensions/firefox/manifest.json b/packages/react-devtools-extensions/firefox/manifest.json index e5c5deaaabca3..dbabb5978cbdd 100644 --- a/packages/react-devtools-extensions/firefox/manifest.json +++ b/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": { diff --git a/packages/react-devtools-extensions/package.json b/packages/react-devtools-extensions/package.json index 35334517cf7d4..99c1eaf0868e3 100644 --- a/packages/react-devtools-extensions/package.json +++ b/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", diff --git a/packages/react-devtools-extensions/src/SourceMapMetadataConsumer.js b/packages/react-devtools-extensions/src/SourceMapMetadataConsumer.js index d2176201c408c..250192c7fa4b3 100644 --- a/packages/react-devtools-extensions/src/SourceMapMetadataConsumer.js +++ b/packages/react-devtools-extensions/src/SourceMapMetadataConsumer.js @@ -15,7 +15,7 @@ import type { MixedSourceMap, } from './SourceMapTypes'; import type {HookMap} from './generateHookMap'; -import * as util from 'source-map/lib/util'; +import * as util from 'source-map-js/lib/util'; import {decodeHookMap} from './generateHookMap'; import {getHookNameForLocation} from './getHookNameForLocation'; @@ -27,10 +27,9 @@ const REACT_SOURCES_EXTENSION_KEY = 'x_react_sources'; const FB_SOURCES_EXTENSION_KEY = 'x_facebook_sources'; /** - * Extracted from the logic in source-map@0.8.0-beta.0's SourceMapConsumer. - * By default, source names are normalized using the same logic that the - * `source-map@0.8.0-beta.0` package uses internally. This is crucial for keeping the - * sources list in sync with a `SourceMapConsumer` instance. + * Extracted from the logic in source-map-js@0.6.2's SourceMapConsumer. + * By default, source names are normalized using the same logic that the `source-map-js@0.6.2` package uses internally. + * This is crucial for keeping the sources list in sync with a `SourceMapConsumer` instance. */ function normalizeSourcePath( sourceInput: string, @@ -41,6 +40,18 @@ function normalizeSourcePath( // eslint-disable-next-line react-internal/no-primitive-constructors source = String(source); + // Some source maps produce relative source paths like "./foo.js" instead of + // "foo.js". Normalize these first so that future comparisons will succeed. + // See bugzil.la/1090768. + source = util.normalize(source); + // Always ensure that absolute sources are internally stored relative to + // the source root, if the source root is absolute. Not doing this would + // be particularly problematic when the source root is a prefix of the + // source (valid, but why??). See github issue #199 and bugzil.la/1188982. + source = + sourceRoot != null && util.isAbsolute(sourceRoot) && util.isAbsolute(source) + ? util.relative(sourceRoot, source) + : source; return util.computeSourceURL(sourceRoot, source); } diff --git a/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js b/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js index bba4a78b10470..a5fe6fb258029 100644 --- a/packages/react-devtools-extensions/src/__tests__/parseHookNames-test.js +++ b/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; @@ -908,9 +888,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; diff --git a/packages/react-devtools-extensions/src/parseHookNames/index.js b/packages/react-devtools-extensions/src/parseHookNames/index.js index 79b2cf1aae548..643655ae757e0 100644 --- a/packages/react-devtools-extensions/src/parseHookNames/index.js +++ b/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; export const parseHookNames: ParseHookNames = hooksTree => - workerizedParseHookNames.parseHookNames(hooksTree, wasmMappingsURL); + workerizedParseHookNames.parseHookNames(hooksTree); export const purgeCachedMetadata = workerizedParseHookNames.purgeCachedMetadata; diff --git a/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js b/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js index 9f1faa8aafd24..23364ba68e917 100644 --- a/packages/react-devtools-extensions/src/parseHookNames/parseHookNames.js +++ b/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'; @@ -107,7 +107,6 @@ const originalURLToMetadataCache: LRUCache< export async function parseHookNames( hooksTree: HooksTree, - wasmMappingsURL: string, ): Thenable { const hooksList: Array = []; flattenHooksList(hooksTree, hooksList); @@ -167,9 +166,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)); @@ -191,7 +188,6 @@ function decodeBase64String(encoded: string): Object { function extractAndLoadSourceMaps( locationKeyToHookSourceData: Map, - wasmMappingsURL: string, ): Promise<*> { // SourceMapConsumer.initialize() does nothing when running in Node (aka Jest) // because the wasm file is automatically read from the file system @@ -202,8 +198,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. @@ -259,11 +253,7 @@ function extractAndLoadSourceMaps( hookSourceData.metadataConsumer = new SourceMapMetadataConsumer( parsed, ); - setPromises.push( - new SourceMapConsumer(parsed).then(sourceConsumer => { - hookSourceData.sourceConsumer = sourceConsumer; - }), - ); + hookSourceData.sourceConsumer = new SourceMapConsumer(parsed); break; } } else { @@ -299,10 +289,10 @@ function extractAndLoadSourceMaps( fetchFile(url).then( sourceMapContents => { const parsed = JSON.parse(sourceMapContents); - return new SourceMapConsumer(parsed).then(sourceConsumer => ({ - sourceConsumer, + return { + sourceConsumer: new SourceMapConsumer(parsed), metadataConsumer: new SourceMapMetadataConsumer(parsed), - })); + }; }, // In this case, we fall back to the assumption that the source has no source map. // This might indicate an (unlikely) edge case that had no source map, diff --git a/yarn.lock b/yarn.lock index 02d3f3bc01831..1e67ccb08ddea 100644 --- a/yarn.lock +++ b/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"