This repository has been archived by the owner on Feb 6, 2023. It is now read-only.
Defer adding editorKey until after initial render #822
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
adds a small express-backed universal react app that only accepts `/` requests but that exhibits a client/server mismatch issue
allows callers of <Editor /> to pass a custom `editorKey` to a draft instance. This fixes universal rendering mismatches between client and the server. Instead of generating a random key when the component initializes, it waits for a custom one. If one is not passed, its key is empty until it renders and then it receives a random one when mounted if one was not passed in as a prop.
nsfmc
force-pushed
the
deterministicEditorKey
branch
from
ca32877
to
a8faa87
Compare
nsfmc
changed the title
|
It's similar to #796 )) |
|
@flarnie this can probably be closed. it's similar to #796 but keys blocks on mount via |
|
Thanks again - merged #796 so closing this. |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
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.
Summary
currently, the generation of
_editorKeyduring construction causes serverside rendering to break. This PR changes the behavior so that the_editorKeyis either passed in as apropor generated dynamically duringcomponentDidMountif no prop was provided.Test Plan
Included is a minimal universal/iso example which breaks before adding the subsequent commit. Upon building draft-js with the second commit, the universal rendering works if an
editorKeyprop is passed, or not, or whatever.A slight gotcha here:
EditorState.createEmpty()will create mismatched content states between the server rendered editor and the browser rendered one. For this reason, the example uses a dummy empty rawDraftContentState rather than using the other examples' approach of usingcreateEmpty()I'm 100% ok if this is the wrong approach or not good to merge, i'm opening it as an rfc mostly to get feedback or to understand if this is not a tenable approach to getting universal rendering unbroken with draft.