Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Modal] Broken server-side modal example (possibly component & test) #31842

Closed
2 tasks done
jfsiii opened this issue Mar 16, 2022 · 2 comments
Closed
2 tasks done

[Modal] Broken server-side modal example (possibly component & test) #31842

jfsiii opened this issue Mar 16, 2022 · 2 comments
Labels
component: modal This is the name of the generic UI component, not the React module! status: expected behavior Does not imply the behavior is intended. Just that we know about it and can't work around it

Comments

@jfsiii
Copy link

jfsiii commented Mar 16, 2022

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Current behavior 😯

Following the docs for a server-side modal or running the linked sandbox results in a blank page when JS is disabled in the current versions of Firefox, Edge, Chrome, and Safari

Screen Shot 2022-03-16 at 2 24 12 PM

Screen Shot 2022-03-16 at 2 25 26 PM

Screen Shot 2022-03-16 at 2 29 31 PM

Expected behavior 🤔

  • The initial response should include the HTML for the modal
  • The page should look the same as when JavaScript is enabled

Screen Shot 2022-03-16 at 2 32 30 PM

Steps to reproduce 🕹

Steps:

  1. Disable javascript in your browser
  2. Visit https://mvjvg1.csb.app/
  3. observe the blank page
  4. observe the initial html response is

Context 🔦

No response

Your environment 🌎

`npx @mui/envinfo`
  System:
    OS: macOS 12.3
  Binaries:
    Node: 16.13.0 - ~/.nvm/versions/node/v16.13.0/bin/node
    Yarn: Not Found
    npm: 8.5.2 - ~/.nvm/versions/node/v16.13.0/bin/npm
  Browsers:
    Chrome: 99.0.4844.74
    Edge: 99.0.1150.39
    Firefox: 98.0.1
    Safari: 15.4
  npmPackages:
    @emotion/react: ^11.8.1 => 11.8.2
    @emotion/styled: ^11.8.1 => 11.8.1
    @mui/base:  5.0.0-alpha.71
    @mui/icons-material: ^5.5.0 => 5.5.0
    @mui/material: ^5.5.0 => 5.5.0
    @mui/private-theming:  5.4.4
    @mui/styled-engine:  5.4.4
    @mui/system:  5.5.0
    @mui/types:  7.1.2
    @mui/utils:  5.4.4
    @types/react: ^17.0.24 => 17.0.40
    react: ^17.0.2 => 17.0.2
    react-dom: ^17.0.2 => 17.0.2
    styled-components: 5.3.3 => 5.3.3
    typescript: ^4.5.5 => 4.6.2
@jfsiii jfsiii added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Mar 16, 2022
@jfsiii
Copy link
Author

jfsiii commented Mar 16, 2022

I see a test for this was added as part of #16850

@danilo-leal danilo-leal added the component: modal This is the name of the generic UI component, not the React module! label Mar 16, 2022
@jfsiii
Copy link
Author

jfsiii commented Mar 18, 2022

My apologies, I think this was all user error and assumptions/misunderstanding.

Closing this as I can now SSR the modal locally. Also, after looking at the other CodeSandbox examples, I believe they're just not set up for SSR but the example does work if the other SSR steps are followed.

@jfsiii jfsiii closed this as completed Mar 18, 2022
@michaldudak michaldudak added status: expected behavior Does not imply the behavior is intended. Just that we know about it and can't work around it and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels May 24, 2022
@michaldudak michaldudak closed this as not planned Won't fix, can't repro, duplicate, stale May 24, 2022
@michaldudak michaldudak removed their assignment May 24, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: modal This is the name of the generic UI component, not the React module! status: expected behavior Does not imply the behavior is intended. Just that we know about it and can't work around it
Projects
None yet
Development

No branches or pull requests

4 participants