From 454805c502a9b81c1031778d32441e0d59036a75 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Wed, 10 May 2017 15:49:23 +0100 Subject: [PATCH 1/3] Support relative paths for JSX source --- packages/react-devtools-core/package.json | 1 + packages/react-devtools-core/src/launchEditor.js | 15 +++++++++++++-- packages/react-devtools-core/src/standalone.js | 7 ++++++- packages/react-devtools/app.html | 1 + packages/react-devtools/app.js | 7 +++++++ packages/react-devtools/bin.js | 3 ++- 6 files changed, 30 insertions(+), 4 deletions(-) diff --git a/packages/react-devtools-core/package.json b/packages/react-devtools-core/package.json index 1e98c1e6df..a5ac1b67e8 100644 --- a/packages/react-devtools-core/package.json +++ b/packages/react-devtools-core/package.json @@ -24,6 +24,7 @@ "author": "Jared Forsyth", "license": "BSD-3-Clause", "dependencies": { + "absolute-path": "0.0.0", "shell-quote": "^1.6.1", "ws": "^2.0.3" }, diff --git a/packages/react-devtools-core/src/launchEditor.js b/packages/react-devtools-core/src/launchEditor.js index 7277c83bcc..b88238c98c 100644 --- a/packages/react-devtools-core/src/launchEditor.js +++ b/packages/react-devtools-core/src/launchEditor.js @@ -11,6 +11,7 @@ var fs = require('fs'); var path = require('path'); +var isAbsolutePath = require('absolute-path'); var child_process = require('child_process'); var shellQuote = require('shell-quote'); @@ -105,8 +106,18 @@ function guessEditor() { } var _childProcess = null; -function launchEditor(filePath, lineNumber) { - if (!fs.existsSync(filePath)) { +function launchEditor(maybeRelativePath, lineNumber, absoluteProjectRoots) { + // We use relative paths at Facebook we deterministic builds. + // This is why our internal tooling calls React DevTools with absoluteProjectRoots. + // If the filename is absolute then we don't need to care about this. + var filePath = [maybeRelativePath] + .concat( + absoluteProjectRoots.map(root => path.join(root, maybeRelativePath)) + ).find(combinedPath => + fs.existsSync(combinedPath) + ); + + if (!filePath) { return; } diff --git a/packages/react-devtools-core/src/standalone.js b/packages/react-devtools-core/src/standalone.js index a0e6790543..529759dcec 100644 --- a/packages/react-devtools-core/src/standalone.js +++ b/packages/react-devtools-core/src/standalone.js @@ -22,6 +22,7 @@ var ReactDOM = require('react-dom'); var node = null; var onStatusChange = function noop() {}; +var projectRoots = []; var wall = null; var config = { @@ -31,7 +32,7 @@ var config = { done(wall); }, showElementSource(source) { - launchEditor(source.fileName, source.lineNumber); + launchEditor(source.fileName, source.lineNumber, projectRoots); }, }; @@ -170,6 +171,10 @@ var DevtoolsUI = { return DevtoolsUI; }, + setProjectRoots(_projectRoots) { + projectRoots = _projectRoots; + }, + setStatusListener(_listener) { onStatusChange = _listener; return DevtoolsUI; diff --git a/packages/react-devtools/app.html b/packages/react-devtools/app.html index 0b0d06b516..74a5979257 100644 --- a/packages/react-devtools/app.html +++ b/packages/react-devtools/app.html @@ -101,6 +101,7 @@

React DOM

'\n\nDid you run `npm run build` and `npm install` in packages/react-devtools-core?' ); } + window.devtools = devtools; window.server = devtools .setContentDOMNode(document.getElementById('container')) .setStatusListener(function(status) { diff --git a/packages/react-devtools/app.js b/packages/react-devtools/app.js index 97e2d03580..bd7c80d570 100644 --- a/packages/react-devtools/app.js +++ b/packages/react-devtools/app.js @@ -15,6 +15,7 @@ var updateNotifier = require('update-notifier'); var pkg = require('./package.json'); var mainWindow = null; +var argv = process.argv.slice(2); app.on('window-all-closed', function() { app.quit(); @@ -29,6 +30,12 @@ app.on('ready', function() { // and load the index.html of the app. mainWindow.loadURL('file://' + __dirname + '/app.html'); // eslint-disable-line no-path-concat + mainWindow.webContents.executeJavaScript( + // We use this so that RN can keep relative JSX __source filenames + // but "click to open in editor" still works. js1 passes project roots + // as the argument to DevTools. + 'window.devtools.setProjectRoots(' + JSON.stringify(argv) + ')' + ); // Emitted when the window is closed. mainWindow.on('closed', function() { diff --git a/packages/react-devtools/bin.js b/packages/react-devtools/bin.js index ea4b3470cc..170b6ff315 100755 --- a/packages/react-devtools/bin.js +++ b/packages/react-devtools/bin.js @@ -1,10 +1,11 @@ #!/usr/bin/env node var electron = require('electron'); var spawn = require('cross-spawn'); +var argv = process.argv.slice(2); var result = spawn.sync( electron, - [require.resolve('./app')], + [require.resolve('./app')].concat(argv), {stdio: 'inherit'} ); process.exit(result.status); From f12f581b1232cfb482bd037017bf5689c1f4d1cb Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Wed, 10 May 2017 15:56:41 +0100 Subject: [PATCH 2/3] Update launchEditor.js --- packages/react-devtools-core/src/launchEditor.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-devtools-core/src/launchEditor.js b/packages/react-devtools-core/src/launchEditor.js index b88238c98c..78d48e89a6 100644 --- a/packages/react-devtools-core/src/launchEditor.js +++ b/packages/react-devtools-core/src/launchEditor.js @@ -11,7 +11,6 @@ var fs = require('fs'); var path = require('path'); -var isAbsolutePath = require('absolute-path'); var child_process = require('child_process'); var shellQuote = require('shell-quote'); From 3e8f89f6289e1abcebfa59ae4dbdc4b8fc55720a Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Wed, 10 May 2017 15:56:52 +0100 Subject: [PATCH 3/3] Update package.json --- packages/react-devtools-core/package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-devtools-core/package.json b/packages/react-devtools-core/package.json index a5ac1b67e8..1e98c1e6df 100644 --- a/packages/react-devtools-core/package.json +++ b/packages/react-devtools-core/package.json @@ -24,7 +24,6 @@ "author": "Jared Forsyth", "license": "BSD-3-Clause", "dependencies": { - "absolute-path": "0.0.0", "shell-quote": "^1.6.1", "ws": "^2.0.3" },