[Fizz] Assign an ID to the first DOM element in a fallback or insert a dummy (and testing infra) #21020
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
facebook-github-bot
added
CLA Signed
React Core Team
sebmarkbage
force-pushed
the
fizztesting
branch
from
99591ea
to
192c039
Compare
|
Comparing: f8979e0...babefe9 Critical size changesIncludes critical production bundles, as well as any change greater than 2%:
Significant size changesIncludes any change greater than 0.2%: Expand to show
|
|
Not sure what's up with that test failure. |
|
Does |
acdlite
reviewed
Mar 16, 2021
| } | ||
| } | ||
|
|
||
| function getVisibleChildren(element) { |
acdlite
reviewed
Mar 16, 2021
| // But it is not yet hydrated. | ||
| expect(ref.current).toBe(null); | ||
|
|
||
| Scheduler.unstable_flushAll(); |
There was a problem hiding this comment.
Maybe you could have two acts: one for Fizz, one for the Scheduler/reconciler?
There was a problem hiding this comment.
I was kind of expecting to have them all be like one act that does both the server and the client in that act. E.g. I didn't include anything like "scheduler.yield" here.
This was ported from another test though. Not sure if this will come up more.
acdlite
reviewed
Mar 16, 2021
|
|
||
| if (Array.isArray(node)) { | ||
| for (let i = 0; i < node.length; i++) { | ||
| renderNode(request, parentBoundary, segment, node[i]); |
There was a problem hiding this comment.
Ah, so nice to be able to use the actual JS stack 😆
Yeah |
acdlite
approved these changes
Mar 16, 2021
|
Love the tests, btw. |
zhengjitf
pushed a commit
to zhengjitf/react
that referenced
this pull request
Mar 23, 2021
…a dummy (and testing infra) (facebook#21020) * Patches * Add Fizz testing infra structure * Assign an ID to the first DOM node in a fallback or insert a dummy * unstable_createRoot
facebook-github-bot
pushed a commit
to facebook/react-native
that referenced
this pull request
Mar 23, 2021
Summary: This sync includes the following changes: - **[6d3ecb70d](facebook/react@6d3ecb70d )**: Remove unstable_changedBits ([#20953](facebook/react#20953)) //<Andrew Clark>// - **[754e30728](facebook/react@754e30728 )**: Delete immediateQueueCallbackNode ([#20980](facebook/react#20980)) //<Andrew Clark>// - **[be5a2e231](facebook/react@be5a2e231 )**: Land enableSyncMicrotasks ([#20979](facebook/react#20979)) //<Andrew Clark>// - **[f6bc9c824](facebook/react@f6bc9c824 )**: [Fizz] Expose maxBoundarySize as an option ([#21029](facebook/react#21029)) //<Sebastian Markbåge>// - **[154b85213](facebook/react@154b85213 )**: [Fizz] Expose a method to explicitly start writing to a Node stream ([#21028](facebook/react#21028)) //<Sebastian Markbåge>// - **[cf485e6f6](facebook/react@cf485e6f6 )**: [Fizz] Expose a method to abort a pending request ([#21027](facebook/react#21027)) //<Sebastian Markbåge>// - **[3fb11eed9](facebook/react@3fb11eed9 )**: React Native: Touch Instrumentation Interface ([#21024](facebook/react#21024)) //<Timothy Yung>// - **[825c3021f](facebook/react@825c3021f )**: Don't delete trailing mismatches during hydration at the root ([#21021](facebook/react#21021)) //<Sebastian Markbåge>// - **[1d1e49cfa](facebook/react@1d1e49cfa )**: [Fizz] Assign an ID to the first DOM element in a fallback or insert a dummy (and testing infra) ([#21020](facebook/react#21020)) //<Sebastian Markbåge>// - **[466b26c92](facebook/react@466b26c92 )**: Store commit durations on HostRoot for DevTools access ([#20983](facebook/react#20983)) //<Brian Vaughn>// - **[89acfa639](facebook/react@89acfa639 )**: Fix native event batching in concurrent mode ([#21010](facebook/react#21010)) //<Ricky>// - **[0203b6567](facebook/react@0203b6567 )**: chore: update react-reconciler README ([#21016](facebook/react#21016)) //<susiwen8>// Changelog: [General][Changed] - React Native sync for revisions c9f6d0a...6d3ecb7 jest_e2e[run_all_tests] Reviewed By: JoshuaGross, kacieb Differential Revision: D27231625 fbshipit-source-id: 89c0c0662e69044ae8890486a693013bee6005dd
koto
pushed a commit
to koto/react
that referenced
this pull request
Jun 15, 2021
…a dummy (and testing infra) (facebook#21020) * Patches * Add Fizz testing infra structure * Assign an ID to the first DOM node in a fallback or insert a dummy * unstable_createRoot
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
We need some ID attribute so that we can quickly find a Suspense boundary. This approach tries to assign or reuse the ID of the first child element of a Suspense boundary. If the first child is not an element, we insert a dummy hidden span. This breaks CSS pseudo-selectors for this case ofc.
I'm not a fan of how invasive this solution is. It's also not deterministic because it's done in the render phase instead of writing phase. It also seems unnecessary to insert both a comment and a span in the cases where that applies.
As part of this PR I also add actual testing infra to make sure the basics work. It's creating an environment which both streams in the result and hydrates it at the same time. JSDOM can't do HTML streaming parsing so we have to do a bit of a hack to pretend we're streaming it in.