react-native/local-cli/server/middleware/getDevToolsMiddleware.js

71 lines
2.3 KiB
JavaScript
Raw Normal View History

/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
const launchChrome = require('../util/launchChrome');
const {exec} = require('child_process');
Prevents JS Debugger issues with CORS Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> See #17618 On certain networks, `xip.io` is used, but as the debugger will always using localhost a change upstream has resulted in a CORS issue (see screenshots in #17618). This change ensures that the debugger will always open with whatever configuration. > This should be merged in as a patch of `0.52.x` as it affects current release, and `0.51.x` didn't have this issue. Tested locally, could do with the people having the same issue in #17618 testing it out prior to merging. (If this PR adds or changes functionality, please take some time to update the docs at https://github.com/facebook/react-native-website, and link to your PR here.) <!-- Help reviewers and the release process by writing your own release notes **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.** CATEGORY [----------] TYPE [ CLI ] [-------------] LOCATION [ DOCS ] [ BREAKING ] [-------------] [ GENERAL ] [ BUGFIX ] [-{Component}-] [ INTERNAL ] [ ENHANCEMENT ] [ {File} ] [ IOS ] [ FEATURE ] [ {Directory} ] |-----------| [ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} | [----------] [-------------] [-------------] |-----------| [CATEGORY] [TYPE] [LOCATION] - MESSAGE EXAMPLES: [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see --> [CLI] [BUGFIX] [local-cli/server/middleware/getDevToolsMiddleware.js] - Prevents JS Debugger issues with CORS Closes https://github.com/facebook/react-native/pull/17720 Differential Revision: D6828205 Pulled By: hramos fbshipit-source-id: 7e5d43db9faf7edc9444ba4214aca1a18e25dbd2
2018-01-27 10:21:49 +00:00
function launchChromeDevTools(host, args = '') {
var debuggerURL = 'http://' + host + '/debugger-ui' + args;
console.log('Launching Dev Tools...');
launchChrome(debuggerURL);
}
function escapePath(pathname) {
// " Can escape paths with spaces in OS X, Windows, and *nix
return '"' + pathname + '"';
}
Prevents JS Debugger issues with CORS Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> See #17618 On certain networks, `xip.io` is used, but as the debugger will always using localhost a change upstream has resulted in a CORS issue (see screenshots in #17618). This change ensures that the debugger will always open with whatever configuration. > This should be merged in as a patch of `0.52.x` as it affects current release, and `0.51.x` didn't have this issue. Tested locally, could do with the people having the same issue in #17618 testing it out prior to merging. (If this PR adds or changes functionality, please take some time to update the docs at https://github.com/facebook/react-native-website, and link to your PR here.) <!-- Help reviewers and the release process by writing your own release notes **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.** CATEGORY [----------] TYPE [ CLI ] [-------------] LOCATION [ DOCS ] [ BREAKING ] [-------------] [ GENERAL ] [ BUGFIX ] [-{Component}-] [ INTERNAL ] [ ENHANCEMENT ] [ {File} ] [ IOS ] [ FEATURE ] [ {Directory} ] |-----------| [ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} | [----------] [-------------] [-------------] |-----------| [CATEGORY] [TYPE] [LOCATION] - MESSAGE EXAMPLES: [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see --> [CLI] [BUGFIX] [local-cli/server/middleware/getDevToolsMiddleware.js] - Prevents JS Debugger issues with CORS Closes https://github.com/facebook/react-native/pull/17720 Differential Revision: D6828205 Pulled By: hramos fbshipit-source-id: 7e5d43db9faf7edc9444ba4214aca1a18e25dbd2
2018-01-27 10:21:49 +00:00
function launchDevTools({host, projectRoots}, isChromeConnected) {
// Explicit config always wins
var customDebugger = process.env.REACT_DEBUGGER;
if (customDebugger) {
var projects = projectRoots.map(escapePath).join(' ');
var command = customDebugger + ' ' + projects;
console.log('Starting custom debugger by executing: ' + command);
exec(command, function(error, stdout, stderr) {
if (error !== null) {
console.log('Error while starting custom debugger: ' + error);
}
});
} else if (!isChromeConnected()) {
// Dev tools are not yet open; we need to open a session
Prevents JS Debugger issues with CORS Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> See #17618 On certain networks, `xip.io` is used, but as the debugger will always using localhost a change upstream has resulted in a CORS issue (see screenshots in #17618). This change ensures that the debugger will always open with whatever configuration. > This should be merged in as a patch of `0.52.x` as it affects current release, and `0.51.x` didn't have this issue. Tested locally, could do with the people having the same issue in #17618 testing it out prior to merging. (If this PR adds or changes functionality, please take some time to update the docs at https://github.com/facebook/react-native-website, and link to your PR here.) <!-- Help reviewers and the release process by writing your own release notes **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.** CATEGORY [----------] TYPE [ CLI ] [-------------] LOCATION [ DOCS ] [ BREAKING ] [-------------] [ GENERAL ] [ BUGFIX ] [-{Component}-] [ INTERNAL ] [ ENHANCEMENT ] [ {File} ] [ IOS ] [ FEATURE ] [ {Directory} ] |-----------| [ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} | [----------] [-------------] [-------------] |-----------| [CATEGORY] [TYPE] [LOCATION] - MESSAGE EXAMPLES: [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see --> [CLI] [BUGFIX] [local-cli/server/middleware/getDevToolsMiddleware.js] - Prevents JS Debugger issues with CORS Closes https://github.com/facebook/react-native/pull/17720 Differential Revision: D6828205 Pulled By: hramos fbshipit-source-id: 7e5d43db9faf7edc9444ba4214aca1a18e25dbd2
2018-01-27 10:21:49 +00:00
launchChromeDevTools(host);
}
}
module.exports = function(options, isChromeConnected) {
return function(req, res, next) {
Prevents JS Debugger issues with CORS Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> See #17618 On certain networks, `xip.io` is used, but as the debugger will always using localhost a change upstream has resulted in a CORS issue (see screenshots in #17618). This change ensures that the debugger will always open with whatever configuration. > This should be merged in as a patch of `0.52.x` as it affects current release, and `0.51.x` didn't have this issue. Tested locally, could do with the people having the same issue in #17618 testing it out prior to merging. (If this PR adds or changes functionality, please take some time to update the docs at https://github.com/facebook/react-native-website, and link to your PR here.) <!-- Help reviewers and the release process by writing your own release notes **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.** CATEGORY [----------] TYPE [ CLI ] [-------------] LOCATION [ DOCS ] [ BREAKING ] [-------------] [ GENERAL ] [ BUGFIX ] [-{Component}-] [ INTERNAL ] [ ENHANCEMENT ] [ {File} ] [ IOS ] [ FEATURE ] [ {Directory} ] |-----------| [ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} | [----------] [-------------] [-------------] |-----------| [CATEGORY] [TYPE] [LOCATION] - MESSAGE EXAMPLES: [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see --> [CLI] [BUGFIX] [local-cli/server/middleware/getDevToolsMiddleware.js] - Prevents JS Debugger issues with CORS Closes https://github.com/facebook/react-native/pull/17720 Differential Revision: D6828205 Pulled By: hramos fbshipit-source-id: 7e5d43db9faf7edc9444ba4214aca1a18e25dbd2
2018-01-27 10:21:49 +00:00
var host = req.headers.host;
if (req.url === '/launch-safari-devtools') {
// TODO: remove `console.log` and dev tools binary
console.log(
'We removed support for Safari dev-tools. ' +
'If you still need this, please let us know.',
);
} else if (req.url === '/launch-chrome-devtools') {
// TODO: Remove this case in the future
console.log(
'The method /launch-chrome-devtools is deprecated. You are ' +
' probably using an application created with an older CLI with the ' +
' packager of a newer CLI. Please upgrade your application: ' +
'https://facebook.github.io/react-native/docs/upgrading.html',
);
launchDevTools(options, isChromeConnected);
res.end('OK');
} else if (req.url === '/launch-js-devtools') {
Prevents JS Debugger issues with CORS Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> See #17618 On certain networks, `xip.io` is used, but as the debugger will always using localhost a change upstream has resulted in a CORS issue (see screenshots in #17618). This change ensures that the debugger will always open with whatever configuration. > This should be merged in as a patch of `0.52.x` as it affects current release, and `0.51.x` didn't have this issue. Tested locally, could do with the people having the same issue in #17618 testing it out prior to merging. (If this PR adds or changes functionality, please take some time to update the docs at https://github.com/facebook/react-native-website, and link to your PR here.) <!-- Help reviewers and the release process by writing your own release notes **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.** CATEGORY [----------] TYPE [ CLI ] [-------------] LOCATION [ DOCS ] [ BREAKING ] [-------------] [ GENERAL ] [ BUGFIX ] [-{Component}-] [ INTERNAL ] [ ENHANCEMENT ] [ {File} ] [ IOS ] [ FEATURE ] [ {Directory} ] |-----------| [ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} | [----------] [-------------] [-------------] |-----------| [CATEGORY] [TYPE] [LOCATION] - MESSAGE EXAMPLES: [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see --> [CLI] [BUGFIX] [local-cli/server/middleware/getDevToolsMiddleware.js] - Prevents JS Debugger issues with CORS Closes https://github.com/facebook/react-native/pull/17720 Differential Revision: D6828205 Pulled By: hramos fbshipit-source-id: 7e5d43db9faf7edc9444ba4214aca1a18e25dbd2
2018-01-27 10:21:49 +00:00
launchDevTools({...options, host}, isChromeConnected);
res.end('OK');
} else {
next();
}
};
};