/
detectFiberTags.jsx
101 lines (96 loc) · 3.07 KB
/
detectFiberTags.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
import React from 'react';
import ReactDOM from 'react-dom';
function getFiber(element) {
const container = global.document.createElement('div');
let inst = null;
class Tester extends React.Component {
render() {
inst = this;
return element;
}
}
ReactDOM.render(React.createElement(Tester), container);
return inst._reactInternalFiber.child;
}
function getLazyFiber(LazyComponent) {
const container = global.document.createElement('div');
let inst = null;
// eslint-disable-next-line react/prefer-stateless-function
class Tester extends React.Component {
render() {
inst = this;
return (
<LazyComponent />
);
}
}
// eslint-disable-next-line react/prefer-stateless-function
class SuspenseWrapper extends React.Component {
render() {
return (
<React.Suspense fallback={false}>
<Tester />
</React.Suspense>
);
}
}
ReactDOM.render(React.createElement(SuspenseWrapper), container);
return inst._reactInternalFiber.child;
}
module.exports = function detectFiberTags() {
const supportsMode = typeof React.StrictMode !== 'undefined';
const supportsContext = typeof React.createContext !== 'undefined';
const supportsForwardRef = typeof React.forwardRef !== 'undefined';
const supportsSuspense = typeof React.Suspense !== 'undefined';
const supportsLazy = typeof React.lazy !== 'undefined';
function Fn() {
return null;
}
// eslint-disable-next-line react/prefer-stateless-function
class Cls extends React.Component {
render() {
return null;
}
}
let Ctx = null;
let FwdRef = null;
let LazyComponent = null;
if (supportsContext) {
Ctx = React.createContext();
}
if (supportsForwardRef) {
// React will warn if we don't have both arguments.
// eslint-disable-next-line no-unused-vars
FwdRef = React.forwardRef((props, ref) => null);
}
if (supportsLazy) {
LazyComponent = React.lazy(() => import('./_helpers/dynamicImportedComponent'));
}
return {
HostRoot: getFiber('test').return.return.tag, // Go two levels above to find the root
ClassComponent: getFiber(React.createElement(Cls)).tag,
Fragment: getFiber([['nested']]).tag,
FunctionalComponent: getFiber(React.createElement(Fn)).tag,
HostPortal: getFiber(ReactDOM.createPortal(null, global.document.createElement('div'))).tag,
HostComponent: getFiber(React.createElement('span')).tag,
HostText: getFiber('text').tag,
Mode: supportsMode
? getFiber(React.createElement(React.StrictMode)).tag
: -1,
ContextConsumer: supportsContext
? getFiber(React.createElement(Ctx.Consumer, null, () => null)).tag
: -1,
ContextProvider: supportsContext
? getFiber(React.createElement(Ctx.Provider, { value: null })).tag
: -1,
ForwardRef: supportsForwardRef
? getFiber(React.createElement(FwdRef)).tag
: -1,
Suspense: supportsSuspense
? getFiber(React.createElement(React.Suspense, { fallback: false })).tag
: -1,
Lazy: supportsLazy
? getLazyFiber(LazyComponent).tag
: -1,
};
};