Use toMatchInlineSnapshot for dehydrated values (#20618)
Sebastian Silbermann committed
Apr 26, 2021 at 18:30 UTC
84b9162cbe91a8c0169ec1171273be58f3a2398a
7 files changed
+297
-334
packages/react-devtools-shared/src/__tests__/dehydratedValueSerializer.js
+5
-1
@@ -10,10 +10,14 @@
10
// test() is part of Jest's serializer API
11
export function test(maybeDehydratedValue) {
12
const {meta} = require('react-devtools-shared/src/hydration');
13
+
14
+ const hasOwnProperty = Object.prototype.hasOwnProperty.bind(
15
+ maybeDehydratedValue,
16
+ );
17
return (
18
maybeDehydratedValue !== null &&
19
typeof maybeDehydratedValue === 'object' &&
16
- maybeDehydratedValue.hasOwnProperty(meta.inspectable) &&
20
+ hasOwnProperty(meta.inspectable) &&
21
maybeDehydratedValue[meta.inspected] !== true
22
);
23
}
packages/react-devtools-shared/src/__tests__/inspectedElement-test.js
+153
-197
@@ -20,7 +20,6 @@ describe('InspectedElement', () => {
20
let TestRenderer: ReactTestRenderer;
21
let bridge: FrontendBridge;
22
let store: Store;
23
- let meta;
23
let utils;
24
25
let BridgeContext;
@@ -39,8 +38,6 @@ describe('InspectedElement', () => {
38
utils = require('./utils');
39
utils.beforeEachProfiling();
40
42
- meta = require('react-devtools-shared/src/hydration').meta;
43
-
41
bridge = global.bridge;
42
store = global.store;
43
store.collapseNodesByDefault = false;
@@ -442,18 +439,21 @@ describe('InspectedElement', () => {
439
440
const inspectedElement = await inspectElementAtIndex(0);
441
445
- const {props} = (inspectedElement: any);
446
- expect(props.boolean_false).toBe(false);
447
- expect(props.boolean_true).toBe(true);
448
- expect(Number.isFinite(props.infinity)).toBe(false);
449
- expect(props.integer_zero).toEqual(0);
450
- expect(props.integer_one).toEqual(1);
451
- expect(props.float).toEqual(1.23);
452
- expect(props.string).toEqual('abc');
453
- expect(props.string_empty).toEqual('');
454
- expect(props.nan).toBeNaN();
455
- expect(props.value_null).toBeNull();
456
- expect(props.value_undefined).toBeUndefined();
442
+ expect(inspectedElement.props).toMatchInlineSnapshot(`
443
+ Object {
444
+ "boolean_false": false,
445
+ "boolean_true": true,
446
+ "float": 1.23,
447
+ "infinity": Infinity,
448
+ "integer_one": 1,
449
+ "integer_zero": 0,
450
+ "nan": NaN,
451
+ "string": "abc",
452
+ "string_empty": "",
453
+ "value_null": null,
454
+ "value_undefined": undefined,
455
+ }
456
+ `);
457
});
458
459
it('should support complex data types', async () => {
@@ -539,175 +539,126 @@ describe('InspectedElement', () => {
539
540
const inspectedElement = await inspectElementAtIndex(0);
541
542
- const {
543
- anonymous_fn,
544
- array_buffer,
545
- array_of_arrays,
546
- big_int,
547
- bound_fn,
548
- data_view,
549
- date,
550
- fn,
551
- html_element,
552
- immutable,
553
- map,
554
- map_of_maps,
555
- object_of_objects,
556
- object_with_symbol,
557
- proxy,
558
- react_element,
559
- regexp,
560
- set,
561
- set_of_sets,
562
- symbol,
563
- typed_array,
564
- } = (inspectedElement: any).props;
565
-
566
- expect(anonymous_fn[meta.inspectable]).toBe(false);
567
- expect(anonymous_fn[meta.name]).toBe('function');
568
- expect(anonymous_fn[meta.type]).toBe('function');
569
- expect(anonymous_fn[meta.preview_long]).toBe('ƒ () {}');
570
- expect(anonymous_fn[meta.preview_short]).toBe('ƒ () {}');
571
-
572
- expect(array_buffer[meta.size]).toBe(3);
573
- expect(array_buffer[meta.inspectable]).toBe(false);
574
- expect(array_buffer[meta.name]).toBe('ArrayBuffer');
575
- expect(array_buffer[meta.type]).toBe('array_buffer');
576
- expect(array_buffer[meta.preview_short]).toBe('ArrayBuffer(3)');
577
- expect(array_buffer[meta.preview_long]).toBe('ArrayBuffer(3)');
578
-
579
- expect(array_of_arrays[0][meta.size]).toBe(2);
580
- expect(array_of_arrays[0][meta.inspectable]).toBe(true);
581
- expect(array_of_arrays[0][meta.name]).toBe('Array');
582
- expect(array_of_arrays[0][meta.type]).toBe('array');
583
- expect(array_of_arrays[0][meta.preview_long]).toBe('[Array(3), Array(0)]');
584
- expect(array_of_arrays[0][meta.preview_short]).toBe('Array(2)');
585
-
586
- expect(big_int[meta.inspectable]).toBe(false);
587
- expect(big_int[meta.name]).toBe('123');
588
- expect(big_int[meta.type]).toBe('bigint');
589
- expect(big_int[meta.preview_long]).toBe('123n');
590
- expect(big_int[meta.preview_short]).toBe('123n');
591
-
592
- expect(bound_fn[meta.inspectable]).toBe(false);
593
- expect(bound_fn[meta.name]).toBe('bound exampleFunction');
594
- expect(bound_fn[meta.type]).toBe('function');
595
- expect(bound_fn[meta.preview_long]).toBe('ƒ bound exampleFunction() {}');
596
- expect(bound_fn[meta.preview_short]).toBe('ƒ bound exampleFunction() {}');
597
-
598
- expect(data_view[meta.size]).toBe(3);
599
- expect(data_view[meta.inspectable]).toBe(false);
600
- expect(data_view[meta.name]).toBe('DataView');
601
- expect(data_view[meta.type]).toBe('data_view');
602
- expect(data_view[meta.preview_long]).toBe('DataView(3)');
603
- expect(data_view[meta.preview_short]).toBe('DataView(3)');
604
-
605
- expect(date[meta.inspectable]).toBe(false);
606
- expect(date[meta.type]).toBe('date');
607
- expect(new Date(date[meta.preview_long]).toISOString()).toBe(
608
- exampleDateISO,
609
- );
610
- expect(new Date(date[meta.preview_short]).toISOString()).toBe(
611
- exampleDateISO,
612
- );
613
-
614
- expect(fn[meta.inspectable]).toBe(false);
615
- expect(fn[meta.name]).toBe('exampleFunction');
616
- expect(fn[meta.type]).toBe('function');
617
- expect(fn[meta.preview_long]).toBe('ƒ exampleFunction() {}');
618
- expect(fn[meta.preview_short]).toBe('ƒ exampleFunction() {}');
619
-
620
- expect(html_element[meta.inspectable]).toBe(false);
621
- expect(html_element[meta.name]).toBe('DIV');
622
- expect(html_element[meta.type]).toBe('html_element');
623
- expect(html_element[meta.preview_long]).toBe('<div />');
624
- expect(html_element[meta.preview_short]).toBe('<div />');
625
-
626
- expect(immutable[meta.inspectable]).toBeUndefined(); // Complex type
627
- expect(immutable[meta.name]).toBe('Map');
628
- expect(immutable[meta.type]).toBe('iterator');
629
- expect(immutable[meta.preview_long]).toBe(
630
- 'Map(3) {"a" => List(3), "b" => 123, "c" => Map(2)}',
631
- );
632
- expect(immutable[meta.preview_short]).toBe('Map(3)');
633
-
634
- expect(map[meta.inspectable]).toBeUndefined(); // Complex type
635
- expect(map[meta.name]).toBe('Map');
636
- expect(map[meta.type]).toBe('iterator');
637
- expect(map[0][meta.type]).toBe('array');
638
- expect(map[meta.preview_long]).toBe(
639
- 'Map(2) {"name" => "Brian", "food" => "sushi"}',
640
- );
641
- expect(map[meta.preview_short]).toBe('Map(2)');
642
-
643
- expect(map_of_maps[meta.inspectable]).toBeUndefined(); // Complex type
644
- expect(map_of_maps[meta.name]).toBe('Map');
645
- expect(map_of_maps[meta.type]).toBe('iterator');
646
- expect(map_of_maps[0][meta.type]).toBe('array');
647
- expect(map_of_maps[meta.preview_long]).toBe(
648
- 'Map(2) {"first" => Map(2), "second" => Map(2)}',
649
- );
650
- expect(map_of_maps[meta.preview_short]).toBe('Map(2)');
651
-
652
- expect(object_of_objects.inner[meta.size]).toBe(3);
653
- expect(object_of_objects.inner[meta.inspectable]).toBe(true);
654
- expect(object_of_objects.inner[meta.name]).toBe('');
655
- expect(object_of_objects.inner[meta.type]).toBe('object');
656
- expect(object_of_objects.inner[meta.preview_long]).toBe(
657
- '{boolean: true, number: 123, string: "abc"}',
658
- );
659
- expect(object_of_objects.inner[meta.preview_short]).toBe('{…}');
660
-
661
- expect(object_with_symbol['Symbol(name)']).toBe('hello');
662
-
663
- expect(proxy[meta.inspectable]).toBe(false);
664
- expect(proxy[meta.name]).toBe('function');
665
- expect(proxy[meta.type]).toBe('function');
666
- expect(proxy[meta.preview_long]).toBe('ƒ () {}');
667
- expect(proxy[meta.preview_short]).toBe('ƒ () {}');
668
-
669
- expect(react_element[meta.inspectable]).toBe(false);
670
- expect(react_element[meta.name]).toBe('span');
671
- expect(react_element[meta.type]).toBe('react_element');
672
- expect(react_element[meta.preview_long]).toBe('<span />');
673
- expect(react_element[meta.preview_short]).toBe('<span />');
674
-
675
- expect(regexp[meta.inspectable]).toBe(false);
676
- expect(regexp[meta.name]).toBe('/abc/giu');
677
- expect(regexp[meta.preview_long]).toBe('/abc/giu');
678
- expect(regexp[meta.preview_short]).toBe('/abc/giu');
679
- expect(regexp[meta.type]).toBe('regexp');
680
-
681
- expect(set[meta.inspectable]).toBeUndefined(); // Complex type
682
- expect(set[meta.name]).toBe('Set');
683
- expect(set[meta.type]).toBe('iterator');
684
- expect(set[0]).toBe('abc');
685
- expect(set[1]).toBe(123);
686
- expect(set[meta.preview_long]).toBe('Set(2) {"abc", 123}');
687
- expect(set[meta.preview_short]).toBe('Set(2)');
688
-
689
- expect(set_of_sets[meta.inspectable]).toBeUndefined(); // Complex type
690
- expect(set_of_sets[meta.name]).toBe('Set');
691
- expect(set_of_sets[meta.type]).toBe('iterator');
692
- expect(set_of_sets['0'][meta.inspectable]).toBe(true);
693
- expect(set_of_sets[meta.preview_long]).toBe('Set(2) {Set(3), Set(3)}');
694
- expect(set_of_sets[meta.preview_short]).toBe('Set(2)');
695
-
696
- expect(symbol[meta.inspectable]).toBe(false);
697
- expect(symbol[meta.name]).toBe('Symbol(symbol)');
698
- expect(symbol[meta.type]).toBe('symbol');
699
- expect(symbol[meta.preview_long]).toBe('Symbol(symbol)');
700
- expect(symbol[meta.preview_short]).toBe('Symbol(symbol)');
701
-
702
- expect(typed_array[meta.inspectable]).toBeUndefined(); // Complex type
703
- expect(typed_array[meta.size]).toBe(3);
704
- expect(typed_array[meta.name]).toBe('Int8Array');
705
- expect(typed_array[meta.type]).toBe('typed_array');
706
- expect(typed_array[0]).toBe(100);
707
- expect(typed_array[1]).toBe(-100);
708
- expect(typed_array[2]).toBe(0);
709
- expect(typed_array[meta.preview_long]).toBe('Int8Array(3) [100, -100, 0]');
710
- expect(typed_array[meta.preview_short]).toBe('Int8Array(3)');
542
+ expect(inspectedElement.props).toMatchInlineSnapshot(`
543
+ Object {
544
+ "anonymous_fn": Dehydrated {
545
+ "preview_short": ƒ () {},
546
+ "preview_long": ƒ () {},
547
+ },
548
+ "array_buffer": Dehydrated {
549
+ "preview_short": ArrayBuffer(3),
550
+ "preview_long": ArrayBuffer(3),
551
+ },
552
+ "array_of_arrays": Array [
553
+ Dehydrated {
554
+ "preview_short": Array(2),
555
+ "preview_long": [Array(3), Array(0)],
556
+ },
557
+ ],
558
+ "big_int": Dehydrated {
559
+ "preview_short": 123n,
560
+ "preview_long": 123n,
561
+ },
562
+ "bound_fn": Dehydrated {
563
+ "preview_short": ƒ bound exampleFunction() {},
564
+ "preview_long": ƒ bound exampleFunction() {},
565
+ },
566
+ "data_view": Dehydrated {
567
+ "preview_short": DataView(3),
568
+ "preview_long": DataView(3),
569
+ },
570
+ "date": Dehydrated {
571
+ "preview_short": Tue Dec 31 2019 23:42:42 GMT+0000 (Coordinated Universal Time),
572
+ "preview_long": Tue Dec 31 2019 23:42:42 GMT+0000 (Coordinated Universal Time),
573
+ },
574
+ "fn": Dehydrated {
575
+ "preview_short": ƒ exampleFunction() {},
576
+ "preview_long": ƒ exampleFunction() {},
577
+ },
578
+ "html_element": Dehydrated {
579
+ "preview_short": <div />,
580
+ "preview_long": <div />,
581
+ },
582
+ "immutable": Object {
583
+ "0": Dehydrated {
584
+ "preview_short": Array(2),
585
+ "preview_long": ["a", List(3)],
586
+ },
587
+ "1": Dehydrated {
588
+ "preview_short": Array(2),
589
+ "preview_long": ["b", 123],
590
+ },
591
+ "2": Dehydrated {
592
+ "preview_short": Array(2),
593
+ "preview_long": ["c", Map(2)],
594
+ },
595
+ },
596
+ "map": Object {
597
+ "0": Dehydrated {
598
+ "preview_short": Array(2),
599
+ "preview_long": ["name", "Brian"],
600
+ },
601
+ "1": Dehydrated {
602
+ "preview_short": Array(2),
603
+ "preview_long": ["food", "sushi"],
604
+ },
605
+ },
606
+ "map_of_maps": Object {
607
+ "0": Dehydrated {
608
+ "preview_short": Array(2),
609
+ "preview_long": ["first", Map(2)],
610
+ },
611
+ "1": Dehydrated {
612
+ "preview_short": Array(2),
613
+ "preview_long": ["second", Map(2)],
614
+ },
615
+ },
616
+ "object_of_objects": Object {
617
+ "inner": Dehydrated {
618
+ "preview_short": {…},
619
+ "preview_long": {boolean: true, number: 123, string: "abc"},
620
+ },
621
+ },
622
+ "object_with_symbol": Object {
623
+ "Symbol(name)": "hello",
624
+ },
625
+ "proxy": Dehydrated {
626
+ "preview_short": ƒ () {},
627
+ "preview_long": ƒ () {},
628
+ },
629
+ "react_element": Dehydrated {
630
+ "preview_short": <span />,
631
+ "preview_long": <span />,
632
+ },
633
+ "regexp": Dehydrated {
634
+ "preview_short": /abc/giu,
635
+ "preview_long": /abc/giu,
636
+ },
637
+ "set": Object {
638
+ "0": "abc",
639
+ "1": 123,
640
+ },
641
+ "set_of_sets": Object {
642
+ "0": Dehydrated {
643
+ "preview_short": Set(3),
644
+ "preview_long": Set(3) {"a", "b", "c"},
645
+ },
646
+ "1": Dehydrated {
647
+ "preview_short": Set(3),
648
+ "preview_long": Set(3) {1, 2, 3},
649
+ },
650
+ },
651
+ "symbol": Dehydrated {
652
+ "preview_short": Symbol(symbol),
653
+ "preview_long": Symbol(symbol),
654
+ },
655
+ "typed_array": Object {
656
+ "0": 100,
657
+ "1": -100,
658
+ "2": 0,
659
+ },
660
+ }
661
+ `);
662
});
663
664
it('should not consume iterables while inspecting', async () => {
@@ -725,13 +676,14 @@ describe('InspectedElement', () => {
676
);
677
678
const inspectedElement = await inspectElementAtIndex(0);
728
-
729
- const {prop} = (inspectedElement: any).props;
730
- expect(prop[meta.inspectable]).toBe(false);
731
- expect(prop[meta.name]).toBe('Generator');
732
- expect(prop[meta.type]).toBe('opaque_iterator');
733
- expect(prop[meta.preview_long]).toBe('Generator');
734
- expect(prop[meta.preview_short]).toBe('Generator');
679
+ expect(inspectedElement.props).toMatchInlineSnapshot(`
680
+ Object {
681
+ "prop": Dehydrated {
682
+ "preview_short": Generator,
683
+ "preview_long": Generator,
684
+ },
685
+ }
686
+ `);
687
});
688
689
it('should support objects with no prototype', async () => {
@@ -774,10 +726,14 @@ describe('InspectedElement', () => {
726
727
const inspectedElement = await inspectElementAtIndex(0);
728
777
- // TRICKY: Don't use toMatchInlineSnapshot() for this test!
778
- // Our snapshot serializer relies on hasOwnProperty() for feature detection.
779
- expect(inspectedElement.props.object.name).toBe('blah');
780
- expect(inspectedElement.props.object.hasOwnProperty).toBe(true);
729
+ expect(inspectedElement.props).toMatchInlineSnapshot(`
730
+ Object {
731
+ "object": Object {
732
+ "hasOwnProperty": true,
733
+ "name": "blah",
734
+ },
735
+ }
736
+ `);
737
});
738
739
it('should support custom objects with enumerable properties and getters', async () => {
@@ -1834,8 +1790,8 @@ describe('InspectedElement', () => {
1790
ReactDOM.render(<DisplayedComplexValue />, container),
1791
);
1792
1837
- const inspectedElement = await inspectElementAtIndex(0);
1838
- expect(inspectedElement.hooks).toMatchInlineSnapshot(`
1793
+ const {hooks} = await inspectElementAtIndex(0);
1794
+ expect(hooks).toMatchInlineSnapshot(`
1795
Array [
1796
Object {
1797
"id": null,
packages/react-devtools-shared/src/__tests__/inspectedElementSerializer.js
+14
-6
@@ -1,12 +1,20 @@
1
// test() is part of Jest's serializer API
2
export function test(maybeInspectedElement) {
3
+ if (
4
+ maybeInspectedElement === null ||
5
+ typeof maybeInspectedElement !== 'object'
6
+ ) {
7
+ return false;
8
+ }
9
+
10
+ const hasOwnProperty = Object.prototype.hasOwnProperty.bind(
11
+ maybeInspectedElement,
12
+ );
13
return (
4
- maybeInspectedElement !== null &&
5
- typeof maybeInspectedElement === 'object' &&
6
- maybeInspectedElement.hasOwnProperty('canEditFunctionProps') &&
7
- maybeInspectedElement.hasOwnProperty('canEditHooks') &&
8
- maybeInspectedElement.hasOwnProperty('canToggleSuspense') &&
9
- maybeInspectedElement.hasOwnProperty('canViewSource')
14
+ hasOwnProperty('canEditFunctionProps') &&
15
+ hasOwnProperty('canEditHooks') &&
16
+ hasOwnProperty('canToggleSuspense') &&
17
+ hasOwnProperty('canViewSource')
18
);
19
}
20
packages/react-devtools-shared/src/__tests__/legacy/inspectElement-test.js
+113
-127
@@ -207,133 +207,119 @@ describe('InspectedElementContext', () => {
207
const id = ((store.getElementIDAtIndex(0): any): number);
208
const inspectedElement = await read(id);
209
210
- const {
211
- anonymous_fn,
212
- array_buffer,
213
- array_of_arrays,
214
- big_int,
215
- bound_fn,
216
- data_view,
217
- date,
218
- fn,
219
- html_element,
220
- immutable,
221
- map,
222
- map_of_maps,
223
- object_of_objects,
224
- react_element,
225
- regexp,
226
- set,
227
- set_of_sets,
228
- symbol,
229
- typed_array,
230
- } = inspectedElement.props;
231
-
232
- const {meta} = require('react-devtools-shared/src/hydration');
233
-
234
- expect(anonymous_fn[meta.inspectable]).toBe(false);
235
- expect(anonymous_fn[meta.name]).toBe('function');
236
- expect(anonymous_fn[meta.type]).toBe('function');
237
- expect(anonymous_fn[meta.preview_long]).toBe('ƒ () {}');
238
- expect(anonymous_fn[meta.preview_short]).toBe('ƒ () {}');
239
-
240
- expect(array_buffer[meta.size]).toBe(3);
241
- expect(array_buffer[meta.inspectable]).toBe(false);
242
- expect(array_buffer[meta.name]).toBe('ArrayBuffer');
243
- expect(array_buffer[meta.type]).toBe('array_buffer');
244
- expect(array_buffer[meta.preview_short]).toBe('ArrayBuffer(3)');
245
- expect(array_buffer[meta.preview_long]).toBe('ArrayBuffer(3)');
246
-
247
- expect(array_of_arrays[0][meta.size]).toBe(2);
248
- expect(array_of_arrays[0][meta.inspectable]).toBe(true);
249
- expect(array_of_arrays[0][meta.name]).toBe('Array');
250
- expect(array_of_arrays[0][meta.type]).toBe('array');
251
- expect(array_of_arrays[0][meta.preview_long]).toBe('[Array(3), Array(0)]');
252
- expect(array_of_arrays[0][meta.preview_short]).toBe('Array(2)');
253
-
254
- expect(big_int[meta.inspectable]).toBe(false);
255
- expect(big_int[meta.name]).toBe('123');
256
- expect(big_int[meta.type]).toBe('bigint');
257
-
258
- expect(bound_fn[meta.inspectable]).toBe(false);
259
- expect(bound_fn[meta.name]).toBe('bound exampleFunction');
260
- expect(bound_fn[meta.type]).toBe('function');
261
- expect(bound_fn[meta.preview_long]).toBe('ƒ bound exampleFunction() {}');
262
- expect(bound_fn[meta.preview_short]).toBe('ƒ bound exampleFunction() {}');
263
-
264
- expect(data_view[meta.size]).toBe(3);
265
- expect(data_view[meta.inspectable]).toBe(false);
266
- expect(data_view[meta.name]).toBe('DataView');
267
- expect(data_view[meta.type]).toBe('data_view');
268
-
269
- expect(date[meta.inspectable]).toBe(false);
270
- expect(date[meta.type]).toBe('date');
271
-
272
- expect(fn[meta.inspectable]).toBe(false);
273
- expect(fn[meta.name]).toBe('exampleFunction');
274
- expect(fn[meta.type]).toBe('function');
275
- expect(fn[meta.preview_long]).toBe('ƒ exampleFunction() {}');
276
- expect(fn[meta.preview_short]).toBe('ƒ exampleFunction() {}');
277
-
278
- expect(html_element[meta.inspectable]).toBe(false);
279
- expect(html_element[meta.name]).toBe('DIV');
280
- expect(html_element[meta.type]).toBe('html_element');
281
-
282
- expect(immutable[meta.inspectable]).toBeUndefined(); // Complex type
283
- expect(immutable[meta.name]).toBe('Map');
284
- expect(immutable[meta.type]).toBe('iterator');
285
-
286
- expect(map[meta.inspectable]).toBeUndefined(); // Complex type
287
- expect(map[meta.name]).toBe('Map');
288
- expect(map[meta.type]).toBe('iterator');
289
- expect(map[0][meta.type]).toBe('array');
290
-
291
- expect(map_of_maps[meta.inspectable]).toBeUndefined(); // Complex type
292
- expect(map_of_maps[meta.name]).toBe('Map');
293
- expect(map_of_maps[meta.type]).toBe('iterator');
294
- expect(map_of_maps[0][meta.type]).toBe('array');
295
-
296
- expect(object_of_objects.inner[meta.size]).toBe(3);
297
- expect(object_of_objects.inner[meta.inspectable]).toBe(true);
298
- expect(object_of_objects.inner[meta.name]).toBe('');
299
- expect(object_of_objects.inner[meta.type]).toBe('object');
300
- expect(object_of_objects.inner[meta.preview_long]).toBe(
301
- '{boolean: true, number: 123, string: "abc"}',
302
- );
303
- expect(object_of_objects.inner[meta.preview_short]).toBe('{…}');
304
-
305
- expect(react_element[meta.inspectable]).toBe(false);
306
- expect(react_element[meta.name]).toBe('span');
307
- expect(react_element[meta.type]).toBe('react_element');
308
-
309
- expect(regexp[meta.inspectable]).toBe(false);
310
- expect(regexp[meta.name]).toBe('/abc/giu');
311
- expect(regexp[meta.preview_long]).toBe('/abc/giu');
312
- expect(regexp[meta.preview_short]).toBe('/abc/giu');
313
- expect(regexp[meta.type]).toBe('regexp');
314
-
315
- expect(set[meta.inspectable]).toBeUndefined(); // Complex type
316
- expect(set[meta.name]).toBe('Set');
317
- expect(set[meta.type]).toBe('iterator');
318
- expect(set[0]).toBe('abc');
319
- expect(set[1]).toBe(123);
320
-
321
- expect(set_of_sets[meta.inspectable]).toBeUndefined(); // Complex type
322
- expect(set_of_sets[meta.name]).toBe('Set');
323
- expect(set_of_sets[meta.type]).toBe('iterator');
324
- expect(set_of_sets['0'][meta.inspectable]).toBe(true);
325
-
326
- expect(symbol[meta.inspectable]).toBe(false);
327
- expect(symbol[meta.name]).toBe('Symbol(symbol)');
328
- expect(symbol[meta.type]).toBe('symbol');
329
-
330
- expect(typed_array[meta.inspectable]).toBeUndefined(); // Complex type
331
- expect(typed_array[meta.size]).toBe(3);
332
- expect(typed_array[meta.name]).toBe('Int8Array');
333
- expect(typed_array[meta.type]).toBe('typed_array');
334
- expect(typed_array[0]).toBe(100);
335
- expect(typed_array[1]).toBe(-100);
336
- expect(typed_array[2]).toBe(0);
210
+ expect(inspectedElement.props).toMatchInlineSnapshot(`
211
+ Object {
212
+ "anonymous_fn": Dehydrated {
213
+ "preview_short": ƒ () {},
214
+ "preview_long": ƒ () {},
215
+ },
216
+ "array_buffer": Dehydrated {
217
+ "preview_short": ArrayBuffer(3),
218
+ "preview_long": ArrayBuffer(3),
219
+ },
220
+ "array_of_arrays": Array [
221
+ Dehydrated {
222
+ "preview_short": Array(2),
223
+ "preview_long": [Array(3), Array(0)],
224
+ },
225
+ ],
226
+ "big_int": Dehydrated {
227
+ "preview_short": 123n,
228
+ "preview_long": 123n,
229
+ },
230
+ "bound_fn": Dehydrated {
231
+ "preview_short": ƒ bound exampleFunction() {},
232
+ "preview_long": ƒ bound exampleFunction() {},
233
+ },
234
+ "data_view": Dehydrated {
235
+ "preview_short": DataView(3),
236
+ "preview_long": DataView(3),
237
+ },
238
+ "date": Dehydrated {
239
+ "preview_short": Thu Jan 01 1970 00:00:00 GMT+0000 (Coordinated Universal Time),
240
+ "preview_long": Thu Jan 01 1970 00:00:00 GMT+0000 (Coordinated Universal Time),
241
+ },
242
+ "fn": Dehydrated {
243
+ "preview_short": ƒ exampleFunction() {},
244
+ "preview_long": ƒ exampleFunction() {},
245
+ },
246
+ "html_element": Dehydrated {
247
+ "preview_short": <div />,
248
+ "preview_long": <div />,
249
+ },
250
+ "immutable": Object {
251
+ "0": Dehydrated {
252
+ "preview_short": Array(2),
253
+ "preview_long": ["a", List(3)],
254
+ },
255
+ "1": Dehydrated {
256
+ "preview_short": Array(2),
257
+ "preview_long": ["b", 123],
258
+ },
259
+ "2": Dehydrated {
260
+ "preview_short": Array(2),
261
+ "preview_long": ["c", Map(2)],
262
+ },
263
+ },
264
+ "map": Object {
265
+ "0": Dehydrated {
266
+ "preview_short": Array(2),
267
+ "preview_long": ["name", "Brian"],
268
+ },
269
+ "1": Dehydrated {
270
+ "preview_short": Array(2),
271
+ "preview_long": ["food", "sushi"],
272
+ },
273
+ },
274
+ "map_of_maps": Object {
275
+ "0": Dehydrated {
276
+ "preview_short": Array(2),
277
+ "preview_long": ["first", Map(2)],
278
+ },
279
+ "1": Dehydrated {
280
+ "preview_short": Array(2),
281
+ "preview_long": ["second", Map(2)],
282
+ },
283
+ },
284
+ "object_of_objects": Object {
285
+ "inner": Dehydrated {
286
+ "preview_short": {…},
287
+ "preview_long": {boolean: true, number: 123, string: "abc"},
288
+ },
289
+ },
290
+ "react_element": Dehydrated {
291
+ "preview_short": <span />,
292
+ "preview_long": <span />,
293
+ },
294
+ "regexp": Dehydrated {
295
+ "preview_short": /abc/giu,
296
+ "preview_long": /abc/giu,
297
+ },
298
+ "set": Object {
299
+ "0": "abc",
300
+ "1": 123,
301
+ },
302
+ "set_of_sets": Object {
303
+ "0": Dehydrated {
304
+ "preview_short": Set(3),
305
+ "preview_long": Set(3) {"a", "b", "c"},
306
+ },
307
+ "1": Dehydrated {
308
+ "preview_short": Set(3),
309
+ "preview_long": Set(3) {1, 2, 3},
310
+ },
311
+ },
312
+ "symbol": Dehydrated {
313
+ "preview_short": Symbol(symbol),
314
+ "preview_long": Symbol(symbol),
315
+ },
316
+ "typed_array": Object {
317
+ "0": 100,
318
+ "1": -100,
319
+ "2": 0,
320
+ },
321
+ }
322
+ `);
323
});
324
325
it('should support objects with no prototype', async () => {
packages/react-devtools-shared/src/__tests__/treeContextStateSerializer.js
+4
-3
@@ -6,11 +6,12 @@ export function test(maybeState) {
6
return false;
7
}
8
9
+ const hasOwnProperty = Object.prototype.hasOwnProperty.bind(maybeState);
10
// Duck typing at its finest.
11
return (
11
- maybeState.hasOwnProperty('inspectedElementID') &&
12
- maybeState.hasOwnProperty('ownerFlatTree') &&
13
- maybeState.hasOwnProperty('ownerSubtreeLeafElementID')
12
+ hasOwnProperty('inspectedElementID') &&
13
+ hasOwnProperty('ownerFlatTree') &&
14
+ hasOwnProperty('ownerSubtreeLeafElementID')
15
);
16
}
17
scripts/jest/config.base.js
+1
@@ -1,6 +1,7 @@
1
'use strict';
2
3
module.exports = {
4
+ globalSetup: require.resolve('./setupGlobal.js'),
5
haste: {
6
hasteImplModulePath: require.resolve('./noHaste.js'),
7
},
scripts/jest/setupGlobal.js
new
+7
@@ -0,0 +1,7 @@
1
+/* eslint-disable */
2
+
3
+module.exports = () => {
4
+ // can use beforeEach/afterEach or setupEnvironment.js in node >= 13: https://github.com/nodejs/node/pull/20026
5
+ // jest's `setupFiles` is too late: https://stackoverflow.com/a/56482581/3406963
6
+ process.env.TZ = 'UTC';
7
+};