Commit Graph

66 Commits

Author SHA1 Message Date
Rick Hanlon 178f126d83 Parse any babel codeframe error as syntax error
Summary:
## Overview

This diff adds handling for syntax errors created using `buildCodeFrameError` which have a slightly different format than syntax errors thrown during transforms.

Changelog: [Internal]

Reviewed By: yungsters

Differential Revision: D18658502

fbshipit-source-id: 0836f2c16cdd57c10ed1e03dc7345d8e1ccf53f3
2019-11-27 09:25:04 -08:00
Rick Hanlon a64e5bc251 LogBox - Use Modal for full screen inspector
Summary:
This diff switches LogBox over to use a Modal component so that the log inspector is always full screen.

In order to do that, it needed to add an `internal_excludeLogBox` flag to AppContainer so that it's not recursively rendered  as: AppContainer -> LogBox -> Modal -> AppContainer. Not thrilled about the prop but it's necessary for now until this is rendered as it's own root (which we're working on next).

Changelog: [Internal]

Reviewed By: rubennorte

Differential Revision: D18461394

fbshipit-source-id: e1a80dfffbbe6c5467ac6f8d3c445a3280829020
2019-11-27 08:27:31 -08:00
Christoph Nakazawa 03766d6a08 Remove unnecessary whitespace from code frames
Summary:
This removes common whitespace from a code frame to show more code. This is especially useful for heavily intended code that may not even be visible in the small window.

I am not 100% confident I wrote the right code because I'm under time pressure but it seems to work. I'm an intern and it's my last day.

Changelog: [Internal]

(Note: this ignores all push blocking failures!)

Reviewed By: rickhanlonii

Differential Revision: D18657572

fbshipit-source-id: 6b93999c4482891f2123d67005843ce5db0d2976
2019-11-22 09:09:10 -08:00
Christoph Nakazawa 89be2d00ea Remove the vertical bar next to the code frame
Summary:
This vertical bar doesn't really add any value. This diff removes it. At first I tried to use regex but ansi codes make that hard. We can just use the structured data and rely on the fact that the second item is always the one with the vertical bar.

(Note: this ignores all push blocking failures!)

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18656911

fbshipit-source-id: b72d4c93d0008c7da54647d072a4c4eb7646b694
2019-11-22 09:09:09 -08:00
Christoph Nakazawa 16e72ad370 Syntax highlighting for LogBox Code Frames
Summary:
This diff adds syntax highlighting to LogBox CodeFrames. It works by turning Ansi codes into "JSON" (it's actually just a JS object but the third-party API uses JSON as terminology) and then turning that into `<Text>` elements.

The syntax theme is called Afterglow and I took it from https://iterm2colorschemes.com/. Happy for anyone who wants to further tweak it! I installed this into iTerm and extracted the colors from there as it has a color picker and the labels directly map to the color classes exposed by the `anser` package.

Changelog: [Internal]

(Note: this ignores all push blocking failures!)

Reviewed By: rickhanlonii

Differential Revision: D18618897

fbshipit-source-id: 64815619fc482e08b5671f492dabda8c8c0ceca5
2019-11-22 09:09:09 -08:00
Rick Hanlon 4ad5d1c473 LogBox - Clear selectedIndex when logs are cleared
Summary:
This diff fixes an exception thrown when using fast refresh when a log is opened.

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18656859

fbshipit-source-id: 707f71f627daa172a4f9e02e3ff5d05b6174eb63
2019-11-22 05:49:54 -08:00
Rick Hanlon 0d994df04d LogBox - Add ReferenceError to transform error regex
Summary:
Adds handling for reference errors so when we throw them in the next diff they're handled as syntax errors.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18644642

fbshipit-source-id: 2b751578c616c27d5b1ec6255aca56063bfd9d16
2019-11-22 04:24:17 -08:00
George Zahariev 8553e1acc4 Exact-by-default codemod for react-native-github
Summary:
We are rolling out exact-by-default syntax to xplat/js.

I had to manually move around some comments to preserve proper placement.

Changelog: [Internal]

Reviewed By: jbrown215

Differential Revision: D18633611

fbshipit-source-id: 48f7468dcc55b1d00985419d035a61c6820b3abe
2019-11-21 09:42:57 -08:00
Rick Hanlon 93b892cac6 Don't allow pressing on un-symbolicated stackframes (reland)
Summary:
Re-land [RN DevX] Don't allow pressing on un-symbolicated stackframes

Changelog: [Internal]

Reviewed By: TheSavior

Differential Revision: D18628349

fbshipit-source-id: 22d6b931b0ad09976b80aa6b90f10bffa6a4a46c
2019-11-21 06:16:42 -08:00
Eli White 9b53f52236 Revert D18577288: Don't allow pressing on un-symbolicated stackframes
Differential Revision:
D18577288

Original commit changeset: 6de322b47558

fbshipit-source-id: 095766e07a43008abf5fc6adb0f46bb08fc420a0
2019-11-20 15:51:06 -08:00
Christoph Nakazawa 1e0e9582ab Improve rendering perf of LogBoxInspectorStackFrame
Summary:
LogBox tends to take a bit of time to open after tapping a log banner. This is very noticeable on Android where it takes multiple seconds.

When looking at React DevTools, the Stack Frame code can be responsible for two thirds of total LogBox rendering time. With this diff, the time is reduced from about 46ms to 25ms, and the total time spent rendering LogBox is reduced by one third.

This diff makes a few micro-optimizations but primarily it gets rid of an unnecessary View and collapses multiple text components into a single one as they are all rendered the same. Note that this also fixes an issue in the case where a line number may be missing but a column was provided. While I can't think of a case where that would actually happen, previously it would print the column (which could be mistaken for the lineNumber in that case) but now it prints the column only if the line Number is also present.

Changelog: [Internal]

Reviewed By: rickhanlonii

Differential Revision: D18613899

fbshipit-source-id: 5c6a3b65b749d5f95058b34ded6cc12531d91c38
2019-11-20 11:24:15 -08:00
Rick Hanlon 55cb6ab07c Don't allow pressing on un-symbolicated stackframes
Summary:
This diff makes a few improvements to the call stack / symbolication process:

- Removes button from unsymbolicated stack frames
- Adds a warning message for missing features without symbolication
- Reduces symbolication requests (we were re-requesting stacks when they were pending)
- Speeds up opening unsymbolicated logs (because we were re-requesting them, the components were updating a lot)

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18577288

fbshipit-source-id: 6de322b4755895e2d1599b06100a61e64f7ec023
2019-11-20 11:05:20 -08:00
Rick Hanlon bdd1a675ba Dismiss all logs on fast refresh
Summary:
Based on feedback we're going to clear all logs on fast refresh 👍

Changelog: [Internal]

Reviewed By: gaearon

Differential Revision: D18614230

fbshipit-source-id: 119a09e8ffea9d86137583d8da435338833f910c
2019-11-20 08:50:49 -08:00
Rick Hanlon 6db52c5fe0 LogBox - Add app version and move meta info
Summary:
This diff adds a new API `setAppInfo` to add app version and engine to LogBox and changes the way they're displayed so that they're more subtle and visible for screenshots.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18592992

fbshipit-source-id: 1c57b21fa9dca93029ffc92acf1287f3ee247f4d
2019-11-19 09:36:28 -08:00
Rick Hanlon b346970016 LogBox - Minor error message formatting fixes
Summary:
Adds better handling of component stacks for warnings and clarifies why we ignore `(ADVICE)` warnings.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18575693

fbshipit-source-id: f4eacbf74c62cd079f2c441951849fb03e0941dd
2019-11-18 13:47:42 -08:00
Rick Hanlon 9c4afce70f LogBox - Move and improve 'see more' button
Summary:
Feedback from multiple people has been that the "see more" is hard to discover and that it should be at the bottom left, so this diff moves it there.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18487041

fbshipit-source-id: 1543c54e1de5fa16fa5b2e427812b6e72977bfb2
2019-11-15 06:11:08 -08:00
Rick Hanlon 63b534a745 LogBox - Improve stack frame pressables and counts
Summary:
This diff makes number of improvements to stack frames:

- Adds padding around stack frame pressables
- Fixed wrapping for the closing bracket on component stacks
- Adds passing around "see more" buttons
- Fixed the count for "Show x more frames" when it's 0 and otherwise
- Add more cases for the count text
- Switches button back to minimize (snuck this in here)

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18495331

fbshipit-source-id: 8b9efa88c4205b23e734893d8db6deccce88344c
2019-11-14 04:48:55 -08:00
Rick Hanlon a0d2cd3d13 LogBox - Fix message content rendering in notifications
Summary:
Strips "Error: " and "Warning: " from the log notification.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18491963

fbshipit-source-id: 7c9d18638eee442d521a9aa2135ce6891c673cbe
2019-11-14 04:43:27 -08:00
Rick Hanlon ab751f5c45 LogBox - Add ReactNativeWarningFilter
Summary: Changelog: [Internal]

Differential Revision: D18492212

fbshipit-source-id: 81234c532cdcc8935a0c532950398bc84aa6d4d1
2019-11-13 18:29:47 -08:00
Rick Hanlon 80b4919d77 LogBox - Title render errors "Render Error"
Summary:
This diff changes LogBox to say "Render Error" instead of "Fatal Error" for errors thrown in render.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18466237

fbshipit-source-id: 737759f3febb937f70698dae5f1b1617e233fc98
2019-11-13 11:33:38 -08:00
Rick Hanlon 8335ebaeab Add support for isRenderError
Summary:
This diff adds `isRenderError` to the Log data, and refactors the LogBoxLog object to accept an object in the constructor instead of adding the 7th argument. No visual updates as those are in the next diff.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18466192

fbshipit-source-id: e38ef9032b8074abbc7b40cbe7a84d45285944c4
2019-11-13 11:33:38 -08:00
Rick Hanlon 75deeb32fe LogBox - Errors thrown in render are fatals
Summary:
The React team wants exceptions thrown during render to pop over the screen as fatals.

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18439258

fbshipit-source-id: dded7b9d93271c1a4eff682be521c7567dfe7d7e
2019-11-13 11:33:37 -08:00
Rick Hanlon 687d3f438f LogBox - Fix animation for source map failure
Summary:
Fixes an issue where the icon for failed source maps would spin like the pending icon.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18479027

fbshipit-source-id: 07c428239122f3f4a8a58dcd8faf09e54170d45b
2019-11-13 10:04:44 -08:00
Rick Hanlon 5427211a00 LogBox - Dismiss keyboard when the inspector opens
Summary:
If the keyboard is open when the inspector pops open, dismiss it.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18468221

fbshipit-source-id: 0d51fa90824ed8bef6a3b6e813013fa3c2a4bbda
2019-11-13 09:39:50 -08:00
Rick Hanlon 390546f6ed Increase hitslop for notification dismiss button
Summary:
This diff increases the hit slop for the close button to dismiss the notifications.

Changelog: [Internal]

Differential Revision: D18438192

fbshipit-source-id: e671ec06c69f52f83c7dda87118ca1d2426e993b
2019-11-11 16:16:03 -08:00
Rick Hanlon a9ffad446a LogBox - Better design for stacks
Summary:
This diff makes minor style improvements and refactors to stack frame displays, primarily:
- Adding brackets around react components
- Uses a monospace font for the code
- Changing section titles to "Components" and "Call stack"
- Refactors the section headers to a single component and reduces the text size of headings
- Removes the query string from unsymbolicated stacks

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18433487

fbshipit-source-id: 7914b5810a4303e9a0d52def92e524b9e72f79ed
2019-11-11 16:12:44 -08:00
Rick Hanlon c1d9a1f099 LogBox - Add support for filtering warnings
Summary:
This diff adds the ability to set a custom warning filter function.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18422114

fbshipit-source-id: a2949a013f478093a2fabc003c496353b8fdbc3a
2019-11-11 16:12:43 -08:00
Rick Hanlon 619a17e34b LogBox - Speed up popping fatal errors
Summary:
This diff add proper optimistic symbolication loading to fatal errors that are popped open, improving both raw performance and perceived performance of fatal logboxes.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18421259

fbshipit-source-id: 2c96a96522d6d199fecd828144799c96437c3d28
2019-11-11 16:12:43 -08:00
Rick Hanlon fe82f402a9 LogBox - Rework how fatals and syntax errors are handled
Summary:
This diff makes a few changes to how errors and warnings are handled in LogBox:

- Soft errors continue to notify the user collapsed.
- Fatal errors pop up full screen over the content, but are dismissible.
- Syntax errors pop up full screen, and are **not** dismissible.
- Removed the "Reload" button on fatals, and added back the dismiss/close.
- Removed all buttons from syntax errors so users are encouraged to fix it and safe without reloading.

To do this we needed to:
- Move the selectedLogIndex state out of the component and up to the rest of the log state.
- Change the way popping a log works, it's now done by setting selectedLogIndex at log time instead of deriving it at render time, that means `selectedLogIndex` is now the sole state value for deciding if the log inspector is open or not
- Whenever the state is updated, find a syntax error if it's there, instead of doing this at render time

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18421089

fbshipit-source-id: d2c4937f666f1302ed1a7b1b9c6679b0509136c5
2019-11-11 16:12:43 -08:00
Rick Hanlon 28a3b25c31 LogBox - Display code frame column number correctly
Summary:
Code frame columns are returned 0 based but displayed in editors 1 based, this diff bumps the column we display by one to match.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18426163

fbshipit-source-id: 2c6aefb6fe7ce161cd768b6748b7739d486ed438
2019-11-11 07:40:09 -08:00
Christoph Nakazawa fa4f23e4e8 Add codeFrame to each warning and error in LogBox
Summary:
This diff changes the LogBox to show the code frame for the first non-collapsed stack frame. Let me know what you think about this change!

Changelog: [Internal] LogBox changes

Reviewed By: rickhanlonii

Differential Revision: D18372456

fbshipit-source-id: ddf6d6c53ab28d11d8355f4cb1cb071a00a7366e
2019-11-08 08:31:01 -08:00
Rick Hanlon 5eddf1d79a LogBox - Show native redbox when failing to handle logs in LogBox
Summary:
This diff adds error handling to logbox so that if there is an error either when parsing logs or when rendering LogBox, we show a native redbox with the error that was thrown and a message explaining that it's an internal React Native error.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18394788

fbshipit-source-id: 5d74d58e4b28ef6d863079e83677fb23ef4ccb34
2019-11-08 07:41:09 -08:00
Rick Hanlon 7ad862eaba LogBox - Press to open code frame file
Summary:
This diff adds the ability to press the file name of a code frame to open the file in your editor.

Note: I re-worked the frame location to extract the frame row and column at parse time so that we don't need to do any clowny regexes down stream.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18358283

fbshipit-source-id: 705e07d229c66ecfd225a8fb65ef2f78b5034c9c
2019-11-07 09:11:59 -08:00
Rick Hanlon 83401adeae LogBox - Add platform and dim text in meta
Summary:
This diff adds more information to the meta area so it doesn't look so empty and dims the text so it doesn't jump out so much.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18360434

fbshipit-source-id: d460ffd59ef032d89879f88e309ac81e6d862c30
2019-11-07 08:48:05 -08:00
Rick Hanlon f1a11b6ce4 LogBox - Rename and re-order dismiss/minimize buttons
Summary:
Based on feedback "minimize" wasn't clear and "close" is more common so it should be on the right

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18353907

fbshipit-source-id: bccfc9be6c225a9adb31ef11d6a91330a7d4e008
2019-11-07 06:32:01 -08:00
Rick Hanlon 8901a0b863 LogBox - Better shadow for fatal button
Summary:
This diff lowers the intensity of the shadow on the fatal button based on user feedback that it's weird.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18353498

fbshipit-source-id: 9133aae02e5609e181a55289f349ea6a9e9fdaf6
2019-11-07 06:32:01 -08:00
Rick Hanlon 118e4d2c04 LogBox - Dim collapsed frames
Summary:
It's nice to be able to still see which stack frames are collapsed even when they're expanded.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18352700

fbshipit-source-id: f76086574677ea58c6b19b3300597681a17a96ae
2019-11-07 06:32:01 -08:00
Rick Hanlon 1c9a792ca4 LogBox - Re-apply badge color fix
Summary:
The previous diff mistakenly landed an old version

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18358917

fbshipit-source-id: 284dd6754c4aea3814e5f45dae6f68ed2c261b6a
2019-11-07 06:17:35 -08:00
Rick Hanlon e223454fbf LogBox - Remove extra padding to bottom of scroll container
Summary:
Fixes the comical level of padding at the end of the scroll container.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18351352

fbshipit-source-id: 5482fb81d0e385f0ce36530491b407c03ad87f3e
2019-11-06 13:56:10 -08:00
Rick Hanlon 38b3cbcca9 LogBox - Update press backfround for inspector footers
Summary:
Previously the background for the LogBox inspector footer buttons bleed into the background behind them. This change gives them more distinct on press backgrounds.

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18337437

fbshipit-source-id: c0cefd4464d94dc23316208135a9bf922fb510cb
2019-11-06 10:17:47 -08:00
Rick Hanlon 40ee0adbc1 LogBox - Center number and darken warning count color
Summary:
Some feedback for logbox is that the count wasn't centered on certain devices (e.g. Nexus 6 but not Pixel 3), and that the white badge count color for warnings was hard to read. This diff fixes both issues.

Changelog: [Internal]

Differential Revision: D18336681

fbshipit-source-id: 8200bcf04dcea9a6bbcaa1555fbab000c78c0a4f
2019-11-06 10:17:47 -08:00
Rick Hanlon 001e8d5a2b LogBox - Don't show substitutions for log notification
Summary:
When messages are collapsed, showing a different style for the string substitutions for interpolated strings is jarring, so let's  show the plaintext instead.

Changelog: [Internal]

Differential Revision: D18335295

fbshipit-source-id: f718469ac3206fd7a934a26495ebf8b1850fb674
2019-11-06 10:17:47 -08:00
Rick Hanlon 059e54a6e3 LogBox - hide only non-fatal errors for disableLogBox
Summary:
This diff updates the handling for `console.disableLogBox` so that:

- It does not disable fatals and syntax errors
- When there is a fatal or syntax error, the hidden logs are still shown and browsable

Changelog: [Internal]

Differential Revision: D18339684

fbshipit-source-id: 906122cc19ce50b3a21a42ae455206796953bcf3
2019-11-06 10:12:01 -08:00
Rick Hanlon 1fb815ed43 LogBox - hotfix for opening logs
Summary:
`fatalIndex` is never null, we switched it to go to -1 when it's not set

Changelog: [Internal}

Reviewed By: cpojer

Differential Revision: D18324666

fbshipit-source-id: 04d4cca9923af2a91ceec03f8314dead4681e526
2019-11-05 07:14:27 -08:00
Tim Yung 66e72bb4e0 Animated: Forward Ref to Component
Summary:
Changes `createAnimatedComponent` so that a `ref` assigned to an Animated component will now be forwarded to the internal component. Previously, a ref to the internal component was accessed using the `getNode` method. The `getNode` method is now deprecated and will return the same `ref` but show a deprecation error.

Changelog:
[General] [Changed] - Refs on an Animated component are now the internal component. The `getNode` call has been deprecated.

Reviewed By: TheSavior

Differential Revision: D18290474

fbshipit-source-id: 5849809583a17624a89071db8be1282a12caedf3
2019-11-03 18:02:00 -08:00
Rick Hanlon 5a943ec235 LogBox - Fix for buttons forcing refresh on fatals
Summary:
Fixes an issue in LogBox that allowed users to try to dismiss warnings/errors when there was a fatal or syntax error up.

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18285678

fbshipit-source-id: 9d137fab63405c28b2bfa94a35c11c2f63b6d085
2019-11-01 21:42:42 -07:00
Rick Hanlon 0825c2b2e7 LogBox - Add syntax error handling
Summary:
This diff adds handling for syntax errors.

## Strategy
To do this we introduce a new log level type syntax, giving us these levels with semantics:
- `warn` - console warns, show collapsed, dismissible
- `error` - console errors, show collapsed, dismissible
- `fatal` - thrown exceptions, show expanded, not dismissible
- `syntax` - thrown exceptions for invalid syntax, show expanded, not dismissible

Syntax errors shows expanded, covers all other errors, and are only dismissible when the syntax error is fixed and updated with Fast Refresh. Once the syntax error is fixed, it reveals any previously covered fatals, errors, or warnings behind it

In many ways, this makes syntax errors the highest level error.

## Visuals
Syntax errors also have their own display formatting. Stack traces for syntax errors don't make sense, so we don't show them. Instead, we show the syntax error message and a code frame for the error.

The code frame is also updated so that is doesn't wrap and is horizontally scrollable, making it easier to read.

## Detecting syntax errors

To detect syntax errors we've updated `LogBoxData.addException` to call the parse function `parseLogBoxException`. This method will perform a regex on the error message to detect:

- file name
- location
- error message
- codeframe

If this regex fails for any reason to find all four parts, we'll fall back to a fatal. Over time we'll update this regex to be more robust and handle more cases we've missed.

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18278862

fbshipit-source-id: 59069aba38a27c44787e5248b2973c3a345c4a0a
2019-11-01 16:08:49 -07:00
Rick Hanlon eefece4be6 Hide stack frames when they're empty
Summary:
In the next diff we'll introduce syntax errors, which we don't show stackframes for since they don't make sense. This diff removes the Stack Frame section when there are no stack frames available.

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18278831

fbshipit-source-id: 0a6ad5c3b7fed76123b6ad3ccfc8f3f0b044bda2
2019-11-01 16:08:49 -07:00
Rick Hanlon f6b1fa3197 Add fatal handling
Summary:
This diff adds handling to fatal errors such as thrown exceptions by popping them full screen and not allowing the user to dismiss them. They say that they're "Fatal Errors" and explain that "Fatal errors require a reload".

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D18257185

fbshipit-source-id: ca051027b19c3cd2410ae59764d7b98a78f08dca
2019-11-01 16:08:48 -07:00
Rick Hanlon 038353b89c LogBox - switch to array filter
Summary:
Fixes a bug for old versions of JSC that do not support `for of` syntax

Changelog: [Internal]

Reviewed By: fkgozali

Differential Revision: D18265611

fbshipit-source-id: 4643b6e2571c57ddd982661d188c3449f17a151e
2019-10-31 21:10:26 -07:00