Skip to content

Commit 1bbf3b8

Browse files
committed
Remove console patching section
It's just a (bad) polyfill for what RDT is doing. Better to lean on RDT for owner stacks in console calls.
1 parent bc61346 commit 1bbf3b8

File tree

1 file changed

+0
-99
lines changed

1 file changed

+0
-99
lines changed

src/content/reference/react/captureOwnerStack.md

Lines changed: 0 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -188,105 +188,6 @@ Check out the following example to see how to use `captureOwnerStack` to improve
188188
- [createRoot usage: Displaying Error Boundary errors](/reference/react-dom/client/createRoot#show-a-dialog-for-uncaught-errors)
189189
- [createRoot usage: Displaying a dialog for recoverable errors](/reference/react-dom/client/createRoot#displaying-a-dialog-for-recoverable-errors)
190190

191-
### Expanding error stacks {/*expanding-error-stacks*/}
192-
193-
In addition to the <CodeStep step={1}>stack trace of the error</CodeStep> itself, you can use <CodeStep step={2}>`captureOwnerStack`</CodeStep> to append the Owner Stack.
194-
This can help trace the error especially when the error is caused by props. The Owner Stack helps trace the flow of props.
195-
196-
197-
```js src/index.js [[1, 8, "error.stack"], [2, 7, "captureOwnerStack()"]]
198-
import {captureOwnerStack} from 'react';
199-
import {createRoot} from 'react-dom/client';
200-
201-
const root = createRoot(document.getElementById('root'), {
202-
onUncaughtError: (error, errorInfo) => {
203-
if (process.env.NODE_ENV !== 'production') {
204-
const ownerStack = captureOwnerStack();
205-
error.stack += ownerStack;
206-
}
207-
208-
console.error('Uncaught', error);
209-
},
210-
}).render(<App />);
211-
```
212-
213-
<Sandpack>
214-
215-
```js
216-
function useCustomHook() {
217-
throw new Error('Boom!');
218-
}
219-
220-
function Component() {
221-
useCustomHook();
222-
}
223-
224-
export default function App() {
225-
return <Component />;
226-
}
227-
```
228-
229-
```js src/index.js
230-
import {captureOwnerStack} from 'react';
231-
import {createRoot} from 'react-dom/client';
232-
import App from './App.js';
233-
import './styles.css';
234-
235-
const root = createRoot(document.getElementById('root'), {
236-
onUncaughtError: (error, errorInfo) => {
237-
if (process.env.NODE_ENV !== 'production') {
238-
const ownerStack = captureOwnerStack();
239-
error.stack =
240-
// The stack is only split because these sandboxes don't implement
241-
// ignore-listing 3rd party frames via sourcemaps.
242-
// A framework would ignore-list stackframes from React via sourcemaps
243-
// and then you could just `error.stack += ownerStack`.
244-
// To learn more about ignore-listing see https://developer.chrome.com/docs/devtools/x-google-ignore-list
245-
error.stack.split('\n at react-stack-bottom-frame')[0] + ownerStack;
246-
}
247-
248-
// The stacks are logged instead of showing them in the UI directly to
249-
// highlight that browsers will apply sourcemaps to the logged stacks.
250-
// Note that sourcemapping is only applied in the real browser console not
251-
// in the fake one displayed on this page.
252-
console.error('Uncaught', error);
253-
},
254-
}).render(<App />);
255-
```
256-
257-
```json package.json hidden
258-
{
259-
"dependencies": {
260-
"react": "experimental",
261-
"react-dom": "experimental",
262-
"react-scripts": "latest"
263-
},
264-
"scripts": {
265-
"start": "react-scripts start",
266-
"build": "react-scripts build",
267-
"test": "react-scripts test --env=jsdom",
268-
"eject": "react-scripts eject"
269-
}
270-
}
271-
```
272-
273-
```html public/index.html hidden
274-
<!DOCTYPE html>
275-
<html lang="en">
276-
<head>
277-
<meta charset="UTF-8" />
278-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
279-
<title>Document</title>
280-
</head>
281-
<body>
282-
<p>Check the console output.</p>
283-
<div id="root"></div>
284-
</body>
285-
</html>
286-
```
287-
288-
</Sandpack>
289-
290191
## Troubleshooting {/*troubleshooting*/}
291192

292193
### The Owner Stack is `null` {/*the-owner-stack-is-null*/}

0 commit comments

Comments
 (0)