react / react/react-native

Redesign Native RedBox

Open
#29,158 12 comments 8 reactions 1 assignee View on GitHub

@TMaszko is already working on this.

Since Mar 13, 2022.

Never gets stale Type: Discussion Type: Enhancement
Dominant language
C++
Stars
127k
Forks
25.3k
Avg merge
1d 23h
Merged PRs (30d)
4

Description

Overview

LogBox handles most errors users see but we still display native RedBoxes in cases where:

  • JavaScript has not loaded (e.g. Metro is unavailable)
  • JavaScript is unavailable (e.g. a syntax error in the bundle)
  • LogBox fails to render (e.g. an error in LogBox JavaScript)
  • Native log errors (e.g. RCTLogFatal)

This issue is to improve the fallback RedBox in these cases for a better experience.

Tasks

  • Update design to be in line with LogBox (see below)
  • Cleanup code by removing the symbolication logic (as this is handled by LogBox)
  • Remove stack trace since for all errors that this can occur the stack trace is not relevant

Designs

JavaScript has not loaded (Metro is unavailable)

image

JavaScript is not available (syntax error)

image

LogBox fails to render

image

Native log errors

image

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.