Updated to account for facebook/react/pull/14906/commits/cdd9ba4
Brian Vaughn committed
Feb 28, 2019 at 13:22 UTC
7da5f83a280803f2fa7af5d3533a988bd6a83557
5 files changed
+28
-17
src/backend/ReactDebugHooks.js
+18
-7
@@ -225,8 +225,8 @@ type ReactCurrentDispatcher = {
225
};
226
227
type HooksNode = {
228
- index: number,
229
- isEditable: boolean,
228
+ id: number | null,
229
+ isStateEditable: boolean,
230
name: string,
231
value: mixed,
232
subHooks: Array<HooksNode>,
@@ -368,7 +368,7 @@ function buildTree(rootStack, readHookLog): HooksTree {
368
const rootChildren = [];
369
let prevStack = null;
370
let levelChildren = rootChildren;
371
- let index = 0;
371
+ let nativeHookID = 0;
372
const stackOfChildren = [];
373
for (let i = 0; i < readHookLog.length; i++) {
374
const hook = readHookLog[i];
@@ -402,8 +402,8 @@ function buildTree(rootStack, readHookLog): HooksTree {
402
levelChildren.push({
403
name: parseCustomHookName(stack[j - 1].functionName),
404
value: undefined,
405
- index: -1,
406
- isEditable: false,
405
+ id: null,
406
+ isStateEditable: false,
407
subHooks: children,
408
});
409
stackOfChildren.push(levelChildren);
@@ -412,9 +412,20 @@ function buildTree(rootStack, readHookLog): HooksTree {
412
prevStack = stack;
413
}
414
const { primitive } = hook;
415
+
416
+ // For now, the "id" of stateful hooks is just the stateful hook index.
417
+ // Custom hooks have no ids, nor do non-stateful native hooks (e.g. Context, DebugValue).
418
+ const id =
419
+ primitive === 'Context' || primitive === 'DebugValue'
420
+ ? null
421
+ : nativeHookID++;
422
+
423
+ // For the time being, only State and Reducer hooks support runtime overrides.
424
+ const isStateEditable = primitive === 'Reducer' || primitive === 'State';
425
+
426
levelChildren.push({
416
- index: primitive === 'DebugValue' ? -1 : index++,
417
- isEditable: primitive === 'Reducer' || primitive === 'State',
427
+ id,
428
+ isStateEditable,
429
name: primitive,
430
value: hook.value,
431
subHooks: [],
src/backend/agent.js
+3
-3
@@ -25,7 +25,7 @@ type InspectSelectParams = {|
25
26
type OverrideHookParams = {|
27
id: number,
28
- index: number,
28
+ hookID: number,
29
path: Array<string | number>,
30
rendererID: number,
31
value: any,
@@ -134,7 +134,7 @@ export default class Agent extends EventEmitter {
134
135
overrideHookState = ({
136
id,
137
- index,
137
+ hookID,
138
path,
139
rendererID,
140
value,
@@ -143,7 +143,7 @@ export default class Agent extends EventEmitter {
143
if (renderer == null) {
144
console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);
145
} else {
146
- renderer.setInHook(id, index, path, value);
146
+ renderer.setInHook(id, hookID, path, value);
147
}
148
};
149
src/backend/types.js
+2
-2
@@ -100,8 +100,8 @@ export type DevToolsHook = {
100
};
101
102
export type HooksNode = {
103
- index: number,
104
- isEditable: boolean,
103
+ id: number,
104
+ isStateEditable: boolean,
105
name: string,
106
value: mixed,
107
subHooks: Array<HooksNode>,
src/devtools/views/HooksTree.js
+3
-3
@@ -70,7 +70,7 @@ type HookViewProps = {|
70
|};
71
72
function HookView({ canEditHooks, hook, id, path = [] }: HookViewProps) {
73
- const { name, index, isEditable, subHooks, value } = hook;
73
+ const { name, id: hookID, isStateEditable, subHooks, value } = hook;
74
75
const bridge = useContext(BridgeContext);
76
const store = useContext(StoreContext);
@@ -141,12 +141,12 @@ function HookView({ canEditHooks, hook, id, path = [] }: HookViewProps) {
141
} else {
142
let overrideValueFn = null;
143
// TODO Maybe read editable value from debug hook?
144
- if (canEditHooks && isEditable) {
144
+ if (canEditHooks && isStateEditable) {
145
overrideValueFn = (path: Array<string | number>, value: any) => {
146
const rendererID = store.getRendererIDForElement(id);
147
bridge.send('overrideHookState', {
148
id,
149
- index,
149
+ hookID,
150
path,
151
rendererID,
152
value,
src/devtools/views/utils.js
+2
-2
@@ -70,8 +70,8 @@ export function serializeHooksForCopy(hooks: HooksTree | null): string {
70
const current = queue.pop();
71
72
// These aren't meaningful
73
- delete current.isEditable;
74
- delete current.index;
73
+ delete current.id;
74
+ delete current.isStateEditable;
75
76
if (current.subHooks.length > 0) {
77
queue.push(...current.subHooks);