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.

Sign up for GitHub

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

Jump to bottom

Suppress hydration warnings when a preceding sibling suspends #24404

Merged
merged 14 commits into from Apr 20, 2022
Merged

Suppress hydration warnings when a preceding sibling suspends #24404

merged 14 commits into from Apr 20, 2022

Commits on Apr 20, 2022

  1. Add failing test case for facebook#24384 

    If a components suspends during hydration we expect there to be mismatches with server rendered HTML but we were not always supressing warning messages related to these expected mismatches
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    a9ccb8b View commit details
    Browse the repository at this point in the history

  2. Mark hydration as suspending on every thrownException 

    previously hydration would only be marked as supsending when a genuine error was thrown. This created an opportunity for a hydration mismatch that would warn after which later hydration mismatches would not lead to warnings. By moving the marker check earlier in the thrownException function we get the hydration context to enter the didSuspend state on both error and thrown promise cases which eliminates this gap.
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    b530537 View commit details
    Browse the repository at this point in the history

  3. Fix failing test related to client render fallbacks 

    This test was actually subject to the project identified in the issue fixed in this branch. After fixing the underlying issue the assertion logic needed to change to pick the right warning which now emits after hydration successfully completes on promise resolution. I changed the container type to 'section' to make the error message slightly easier to read/understand (for me)
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    dc1cd0b View commit details
    Browse the repository at this point in the history

  4. Only mark didSuspend on suspense path 

    For unknown reasons the didSuspend was being set only on the error path and nto the suspense path. The original change hoisted this to happen on both paths. This change moves the didSuspend call to the suspense path only. This appears to be a noop because if the error path marked didSuspend it would suppress later warnings but if it does not the warning functions themsevles do that suppression (after the first one which necessarily already happened)
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    b06d2e9 View commit details
    Browse the repository at this point in the history

  5. gate test on hydration fallback flags

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    5e1cd0a View commit details
    Browse the repository at this point in the history

  6. refactor didSuspend to didSuspendOrError 

    the orignial behavior applied the hydration warning bailout to error paths only. originally I moved it to Suspense paths only but this commit restores it to both paths and renames the marker function as didThrow rather than didSuspend

The logic here is that for either case if we get a mismatch in hydration we want to warm up components but effectively consider the hydration for this boundary halted
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    668d8c9 View commit details
    Browse the repository at this point in the history

  7. factor tests to assert different behavior between prod and dev

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    3bccb4d View commit details
    Browse the repository at this point in the history

  8. add DEV suffix to didSuspendOrError to better indicate this feature s… 

    …hould only affect dev behavior
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    eeede50 View commit details
    Browse the repository at this point in the history

  9. move tests back to ReactDOMFizzServer-test

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    c827582 View commit details
    Browse the repository at this point in the history

  10. fix comment casing

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    945352e View commit details
    Browse the repository at this point in the history

  11. drop extra flag gates in tests

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    07a2eee View commit details
    Browse the repository at this point in the history

  12. add test for user error case

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    8839f1b View commit details
    Browse the repository at this point in the history

  13. remove unnecessary gate

    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    3fd1eb6 View commit details
    Browse the repository at this point in the history

  14. Make test better 

    it not has an intentional client mismatch that would error if there wasn't supression brought about by the earlier error. when it client rendres it has the updated value not found in the server response but we do not see a hydration warning because it was superseded by the thrown error in that render
    @gnoff
    gnoff committed Apr 20, 2022
    Copy the full SHA
    be1cefa View commit details
    Browse the repository at this point in the history