105 |
106 | ## Sponsors
107 |
108 | Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/react-native-debugger#sponsor)]
109 |
110 | 
111 |
112 | ## LICENSE
113 |
114 | [MIT](LICENSE.md)
115 |
116 | [1]: https://aur.archlinux.org/packages/react-native-debugger-bin
117 |
--------------------------------------------------------------------------------
/__e2e__/buildTestBundle.js:
--------------------------------------------------------------------------------
1 | import path from 'path'
2 | import webpack from 'webpack'
3 |
4 | const outputPath = '__e2e__/fixture'
5 | const filename = 'app.bundle.js'
6 |
7 | export const bundlePath = path.join(outputPath, filename)
8 |
9 | // Build a bundle for simulate RNDebugger worker run react-native bundle,
10 | // it included redux, mobx, remotedev tests
11 | export default function buildTestBundle() {
12 | return new Promise((resolve) => {
13 | webpack({
14 | mode: 'development',
15 | entry: './__e2e__/fixture/app',
16 | output: {
17 | path: path.resolve(__dirname, '..', outputPath),
18 | filename,
19 | },
20 | resolve: {
21 | mainFields: ['react-native', 'main', 'browser'],
22 | },
23 | }).run(resolve)
24 | })
25 | }
26 |
--------------------------------------------------------------------------------
/__e2e__/fixture/apollo.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable import/no-extraneous-dependencies */
2 | /*
3 | * Create an Apollo Client to test the bridge messages sent
4 | * wouldn't break the debugger proxy.
5 | */
6 |
7 | import { ApolloClient, InMemoryCache } from '@apollo/client'
8 | import gql from 'graphql-tag'
9 |
10 | const client = new ApolloClient({
11 | uri: 'https://spacex-production.up.railway.app/',
12 | cache: new InMemoryCache(),
13 | })
14 |
15 | export default async function run() {
16 | return client.query({
17 | query: gql`
18 | query ExampleQuery {
19 | company {
20 | name
21 | ceo
22 | employees
23 | }
24 | }
25 | `,
26 | })
27 | }
28 |
--------------------------------------------------------------------------------
/__e2e__/fixture/app.js:
--------------------------------------------------------------------------------
1 | import './setup'
2 |
3 | import runXHRTest from './xhr-test' // Install fetch polyfill before initial apollo-client
4 | import runApolloTest from './apollo'
5 | import runReduxTest from './redux'
6 | import runMobXTest from './mobx'
7 | import runRemoteDevTest from './remotedev'
8 |
9 | runReduxTest()
10 | runMobXTest()
11 | runRemoteDevTest()
12 | runApolloTest().catch((e) => console.error(e))
13 | runXHRTest().catch((e) => console.error(e))
14 |
--------------------------------------------------------------------------------
/__e2e__/fixture/mobx.js:
--------------------------------------------------------------------------------
1 | /* eslint prefer-arrow-callback: 0 */
2 | import { observable, action, useStrict } from 'mobx'
3 | import remotedev from 'mobx-remotedev/lib/dev'
4 |
5 | useStrict(true)
6 |
7 | export default function run() {
8 | const store = observable({ value: 0 })
9 | store.testPassForMobXStore1 = action(function testPassForMobXStore1() {})
10 |
11 | remotedev(store, { name: 'MobX store instance 1' }).testPassForMobXStore1()
12 |
13 | const store2 = observable({ value: 1 })
14 | store2.testPassForMobXStore2 = action(function testPassForMobXStore2() {})
15 |
16 | remotedev(store2, { name: 'MobX store instance 2' }).testPassForMobXStore2()
17 | }
18 |
--------------------------------------------------------------------------------
/__e2e__/fixture/redux.js:
--------------------------------------------------------------------------------
1 | /* eslint no-underscore-dangle: 0 */
2 |
3 | import { createStore } from 'redux'
4 |
5 | export default function run() {
6 | // Enhancer
7 | const store1 = createStore(
8 | (state) => state,
9 | { value: 0 },
10 | window.__REDUX_DEVTOOLS_EXTENSION__({
11 | name: 'Redux store instance 1',
12 | actionsWhitelist: ['@@INIT', 'TEST_PASS_FOR_REDUX_STORE_1', '^SHOW_FOR_REDUX_STORE_1$'],
13 | }),
14 | )
15 |
16 | // Compose enhancers
17 | const store2 = createStore(
18 | (state) => state,
19 | { value: 1 },
20 | window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
21 | name: 'Redux store instance 2',
22 | actionsBlacklist: ['NOT_SHOW_1_FOR_REDUX_STORE_2', 'NOT_SHOW_2_FOR_REDUX_STORE_2'],
23 | predicate: (state, action) => action.type !== 'NOT_SHOW_3_FOR_REDUX_STORE_2',
24 | })(/* No enhancers */),
25 | )
26 |
27 | store1.dispatch({ type: 'TEST_PASS_FOR_REDUX_STORE_1' })
28 | store1.dispatch({ type: 'SHOW_FOR_REDUX_STORE_1' })
29 | store1.dispatch({ type: 'NOT_SHOW_FOR_REDUX_STORE_1' })
30 |
31 | store2.dispatch({ type: 'TEST_PASS_FOR_REDUX_STORE_2' })
32 | store2.dispatch({ type: 'NOT_SHOW_1_FOR_REDUX_STORE_2' })
33 | store2.dispatch({ type: 'NOT_SHOW_2_FOR_REDUX_STORE_2' })
34 | store2.dispatch({ type: 'NOT_SHOW_3_FOR_REDUX_STORE_2' })
35 | }
36 |
--------------------------------------------------------------------------------
/__e2e__/fixture/remotedev.js:
--------------------------------------------------------------------------------
1 | import { createStore } from 'redux'
2 |
3 | const connectViaExtension = window.devToolsExtension.connect
4 |
5 | const logReducer = (reducer) => {
6 | const remotedev = connectViaExtension({
7 | name: 'RemoteDev store instance 1',
8 | actionCreators: {
9 | test: () => {},
10 | },
11 | })
12 | return (state, action) => {
13 | const reducedState = reducer(state, action)
14 | remotedev.send(action, reducedState)
15 | return reducedState
16 | }
17 | }
18 |
19 | const logRemotely = (next) => (reducer, initialState) => next(logReducer(reducer), initialState)
20 |
21 | export default function run() {
22 | const store = logRemotely(createStore)((state) => state, { value: 0 })
23 |
24 | store.dispatch({ type: 'TEST_PASS_FOR_REMOTEDEV_STORE_1' })
25 | }
26 |
--------------------------------------------------------------------------------
/__e2e__/fixture/setup.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable no-restricted-globals */
2 | /* eslint no-underscore-dangle: 0 */
3 |
4 | self.window = global
5 |
6 | // Remove native fetch as react-native use whatwg-fetch polyfill
7 | self.fetch = undefined
8 |
9 | const MessageQueue = function MessageQueue() {}
10 | MessageQueue.spy = () => {}
11 | MessageQueue.prototype.__spy = null
12 |
13 | const requiredModules = {
14 | NativeModules: {},
15 | Platform: {},
16 | setupDevtools: undefined,
17 | AsyncStorage: {},
18 | MessageQueue,
19 | }
20 | // Simulate React Native's window.require polyfill
21 | window.require = (moduleName) => {
22 | if (typeof moduleName !== 'number') {
23 | // From https://github.com/facebook/react-native/blob/5403946f098cc72c3d33ea5cee263fb3dd03891d/packager/src/Resolver/polyfills/require.js#L97
24 | console.warn(
25 | `Requiring module '${moduleName}' by name is only supported for `
26 | + 'debugging purposes and will BREAK IN PRODUCTION!',
27 | )
28 | }
29 | return requiredModules[moduleName]
30 | }
31 | window.__DEV__ = true
32 | window.__fbBatchedBridge = new MessageQueue()
33 |
--------------------------------------------------------------------------------
/__e2e__/fixture/xhr-test.js:
--------------------------------------------------------------------------------
1 | import 'whatwg-fetch'
2 |
3 | export default async function run() {
4 | // Fetch with forbidden header names
5 | await fetch('http://localhost:8099', {
6 | headers: {
7 | Origin: 'custom_origin_here',
8 | 'User-Agent': 'react-native',
9 | },
10 | })
11 |
12 | // It will log warning
13 | // because we can't use worker's FormData for upload file
14 | const data = { uri: 'uri' }
15 | const form = new FormData()
16 | form.append('file', data)
17 | }
18 |
--------------------------------------------------------------------------------
/__e2e__/mockRNServer.js:
--------------------------------------------------------------------------------
1 | import http from 'http'
2 | import WebSocket from 'ws'
3 |
4 | export default function createMockRNServer(port = 8081) {
5 | const server = http.createServer((req, res) => {
6 | if (req.method === 'GET' && req.url === '/debugger-ui') {
7 | res.writeHead(200, { 'Content-Type': 'text/html' })
8 | res.end('')
9 | }
10 | })
11 | const wss = new WebSocket.Server({ server })
12 | server.listen(port)
13 | return { server, wss }
14 | }
15 |
--------------------------------------------------------------------------------
/app/actions/debugger.js:
--------------------------------------------------------------------------------
1 | export const SET_DEBUGGER_LOCATION = 'SET_DEBUGGER_LOCATION'
2 | export const SET_DEBUGGER_STATUS = 'SET_DEBUGGER_STATUS'
3 | export const SET_DEBUGGER_WORKER = 'SET_DEBUGGER_WORKER'
4 | export const SYNC_STATE = 'SYNC_STATE'
5 | export const BEFORE_WINDOW_CLOSE = 'BEFORE_WINDOW_CLOSE'
6 |
7 | export const setDebuggerLocation = (loc) => ({
8 | type: SET_DEBUGGER_LOCATION,
9 | loc,
10 | })
11 |
12 | export const setDebuggerStatus = (status) => ({
13 | type: SET_DEBUGGER_STATUS,
14 | status,
15 | })
16 |
17 | export const setDebuggerWorker = (worker, status) => ({
18 | type: SET_DEBUGGER_WORKER,
19 | worker,
20 | status,
21 | })
22 |
23 | export const syncState = (payload) => ({
24 | type: SYNC_STATE,
25 | payload,
26 | })
27 |
28 | export const beforeWindowClose = () => ({
29 | type: BEFORE_WINDOW_CLOSE,
30 | })
31 |
--------------------------------------------------------------------------------
/app/actions/setting.js:
--------------------------------------------------------------------------------
1 | export const TOGGLE_DEVTOOLS = 'TOGGLE_DEVTOOLS'
2 | export const RESIZE_DEVTOOLS = 'RESIZE_DEVTOOLS'
3 | export const CHANGE_DEFAULT_THEME = 'CHANGE_DEFAULT_THEME'
4 |
5 | export const toggleDevTools = (name) => ({
6 | type: TOGGLE_DEVTOOLS,
7 | name,
8 | })
9 |
10 | export const resizeDevTools = (size) => ({
11 | type: RESIZE_DEVTOOLS,
12 | size,
13 | })
14 |
15 | export const changeDefaultTheme = (themeName) => ({
16 | type: CHANGE_DEFAULT_THEME,
17 | themeName,
18 | })
19 |
--------------------------------------------------------------------------------
/app/components/Draggable.js:
--------------------------------------------------------------------------------
1 | import React, { PureComponent } from 'react'
2 | import PropTypes from 'prop-types'
3 |
4 | const styles = {
5 | draggable: {
6 | position: 'relative',
7 | zIndex: 1,
8 | cursor: 'ns-resize',
9 | padding: '3px 0',
10 | margin: '-3px 0',
11 | width: '100%',
12 | },
13 | }
14 |
15 | export default class Draggable extends PureComponent {
16 | onMove = (evt) => {
17 | evt.preventDefault()
18 | const { onMove } = this.props
19 | onMove?.(evt.pageX, evt.pageY)
20 | }
21 |
22 | onUp = (evt) => {
23 | evt.preventDefault()
24 | document.removeEventListener('mousemove', this.onMove)
25 | document.removeEventListener('mouseup', this.onUp)
26 | const { onStop } = this.props
27 | onStop?.()
28 | }
29 |
30 | startDragging = (evt) => {
31 | evt.preventDefault()
32 | document.addEventListener('mousemove', this.onMove)
33 | document.addEventListener('mouseup', this.onUp)
34 | const { onStart } = this.props
35 | onStart?.()
36 | }
37 |
38 | render() {
39 | return (
40 |
47 | )
48 | }
49 | }
50 |
51 | Draggable.propTypes = {
52 | onStart: PropTypes.func,
53 | onMove: PropTypes.func.isRequired,
54 | onStop: PropTypes.func,
55 | }
56 |
57 | Draggable.defaultProps = {
58 | onStart: undefined,
59 | onStop: undefined,
60 | }
61 |
--------------------------------------------------------------------------------
/app/components/FormInput.js:
--------------------------------------------------------------------------------
1 | import React, { PureComponent } from 'react'
2 | import PropTypes from 'prop-types'
3 |
4 | const styles = {
5 | title: { textAlign: 'center' },
6 | form: {
7 | display: 'flex',
8 | flexDirection: 'row',
9 | justifyContent: 'center',
10 | alignItems: 'center',
11 | margin: 8,
12 | },
13 | input: {
14 | appearance: 'none',
15 | fontSize: '16px',
16 | margin: 2,
17 | padding: '8px',
18 | border: 0,
19 | borderRadius: 2,
20 | },
21 | button: {
22 | fontSize: '16px',
23 | margin: 2,
24 | padding: '8px',
25 | border: 0,
26 | borderRadius: 2,
27 | },
28 | }
29 |
30 | export default class FormInput extends PureComponent {
31 | constructor(props) {
32 | super(props)
33 | this.state = { value: undefined }
34 | }
35 |
36 | handleOnChange = (evt) => {
37 | const { onInputChange } = this.props
38 | let { value } = evt.target
39 | if (onInputChange) {
40 | value = onInputChange(value)
41 | }
42 | this.setState({ value })
43 | }
44 |
45 | handleClick = (evt) => {
46 | const { inputProps, onSubmit } = this.props
47 | const { value } = this.state
48 | onSubmit(evt, value || inputProps.value)
49 | }
50 |
51 | render() {
52 | const { title, inputProps, button } = this.props
53 | const { value } = this.state
54 | const val = typeof value !== 'undefined' ? value : inputProps.value
55 | return (
56 | 
6 |
7 | To ensure it works, you must use Apollo Client ^2.0.
8 |
9 | If the apollo tab doesn't appear, toggle developer tools off and on again.
10 |
11 | You can read Apollo DevTools [documentation](https://github.com/apollographql/apollo-client-devtools#apollo-client-devtools)).
12 |
13 |
14 | ## Other documentations
15 |
16 | - [Getting Started](getting-started.md)
17 | - [Debugger Integration](debugger-integration.md)
18 | - [React DevTools Integration](react-devtools-integration.md)
19 | - [Redux DevTools Integration](redux-devtools-integration.md)
20 | - [Shortcut references](shortcut-references.md)
21 | - [Network inspect of Chrome Developer Tools](network-inspect-of-chrome-devtools.md)
22 | - [Enable open in editor in console](enable-open-in-editor-in-console.md)
23 | - [Config file in home directory](config-file-in-home-directory.md)
24 | - [Troubleshooting](troubleshooting.md)
25 | - [Contributing](contributing.md)
26 |
--------------------------------------------------------------------------------
/docs/config-file-in-home-directory.md:
--------------------------------------------------------------------------------
1 | # Config file in home directory
2 |
3 | We could configure RNDebugger app in `~/.rndebuggerrc` (the config can be opened from the main menu: Debugger → Open Config File), the file used [json5](https://github.com/json5/json5) as format, see the following default template:
4 |
5 |
6 | ```json5
7 | {
8 | // Font family of the debugger window
9 | fontFamily: 'monaco, Consolas, Lucida Console, monospace',
10 |
11 | // Zoom level of the debugger window, it will override persited zoomLevel
12 | zoomLevel: 0,
13 |
14 | // Settings of debugger window,
15 | windowBounds: {
16 | // Size of the debugger window, it will override persisted size
17 | width: 1024,
18 | height: 750,
19 |
20 | // Show frame for debugger window
21 | // but due to https://github.com/electron/electron/issues/3647
22 | // so we can't have custom title bar if no frame
23 | frame: true,
24 | },
25 |
26 | // Auto check update on RNDebugger startup
27 | autoUpdate: true,
28 |
29 | // RNDebugger will open debugger window with the ports when app launched
30 | defaultRNPackagerPorts: [8081],
31 |
32 | // Env for
33 | // open React DevTools source file link
34 | // and enable open in editor for console log for RNDebugger
35 | editor: '',
36 |
37 | // Set default react-devtools theme (default is match Chrome DevTools theme)
38 | // but the default theme doesn't change manually changed theme
39 | // see https://github.com/facebook/react-devtools/blob/master/frontend/Themes/Themes.js to get more
40 | defaultReactDevToolsTheme: 'RNDebugger',
41 |
42 | // Set default react-devtools port (default is \`19567+\` if it is not being used).
43 | // The devtools backend of React Native will use the port to connect to the devtools server.
44 | // You should use that if you have some rules for binding port.
45 | // (like https://github.com/jhen0409/react-native-debugger/issues/397)
46 | defaultReactDevToolsPort: 19567,
47 |
48 | // Enable Network Inspect by default
49 | // See https://github.com/jhen0409/react-native-debugger/blob/master/docs/network-inspect-of-chrome-devtools.md
50 | defaultNetworkInspect: false,
51 |
52 | // Refresh devtools when doing JS reload every N times. (-1 for disabled)
53 | // This can effectively avoid possible memory leaks (Like
54 | // https://github.com/jhen0409/react-native-debugger/issues/405) in devtools.
55 | timesJSLoadToRefreshDevTools: -1,
56 | }
57 | ```
58 |
59 | ## Other documentations
60 |
61 | - [Getting Started](getting-started.md)
62 | - [Debugger Integration](debugger-integration.md)
63 | - [React DevTools Integration](react-devtools-integration.md)
64 | - [Redux DevTools Integration](redux-devtools-integration.md)
65 | - [Apollo Client DevTools Integration](apollo-client-devtools-integration.md)
66 | - [Shortcut references](shortcut-references.md)
67 | - [Network inspect of Chrome Developer Tools](network-inspect-of-chrome-devtools.md)
68 | - [Enable open in editor in console](enable-open-in-editor-in-console.md)
69 | - [Troubleshooting](troubleshooting.md)
70 | - [Contributing](contributing.md)
71 |
--------------------------------------------------------------------------------
/docs/contributing.md:
--------------------------------------------------------------------------------
1 | # Contributing
2 |
3 | ## Development
4 |
5 | ### Fork this repo & install dependencies
6 |
7 | We're recommended use yarn because we keep the dependencies lock of yarn.
8 |
9 | ```bash
10 | # In react-native-debugger directory
11 | $ yarn
12 | $ cd npm-package && yarn && cd ..
13 | ```
14 |
15 | If you want to debug the [NPM package](../npm-package), just run `npm link
87 |
88 | ### Sponsors
89 |
90 | Thank you to all our sponsors! (please ask your company to also support this open source project by [becoming a sponsor](https://opencollective.com/react-native-debugger#sponsor))
91 |
92 |
93 |
94 | ## Other documentations
95 |
96 | - [Getting Started](getting-started.md)
97 | - [Debugger Integration](debugger-integration.md)
98 | - [React DevTools Integration](react-devtools-integration.md)
99 | - [Redux DevTools Integration](redux-devtools-integration.md)
100 | - [Apollo Client DevTools Integration](apollo-client-devtools-integration.md)
101 | - [Shortcut references](shortcut-references.md)
102 | - [Network inspect of Chrome Developer Tools](network-inspect-of-chrome-devtools.md)
103 | - [Enable open in editor in console](enable-open-in-editor-in-console.md)
104 | - [Config file in home directory](config-file-in-home-directory.md)
105 | - [Troubleshooting](troubleshooting.md)
106 |
--------------------------------------------------------------------------------
/docs/debugger-integration.md:
--------------------------------------------------------------------------------
1 | # Debugger integration
2 |
3 | The Debugger worker is referenced from [react-native](https://github.com/facebook/react-native/blob/master/local-cli/server/util/) debugger-ui, so it's only working if you're enabled `Debug JS Remotely`, you can debug your app in Chrome Developer Tools, we keep the following tabs:
4 |
5 | - `Console`
6 | - `Sources`
7 | - `Network` (Inspect Network requests if you are enabled [Network Inspect](network-inspect-of-chrome-devtools.md))
8 | - `Memory`
9 |
10 | ## Multiple React Native packager (custom port) support
11 |
12 | We can use [`react-native-debugger-open`](../npm-package) package to detect RN packager port, it will open an another window automatically if another debugger workers are running.
13 |
14 | If you don't use [the npm package](../npm-package) and want to change port, click `Debugger` -> `New Window` (`Command⌘ + T` for macOS, `Ctrl + T` for Linux / Windows) in application menu, you need to type an another RN packager port. The default port is use [`Expo`](https://github.com/expo/expo) (and [`create-react-native-app`](https://github.com/react-community/create-react-native-app)) default port.
15 |
16 | For macOS (10.12+), it used native tabs feature, see [the support page](https://support.apple.com/en-us/HT206998) for known how to use and setting.
17 |
18 | ## Debugging tips
19 |
20 | #### Global variables in console
21 |
22 | When you enabled remote debugging, RNDebugger should switched context to `RNDebuggerWorker.js` automatically, so you can get global variables of React Native runtime in the console.
23 |
24 | - `$r`: You selected element on react-devtools.
25 | - `showAsyncStorageContentInDev()` - Log AsyncStorage content
26 | - `$reactNative.*` - Get react-native modules. For example, you can get `$reactNative.AsyncStorage`
27 |
28 | #### Enable `Debug Remotely` programmatically
29 |
30 | For enable `Debug Remotely` without using dev menu, you can use the built-in `DevSettings` native module:
31 |
32 | ```js
33 | import { NativeModules } from 'react-native'
34 |
35 | if (__DEV__) {
36 | NativeModules.DevSettings.setIsDebuggingRemotely(true)
37 | }
38 | ```
39 |
40 | If you're using Expo, you can still use the method, but it probably only works with `jsEngine: jsc` in `app.json`, `jsEngine: hermes` may not works.
41 |
42 | ## Other documentations
43 |
44 | - [Getting Started](getting-started.md)
45 | - [React DevTools Integration](react-devtools-integration.md)
46 | - [Redux DevTools Integration](redux-devtools-integration.md)
47 | - [Apollo Client DevTools Integration](apollo-client-devtools-integration.md)
48 | - [Shortcut references](shortcut-references.md)
49 | - [Network inspect of Chrome Developer Tools](network-inspect-of-chrome-devtools.md)
50 | - [Enable open in editor in console](enable-open-in-editor-in-console.md)
51 | - [Config file in home directory](config-file-in-home-directory.md)
52 | - [Troubleshooting](troubleshooting.md)
53 | - [Contributing](contributing.md)
54 |
--------------------------------------------------------------------------------
/docs/enable-open-in-editor-in-console.md:
--------------------------------------------------------------------------------
1 | # Enable open in editor in console
2 |
3 | You can toggle the application menu item:
4 |
5 | 
6 |
7 | Instead of open file in `Sources` tab, you can open file in editor by click source link in console. This feature is disabled by default.
8 |
9 | ## Known issues
10 |
11 | - Currently this feature doesn't work with Haul bundler, please tracking [issue #141](https://github.com/jhen0409/react-native-debugger/issues/141).
12 |
13 | ## Other documentations
14 |
15 | - [Getting Started](getting-started.md)
16 | - [Debugger Integration](debugger-integration.md)
17 | - [React DevTools Integration](react-devtools-integration.md)
18 | - [Redux DevTools Integration](redux-devtools-integration.md)
19 | - [Apollo Client DevTools Integration](apollo-client-devtools-integration.md)
20 | - [Shortcut references](shortcut-references.md)
21 | - [Network inspect of Chrome Developer Tools](network-inspect-of-chrome-devtools.md)
22 | - [Config file in home directory](config-file-in-home-directory.md)
23 | - [Troubleshooting](troubleshooting.md)
24 | - [Contributing](contributing.md)
25 |
--------------------------------------------------------------------------------
/docs/getting-started.md:
--------------------------------------------------------------------------------
1 | # Getting Started
2 |
3 | Just these steps will let you start RNDebugger out of box:
4 |
5 | - Install the latest version ([download page](https://github.com/jhen0409/react-native-debugger/releases)).
6 | - Make sure all debugger clients of React Native are closed, usually are `http://localhost:
39 |
40 | The `Redux Slider` will shown on right if you're using [`Redux API`](redux-devtools-integration.md),
41 |
42 | If your Mac haven't TouchBar support and you still want to use the feature, you can use [Touché](https://redsweater.com/touche/).
43 |
44 | ## Other documentations
45 |
46 | - [Getting Started](getting-started.md)
47 | - [Debugger Integration](debugger-integration.md)
48 | - [React DevTools Integration](react-devtools-integration.md)
49 | - [Redux DevTools Integration](redux-devtools-integration.md)
50 | - [Apollo Client DevTools Integration](apollo-client-devtools-integration.md)
51 | - [Network inspect of Chrome Developer Tools](network-inspect-of-chrome-devtools.md)
52 | - [Enable open in editor in console](enable-open-in-editor-in-console.md)
53 | - [Config file in home directory](config-file-in-home-directory.md)
54 | - [Troubleshooting](troubleshooting.md)
55 | - [Contributing](contributing.md)
56 |
--------------------------------------------------------------------------------
/electron/app.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |