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

Fix(gatsby-plugin-image): Render LayoutWrapper prior to loading of lazy-hydrate #28841

Merged
merged 2 commits into from
Jan 7, 2021
Merged

Fix(gatsby-plugin-image): Render LayoutWrapper prior to loading of lazy-hydrate #28841

merged 2 commits into from
Jan 7, 2021

Conversation

laurieontech
Copy link
Contributor

@laurieontech laurieontech commented Jan 4, 2021 •
edited
Loading

Right now, fluid and constrained images trigger a re-layout because the sizer div (living in LayoutWrapper) hasn't loaded yet. This is not a challenge for SSR, but for route navigation.

This updates the dangerouslySetInnerHTML hack to use the sizer elements that fluid and constrained need.

[ch21582]

@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Jan 4, 2021
@laurieontech laurieontech added topic: media Related to gatsby-plugin-image, or general image/media processing topics and removed status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer labels Jan 4, 2021
ascorbic
ascorbic approved these changes Jan 7, 2021
View reviewed changes
Copy link
Contributor

@ascorbic ascorbic left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉

@laurieontech laurieontech merged commit 78e5e47 into master Jan 7, 2021
@laurieontech laurieontech deleted the fix/layout-hydration branch January 7, 2021 13:27
vladar pushed a commit that referenced this pull request Jan 12, 2021
@vladar
Fix(gatsby-plugin-image): Render LayoutWrapper prior to loading of la…
74618d7 
…zy-hydrate (#28841)

* add layoutwrapper to intial render when lazy-hydrate hasn't yet run

* calculate sizer string

(cherry picked from commit 78e5e47)
@gatsbybot gatsbybot mentioned this pull request Jan 12, 2021
Merged
gatsbybot pushed a commit that referenced this pull request Jan 13, 2021
Fix(gatsby-plugin-image): Render LayoutWrapper prior to loading of la…
be7ad3b 
…zy-hydrate (#28841) (#28990)

* add layoutwrapper to intial render when lazy-hydrate hasn't yet run

* calculate sizer string

(cherry picked from commit 78e5e47)

Co-authored-by: LB <laurie@gatsbyjs.com>
@vladar
Copy link
Contributor

vladar commented Jan 13, 2021

Published in gatsby-plugin-image@0.5.1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ascorbic ascorbic ascorbic approved these changes

@wardpeet wardpeet Awaiting requested review from wardpeet

Assignees
No one assigned
Labels
topic: media Related to gatsby-plugin-image, or general image/media processing topics
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@laurieontech @vladar @ascorbic