How to use ReactDOMComponent method in Playwright Internal

1import React from 'react';
2import {storiesOf} from '@storybook/react';
3import {withInfo} from '@storybook/addon-info';
4
5import SplitDiff from 'app/components/splitDiff';
6
7const base = `RangeError: Invalid array length
8  at Constructor.render(./app/components/scoreBar.jsx:73:0)
9  at ? (~/react/lib/ReactCompositeComponent.js:793:0)
10  at measureLifeCyclePerf(~/react/lib/ReactCompositeComponent.js:74:0)
11  at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext(~/react/lib/ReactCompositeComponent.js:792:0)
12  at ReactCompositeComponentWrapper._renderValidatedComponent(~/react/lib/ReactCompositeComponent.js:819:0)
13  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:361:0)
14  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
15  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
16  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
17  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
18  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
19  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
20  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
21  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
22  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
23  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
24  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
25  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
26  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
27  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
28  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
29  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
30  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
31  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
32  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
33  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
34  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
35  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
36  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
37  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
38  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
39  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
40  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
41  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:122:0)
42  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
43  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
44  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
45  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
46  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
47  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
48  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
49  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:110:0)
50  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
51  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
52  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
53  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
54  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
55  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
56  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
57  at ReactCompositeComponentWrapper._updateRenderedComponent(~/react/lib/ReactCompositeComponent.js:751:0)`;
58
59const target = `TypeError: Cannot read property 'id' of undefined
60  at StreamGroupHeader.render(./app/components/stream/StreamGroupHeader.jsx:54:0)
61  at ? (~/react/lib/ReactCompositeComponent.js:793:0)
62  at measureLifeCyclePerf(~/react/lib/ReactCompositeComponent.js:74:0)
63  at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext(~/react/lib/ReactCompositeComponent.js:792:0)
64  at ReactCompositeComponentWrapper._renderValidatedComponent(~/react/lib/ReactCompositeComponent.js:819:0)
65  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:361:0)
66  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
67  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
68  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
69  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
70  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
71  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
72  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
73  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
74  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
75  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
76  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
77  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
78  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
79  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
80  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
81  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
82  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
83  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:122:0)
84  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
85  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
86  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
87  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
88  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
89  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
90  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
91  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:110:0)
92  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
93  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
94  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
95  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
96  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
97  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
98  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
99  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:110:0)
100  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
101  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
102  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
103  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
104  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
105  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
106  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
107  at ReactCompositeComponentWrapper._updateRenderedComponent(~/react/lib/ReactCompositeComponent.js:751:0)
108  at ReactCompositeComponentWrapper._performComponentUpdate(~/react/lib/ReactCompositeComponent.js:721:0)
109  at ReactCompositeComponentWrapper.updateComponent(~/react/lib/ReactCompositeComponent.js:642:0)`;
110
111storiesOf('Other|SplitDiff', module).add(
112  'SplitDiff',
113  withInfo('Diffs two strings, split by newlines if present')(() => (
114    <SplitDiff base={base} target={target} />
115  ))
116);
117

Source: splitDiff.stories.js

import React from 'react';
import {storiesOf} from '@storybook/react';
import {withInfo} from '@storybook/addon-info';

import SplitDiff from 'app/components/splitDiff';

const base = `RangeError: Invalid array length
  at Constructor.render(./app/components/scoreBar.jsx:73:0)
  at ? (~/react/lib/ReactCompositeComponent.js:793:0)
  at measureLifeCyclePerf(~/react/lib/ReactCompositeComponent.js:74:0)
  at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext(~/react/lib/ReactCompositeComponent.js:792:0)
  at ReactCompositeComponentWrapper._renderValidatedComponent(~/react/lib/ReactCompositeComponent.js:819:0)
  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:361:0)
  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:122:0)
  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:110:0)
  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
  at ReactCompositeComponentWrapper._updateRenderedComponent(~/react/lib/ReactCompositeComponent.js:751:0)`;

const target = `TypeError: Cannot read property 'id' of undefined
  at StreamGroupHeader.render(./app/components/stream/StreamGroupHeader.jsx:54:0)
  at ? (~/react/lib/ReactCompositeComponent.js:793:0)
  at measureLifeCyclePerf(~/react/lib/ReactCompositeComponent.js:74:0)
  at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext(~/react/lib/ReactCompositeComponent.js:792:0)
  at ReactCompositeComponentWrapper._renderValidatedComponent(~/react/lib/ReactCompositeComponent.js:819:0)
  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:361:0)
  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactCompositeComponentWrapper.performInitialMount(~/react/lib/ReactCompositeComponent.js:370:0)
  at ReactCompositeComponentWrapper.mountComponent(~/react/lib/ReactCompositeComponent.js:257:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at ReactDOMComponent.mountChildren(~/react/lib/ReactMultiChild.js:240:0)
  at ReactDOMComponent._createInitialChildren(~/react/lib/ReactDOMComponent.js:699:0)
  at ReactDOMComponent.mountComponent(~/react/lib/ReactDOMComponent.js:524:0)
  at Object.mountComponent(~/react/lib/ReactReconciler.js:47:0)
  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:122:0)
  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:110:0)
  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
  at Object.updateChildren(~/react/lib/ReactChildReconciler.js:110:0)
  at ReactDOMComponent._reconcilerUpdateChildren(~/react/lib/ReactMultiChild.js:210:0)
  at ReactDOMComponent._updateChildren(~/react/lib/ReactMultiChild.js:314:0)
  at ReactDOMComponent.updateChildren(~/react/lib/ReactMultiChild.js:301:0)
  at ReactDOMComponent._updateDOMChildren(~/react/lib/ReactDOMComponent.js:942:0)
  at ReactDOMComponent.updateComponent(~/react/lib/ReactDOMComponent.js:760:0)
  at ReactDOMComponent.receiveComponent(~/react/lib/ReactDOMComponent.js:718:0)
  at Object.receiveComponent(~/react/lib/ReactReconciler.js:126:0)
  at ReactCompositeComponentWrapper._updateRenderedComponent(~/react/lib/ReactCompositeComponent.js:751:0)
  at ReactCompositeComponentWrapper._performComponentUpdate(~/react/lib/ReactCompositeComponent.js:721:0)
  at ReactCompositeComponentWrapper.updateComponent(~/react/lib/ReactCompositeComponent.js:642:0)`;

storiesOf('Other|SplitDiff', module).add(
  'SplitDiff',
  withInfo('Diffs two strings, split by newlines if present')(() => (
    <SplitDiff base={base} target={target} />
  ))
);