Files
react-native/Libraries/Core/setUpReactDevTools.js
T
Robert Balicki 0fac9817df Support persisted settings in Android + iOS (#34964)
Summary:
* Add a DevToolsSettingsManager, which has android and iOS variants, which uses a new TM (Android) or takes advantage of the Settings TM (iOS) to get/set console patch settings
* This is backed by either the existing Settings module (iOS) or a new Java TM, which uses the SharedPreferences AP

## Testing

Manual testing

## Changelog

[General] [Added] - Add DevToolsSettingsManager

Pull Request resolved: https://github.com/facebook/react-native/pull/34964

Test Plan: * Extensive manual testing

Reviewed By: NickGerleman

Differential Revision: D40333083

Pulled By: rbalicki2

fbshipit-source-id: f3816e3bd7dea3086f6f2269c3a099af14aebb3b
2022-10-25 21:01:25 -07:00

83 lines
2.8 KiB
JavaScript

/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
* @format
*/
'use strict';
if (__DEV__) {
let isWebSocketOpen = false;
let ws = null;
const reactDevTools = require('react-devtools-core');
const connectToDevTools = () => {
if (ws !== null && isWebSocketOpen) {
// If the DevTools backend is already connected, don't recreate the WebSocket.
// This would break the connection.
// If there isn't an active connection, a backend may be waiting to connect,
// in which case it's okay to make a new one.
return;
}
// not when debugging in chrome
// TODO(t12832058) This check is broken
if (!window.document) {
const AppState = require('../AppState/AppState');
const getDevServer = require('./Devtools/getDevServer');
// Don't steal the DevTools from currently active app.
// Note: if you add any AppState subscriptions to this file,
// you will also need to guard against `AppState.isAvailable`,
// or the code will throw for bundles that don't have it.
const isAppActive = () => AppState.currentState !== 'background';
// Get hostname from development server (packager)
const devServer = getDevServer();
const host = devServer.bundleLoadedFromServer
? devServer.url
.replace(/https?:\/\//, '')
.replace(/\/$/, '')
.split(':')[0]
: 'localhost';
// Read the optional global variable for backward compatibility.
// It was added in https://github.com/facebook/react-native/commit/bf2b435322e89d0aeee8792b1c6e04656c2719a0.
const port =
window.__REACT_DEVTOOLS_PORT__ != null
? window.__REACT_DEVTOOLS_PORT__
: 8097;
const WebSocket = require('../WebSocket/WebSocket');
ws = new WebSocket('ws://' + host + ':' + port);
ws.addEventListener('close', event => {
isWebSocketOpen = false;
});
ws.addEventListener('open', event => {
isWebSocketOpen = true;
});
const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
const devToolsSettingsManager = require('../DevToolsSettings/DevToolsSettingsManager');
reactDevTools.connectToDevTools({
isAppActive,
resolveRNStyle: require('../StyleSheet/flattenStyle'),
nativeStyleEditorValidAttributes: Object.keys(
ReactNativeStyleAttributes,
),
websocket: ws,
devToolsSettingsManager,
});
}
};
const RCTNativeAppEventEmitter = require('../EventEmitter/RCTNativeAppEventEmitter');
RCTNativeAppEventEmitter.addListener('RCTDevMenuShown', connectToDevTools);
connectToDevTools(); // Try connecting once on load
}