Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

The theme in ErrorBoundary and CatchBoudnary of remix doesn't match with rest of the app.

Expected behavior 🤔

The theme selected should be respected in ErroBoundary and CatchBoundary too.

Steps to reproduce 🕹

Steps:

1. Visit the codesandbox
2. Toggle the theme to dark if not already
3. Hit the Test Root CatchBoundary link
4. You'll see the dark theme but if you refresh the page, the theme will fallback to light for some reason and you'll see Warning: Prop 'content' did not match. Server: "#90caf9" Client: "#1976d2" in the console. This warning is regarding the <meta name="theme-color" content={theme.palette.primary.main} /> tag in the root.

Context 🔦

I am trying to accomplish a successful MUI theme switch with error and catch boundaries too.

Your environment 🌎

  System:
    OS: Linux 5.4 Debian GNU/Linux 10 (buster) 10 (buster)
  Binaries:
    Node: 16.12.0 - ~/.nvm/versions/node/v16.12.0/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v16.12.0/bin/yarn
    npm: 8.1.0 - ~/.nvm/versions/node/v16.12.0/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: Not Found
  npmPackages:
    @emotion/react: ^11.7.1 => 11.7.1
    @emotion/styled: ^11.6.0 => 11.6.0
    @mui/base:  5.0.0-alpha.69
    @mui/icons-material: ^5.4.1 => 5.4.2
    @mui/material: ^5.4.1 => 5.4.2
    @mui/private-theming:  5.4.2
    @mui/styled-engine:  5.4.2
    @mui/system:  5.4.2
    @mui/types:  7.1.2
    @mui/utils:  5.4.2
    @types/react: ^17.0.38 => 17.0.39
    react: ^17.0.2 => 17.0.2
    react-dom: ^17.0.2 => 17.0.2
    typescript: ^4.5.4 => 4.5.5