diff --git a/Libraries/Core/Devtools/getDevServer.js b/Libraries/Core/Devtools/getDevServer.js index 5f8dfe1fcc26dc..c60d0e51606035 100644 --- a/Libraries/Core/Devtools/getDevServer.js +++ b/Libraries/Core/Devtools/getDevServer.js @@ -13,10 +13,12 @@ import NativeSourceCode from '../../NativeModules/specs/NativeSourceCode'; let _cachedDevServerURL: ?string; +let _cachedFullBundleURL: ?string; const FALLBACK = 'http://localhost:8081/'; type DevServerInfo = { url: string, + fullBundleUrl: ?string, bundleLoadedFromServer: boolean, ... }; @@ -27,14 +29,15 @@ type DevServerInfo = { */ function getDevServer(): DevServerInfo { if (_cachedDevServerURL === undefined) { - const match = NativeSourceCode.getConstants().scriptURL.match( - /^https?:\/\/.*?\//, - ); + const scriptUrl = NativeSourceCode.getConstants().scriptURL; + const match = scriptUrl.match(/^https?:\/\/.*?\//); _cachedDevServerURL = match ? match[0] : null; + _cachedFullBundleURL = match ? scriptUrl : null; } return { url: _cachedDevServerURL || FALLBACK, + fullBundleUrl: _cachedFullBundleURL, bundleLoadedFromServer: _cachedDevServerURL !== null, }; } diff --git a/Libraries/Utilities/HMRClient.js b/Libraries/Utilities/HMRClient.js index 48fd40fdab9c2b..a744927e1395b1 100644 --- a/Libraries/Utilities/HMRClient.js +++ b/Libraries/Utilities/HMRClient.js @@ -16,6 +16,7 @@ const MetroHMRClient = require('metro/src/lib/bundle-modules/HMRClient'); const Platform = require('./Platform'); const prettyFormat = require('pretty-format'); +import getDevServer from '../Core/Devtools/getDevServer'; import NativeRedBox from '../NativeModules/specs/NativeRedBox'; import * as LogBoxData from '../LogBox/Data/LogBoxData'; import type {ExtendedError} from '../Core/Devtools/parseErrorStack'; @@ -159,8 +160,15 @@ const HMRClient: HMRClientNativeInterface = { const client = new MetroHMRClient(`ws://${wsHost}/hot`); hmrClient = client; + const {fullBundleUrl} = getDevServer(); pendingEntryPoints.push( - `ws://${wsHost}/hot?bundleEntry=${bundleEntry}&platform=${platform}`, + // HMRServer understands regular bundle URLs, so prefer that in case + // there are any important URL parameters we can't reconstruct from + // `setup()`'s arguments. + fullBundleUrl ?? + // The ws://.../hot?bundleEntry= format is an alternative to specifying + // a regular HTTP bundle URL. + `ws://${wsHost}/hot?bundleEntry=${bundleEntry}&platform=${platform}`, ); client.on('connection-error', e => { diff --git a/package.json b/package.json index 838e7e718f79df..d8f974bf508678 100644 --- a/package.json +++ b/package.json @@ -105,6 +105,7 @@ "pretty-format": "^26.0.1", "promise": "^8.0.3", "prop-types": "^15.7.2", + "qs": "^6.5.1", "react-devtools-core": "^4.6.0", "react-refresh": "^0.4.0", "regenerator-runtime": "^0.13.2", diff --git a/yarn.lock b/yarn.lock index 4892523373aa63..71b7e450a239a2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6231,6 +6231,11 @@ punycode@^2.1.0, punycode@^2.1.1: resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec" integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== +qs@^6.5.1: + version "6.9.4" + resolved "https://registry.yarnpkg.com/qs/-/qs-6.9.4.tgz#9090b290d1f91728d3c22e54843ca44aea5ab687" + integrity sha512-A1kFqHekCTM7cz0udomYUoYNWjBebHm/5wzU/XqrBRBNWectVH0QIiN+NEcZ0Dte5hvzHwbr8+XQmguPhJ6WdQ== + qs@~6.5.2: version "6.5.2" resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"