test: fix flaky screenshots, add html data-has-hydrated attribute #9256
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
slorber
added
the
pr: internal
✅ [V2]
To edit notification comments on pull requests, go to your Netlify site configuration. |
⚡️ Lighthouse report for the deploy preview of this PR
|
slorber
changed the title
|
Size Change: +166 B (0%) Total Size: 1.11 MB
ℹ️ View Unchanged
|
slorber
added
the
to backport
|
The latest updates on your projects. Learn more about Argos notifications ↗︎
|
slorber
added
pr: new feature
slorber
changed the title
slorber
added
pr: new feature
slorber
changed the title
slorber
added
to backport
slorber
added
the
pr: internal
slorber
changed the title
slorber
added a commit
that referenced
this pull request
Sep 20, 2023
slorber
added a commit
that referenced
this pull request
Sep 20, 2023
…lease (#9324) Co-authored-by: Joshua Chen <[email protected]> Co-authored-by: sebastienlorber <[email protected]> Co-authored-by: Sébastien Lorber <[email protected]> Co-authored-by: Ori Shalom <[email protected]> Co-authored-by: Mikey O'Toole <[email protected]> Co-authored-by: TheCatLady <[email protected]> fix flaky screenshots, add html data-has-hydrated attribute (#9256) fix(theme-common): ThemedComponent should display something when JS is disabled (#9243) fix(theme): canonical url should be not change after hydration if url accessed with/without trailing slash (#9130) fix(theme): only set classname on ul elements if they have an existing class (#9099) fix(content-docs): sidebar generator should return customProps for doc items (#9107)
slorber
removed
the
to backport
1 task
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.
Motivation
Fix Argos visual test flakiness found in https://app.argos-ci.com/meta-open-source/docusaurus/builds/186/56059354
I think it's related to anything that runs in
useEffectinstead ofuseLayoutEffect.Let's introduce a
<html data-has-hydrated="true">to be able to wait forBrowserOnlyand other useEffect components to run.Unfortunately it kind of requires merging to test and see if it works.
The Algolia keyboard shortcuts do not appear immediately and can create some flakiness:
Mermaid diagrams can lead to layout shifts leading to the end of the page being cropped
(related to microsoft/playwright#620 (comment))
There's also one related to the TOC highlighting:
We'll see if the data-attribute fixes it