Skip to content
This repository has been archived by the owner on Dec 3, 2018. It is now read-only.

Commit

Permalink
Add runtime error overlay (#1101)
Browse files Browse the repository at this point in the history
* Add red box prototype

* Unmount fail node when hot-reloaded (future proofing)

* Slightly improve error reason

* Add Chrome unhandledrejection listener

* Close red box when Escape is pressed

* Construct our own source if not available

* Resolve sourcemaps for friendlier traces

* Allow error to be scrolled

* Only utilize sourcemaps, not the magic. :(

* Make view similar to React Native

* Fix an uncaught syntax error

* Add workaround for Firefox 50

* Add a hint for closing the prompt

* Multiple error support
When there's multiple errors, simply state that there are more instead of re-rendering

* Log any renderer error

* Dim node_modules in display

* Override chrome stack trace limit

* Magic: show me some source!

* Add ability to toggle internal calls

* Switch text from show -> hide

* Change color scheme to something easier on the eyes

* Change UI to be friendlier (thanks @nicinabox)
facebook/create-react-app#1101 (comment)
facebook/create-react-app#1101 (comment)

* Update styles

* Add container inside overlay

* Apply pre style

* Add line highlight

* Add omitted frames ui

* Move yellow to var

* Do all function names in black

* Adapt container based on screen size

* Extract ansiHTML

Use base16-github theme

* Linting

* Add syntax highlighting of errors

* Linting

* Remove white background

* Append new files to package.json

* Target exact version

* White is a little harsh, use same color as red box.

* Fix a bug where omitted frames would never be rendered
(under certain circumstances)

* Show local file path instead of confusing webpack://

* Do not require the entire file

* Remove css file

* Use context size, not a magic variable.

* Fix title regression

* Update dependency

* Do not center text for internal calls

* Temporarily disable links

* Switch internal toggle to 'i'

* Remove unnecessary rules from container style

* Reduce omitted frames font size

* Fix font family in pre > code

* Re-introduce line highlighting

* Object.<anonymous> -> (anonymous function)

* Add ability to see script source

* Add missing ansi mappings

* Remove SIAF

* Skip native functions

* Extract hints div function

* Extract renderers

* Refacor var names

* If source is disabled, don't use the line.

* Allow toggle between source

* Allow bundles to be expanded

* Wow, how did I let this one slip?

* Toggle text for UX/DX

* Make it so clicking Close unmounts the error component

* Do not allow hot reloading once an error is thrown

* Do not wrap lines for small displays

* Fix toggle when additional errors happen

* Make the close a button

* Capture and store errors

* Dispose on render; move additional logic

* Only make code not wrap

* Switch to a view-by-index method

* Allow user to switch between errors with arrow keys

* Fix text while switching between errors

* Update close button style

* Render additional errors at top

* Add left and right arrows

* Make frames pointy

* UTF-8 arrows

* Don't mount unneeded DOM node

* Switch to single changing text for compiled <-> source

* Don't display arrows with only one error.

* Collapsed and expanded

* Make sure the last collapse toggle is appended

* Do not show the stack trace if it doesn't resolve to a file we wrote

* Style container with media queries

* Do not allow x overflow; break words by default.

* Trim off whitespace of lines

* Remove padding since it's not outer-most

* Add footer message

* Extract css file to JS

* Only inject the css when the overlay is up

* Extract red variable

* Remove env

* Update babel-code-frame

* Set force color to true

* Extract out collapse div logic

* Remove arrow field

* Insert a top collapse

* Make browser friendlier

* Absolutify ^

* Make arrows buttons

* Accessify

* Let there be ES5

* Pretty css

* Use forEach where we can ...

* Remove extracted loop

* Fix IE compatibility

* Capture React warnings

* Add source override via React output parsing

* Whoops, fix arguments to crash.

* es5-ify

* Re-enable e2e-install directory test

* Only rewrite line number if it was resolved and leaves a line at bottom

* Rename failFast to crashOverlay

* Disable console proxy

* Appease linter

* Appease more
  • Loading branch information
Timer committed Mar 7, 2017
1 parent 95936ed commit 4323e6f
Showing 1 changed file with 2 additions and 0 deletions.
2 changes: 2 additions & 0 deletions config/webpack.config.dev.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,8 @@ module.exports = {
require.resolve('react-dev-utils/webpackHotDevClient'),
// We ship a few polyfills by default:
require.resolve('./polyfills'),
// Errors should be considered fatal in development
require.resolve('react-dev-utils/crashOverlay'),
// Finally, this is your app's code:
paths.appIndexJs
// We include the app code last so that if there is a runtime error during
Expand Down

0 comments on commit 4323e6f

Please sign in to comment.