Resolve SSR Hydration Issue for Disqus plugin#1569
Merged
Conversation
ang-zeyu
reviewed
May 30, 2021
| case 'style': | ||
| processScriptAndStyleTag(node, this.userScriptsAndStyles); | ||
| break; | ||
| case 'disqus': |
Contributor
There was a problem hiding this comment.
Thanks! How about just renaming the tag? So this fix lives strictly in the plugin
Contributor
Author
There was a problem hiding this comment.
@ang-zeyu Thanks for the suggestion! We should really avoid unnecessary coupling. I've made the changes to avoid the coupling.
Regarding "renaming the tag", I'm not sure if we are thinking of the same thing. Let me know if you actually had another idea in mind!
wxwxwxwx9
force-pushed
the
fix-disqus-hydration-issue
branch
from
c0b83d5 to
bbb1a41
Compare
wxwxwxwx9
force-pushed
the
fix-disqus-hydration-issue
branch
from
39cac78 to
d2b74d6
Compare
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
What is the purpose of this pull request?
The hydration issue that Disqus plugin has is discovered in #1565. This PR will address the discovered hydration issue for Disqus plugin.
Overview of changes:
Processed
<disqus>HTML element to be added withv-preinNodeProcessor.Anything you'd like to highlight / discuss:
Testing instructions:
Use Disqus plugin and insert
<disqus/>HTML element in the page. Afterwards, serve the page bymarkbind serve -d. There should not be any warnings of hydration issue in the developer console.Proposed commit message: (wrap lines at 72 characters)
Resolve SSR Hydration Issue for Disqus plugin.
<disqus>HTML tag is an unknown element to Vue as it is neithera registered Vue component nor an official HTML element. This causes
hydration issue in our SSR setup whenever the Disqus plugin is used.
Let's add
v-pretag to<disqus>HTML tag so that Vue will ignorethe tag when compiling/rendering, thus resolving hydration issue.
Checklist: ☑️