Skip to content

Commit

Permalink
Fix junk in React warnings in Logbox (#44812)
Browse files Browse the repository at this point in the history
Summary:
Before all React errors showed junk like this:

![Screenshot 2024-06-06 at 06 24 38](https://github.com/facebook/react-native/assets/810438/40be3133-e31d-43e8-b04d-ffbc5b462027)

This is because `isComponentStack` detected a component stack but `parseComponentStack` couldn't actually parse it (it doesn't deal with React's current format like `in Foo (created by FeedItemInner)`) so `componentStack` was an empty array, resulting in the next block of code pushing stuff into `argsWithoutComponentStack` _again_, thus repeating its args.

The fix is not to do that. Result on my local copy:

![Screenshot 2024-06-06 at 06 24 24](https://github.com/facebook/react-native/assets/810438/8f3d32d9-6f28-472c-be34-c802a0e2f161)

Ofc this doesn't actually show the component stack but that was broken before too.

I edited in-place in my `node_modules` so I haven't verified this 100% works on main.

Hope this is useful!

## Changelog:

[General] [Fixed] - Remove accidental duplication in React warnings in Logbox

Pull Request resolved: #44812

Reviewed By: cortinico

Differential Revision: D58240357

Pulled By: rickhanlonii

fbshipit-source-id: b6ecb659d3b393e497caf5e7b2087a8e529f1b28
  • Loading branch information
gaearon authored and facebook-github-bot committed Jun 11, 2024
1 parent 2a0a112 commit 32c3cd3
Show file tree
Hide file tree
Showing 2 changed files with 31 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,36 @@ describe('parseLogBoxLog', () => {
});
});

it('does not duplicate message if component stack found but not parsed', () => {
expect(
parseLogBoxLog([
'Warning: Each child in a list should have a unique "key" prop.%s%s See https://fb.me/react-warning-keys for more information.%s',
'\n\nCheck the render method of `MyOtherComponent`.',
'',
'\n in\n in\n in',
]),
).toEqual({
componentStackType: 'legacy',
componentStack: [],
category:
'Warning: Each child in a list should have a unique "key" prop.%s%s See https://fb.me/react-warning-keys for more information.',
message: {
content:
'Warning: Each child in a list should have a unique "key" prop.\n\nCheck the render method of `MyOtherComponent`. See https://fb.me/react-warning-keys for more information.',
substitutions: [
{
length: 48,
offset: 62,
},
{
length: 0,
offset: 110,
},
],
},
});
});

it('detects a component stack in an interpolated warning', () => {
expect(
parseLogBoxLog([
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -462,7 +462,7 @@ export function parseLogBoxLog(args: $ReadOnlyArray<mixed>): {|
}
}

if (componentStack.length === 0) {
if (componentStack.length === 0 && argsWithoutComponentStack.length === 0) {
// Try finding the component stack elsewhere.
for (const arg of args) {
if (typeof arg === 'string' && isComponentStack(arg)) {
Expand Down

0 comments on commit 32c3cd3

Please sign in to comment.