Skip to content

Commit a2aa270

Browse files
sebmarkbagesebmarkbage
committed
Fixture
1 parent 223d153 commit a2aa270

File tree

7 files changed

+169
-0
lines changed

7 files changed

+169
-0
lines changed

‎fixtures/stacks/BabelClass-compiled.js

Lines changed: 25 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎fixtures/stacks/BabelClass-compiled.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎fixtures/stacks/BabelClass.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
// Compile this with Babel.
2+
// babel --config-file ./babel.config.json BabelClass.js --out-file BabelClass-compiled.js --source-maps
3+
4+
class BabelClass extends React.Component {
5+
render() {
6+
return this.props.children;
7+
}
8+
}

‎fixtures/stacks/Component.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// Example
2+
3+
const Throw = React.lazy(() => {
4+
throw new Error('Example');
5+
});
6+
7+
const Component = React.memo(function Component({children}) {
8+
return children;
9+
});
10+
11+
function DisplayName({children}) {
12+
return children;
13+
}
14+
DisplayName.displayName = 'Custom Name';
15+
16+
class NativeClass extends React.Component {
17+
render() {
18+
return this.props.children;
19+
}
20+
}

‎fixtures/stacks/Example.js

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
// Example
2+
3+
const x = React.createElement;
4+
5+
class ErrorBoundary extends React.Component {
6+
static getDerivedStateFromError(error) {
7+
return {
8+
error: error,
9+
};
10+
}
11+
12+
componentDidCatch(error, errorInfo) {
13+
console.log(error.message, errorInfo.componentStack);
14+
this.setState({
15+
componentStack: errorInfo.componentStack,
16+
});
17+
}
18+
19+
render() {
20+
if (this.state && this.state.error) {
21+
return x(
22+
'div',
23+
null,
24+
x('h3', null, this.state.error.message),
25+
x('pre', null, this.state.componentStack)
26+
);
27+
}
28+
return this.props.children;
29+
}
30+
}
31+
32+
function Example() {
33+
let state = React.useState(false);
34+
return x(
35+
ErrorBoundary,
36+
null,
37+
x(
38+
DisplayName,
39+
null,
40+
x(
41+
React.SuspenseList,
42+
null,
43+
x(
44+
NativeClass,
45+
null,
46+
x(
47+
BabelClass,
48+
null,
49+
x(
50+
React.Suspense,
51+
null,
52+
x('div', null, x(Component, null, x(Throw)))
53+
)
54+
)
55+
)
56+
)
57+
)
58+
);
59+
}

‎fixtures/stacks/babel.config.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"plugins": [
3+
["@babel/plugin-transform-classes", {"loose": true}]
4+
]
5+
}

‎fixtures/stacks/index.html

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Component Stacks</title>
6+
<style>
7+
html, body {
8+
margin: 20px;
9+
}
10+
pre {
11+
background: #eee;
12+
border: 1px solid #ccc;
13+
padding: 2px;
14+
}
15+
</style>
16+
</head>
17+
<body>
18+
<div id="container">
19+
<p>
20+
To install React, follow the instructions on
21+
<a href="https://github.com/facebook/react/">GitHub</a>.
22+
</p>
23+
<p>
24+
If you can see this, React is <strong>not</strong> working right.
25+
If you checked out the source from GitHub make sure to run <code>npm run build</code>.
26+
</p>
27+
</div>
28+
<script src="../../build/node_modules/react/umd/react.production.min.js"></script>
29+
<script src="../../build/node_modules/react-dom/umd/react-dom.production.min.js"></script>
30+
<script src="./Component.js"></script>
31+
<script src="./BabelClass-compiled.js"></script>
32+
<script src="./Example.js"></script>
33+
<script>
34+
const container = document.getElementById("container");
35+
ReactDOM.render(React.createElement(Example), container);
36+
</script>
37+
<h3>The above stack should look something like this:</h3>
38+
<pre>
39+
40+
at Lazy
41+
at Component (/stacks/Component.js:7:50)
42+
at div
43+
at Suspense
44+
at BabelClass (/stacks/BabelClass-compiled.js:13:29)
45+
at NativeClass (/stacks/Component.js:16:1)
46+
at SuspenseList
47+
at Custom Name (/stacks/Component.js:11:23)
48+
at ErrorBoundary (/stacks/Example.js:5:1)
49+
at Example (/stacks/Example.js:33:21)</pre>
50+
</body>
51+
</html>

0 commit comments

Comments
 (0)