-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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.
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
Hide grid visualizer when grid is template locked or block editing mode is not default #66065
Hide grid visualizer when grid is template locked or block editing mode is not default #66065
Conversation
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Size Change: +96 B (+0.01%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
Flaky tests detected in 43a50e6. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/11293075682
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the quick fix @talldan 👍
It'd probably be a good idea to look at making it scale simultaneously with the canvas. It might be prudent for the zoomed out mode implementation to settle a bit first before doing that.
Agreed on both counts.
The alternative in #64321 seems promising as well, despite the blockers. For WP 6.7 though, I think landing this quick fix to mitigate most of the issue is a good move.
Regarding the remaining issue when zooming back in, I can still only replicate it when drag selecting an inner child of a Grid block. That definitely makes it a rarer edge case.
So with all that said, LGTM 🚢
Before | After |
---|---|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Regarding the remaining issue when zooming back in, I can still only replicate it when drag selecting an inner child of a Grid block. That definitely makes it a rarer edge case.
I can reproduce it with the list view open and a Grid block selected:
2024-10-14.16.28.54.mp4
In some ways it's sort of similar to the issue of the height of the iframe not quite being correct when we deactivate zoom out mode because the height updates immediately whereas the zoom in is being animated. I agree that it'd be nice to fix, but I also agree that this PR would be good to land for 6.7 so that the overall issue with the visualizer is less noticeable for the release, so adding a +1 ✅ 🙂
I'll merge this so it'll get backported. |
…de is not default (#66065) Co-authored-by: talldan <[email protected]> Co-authored-by: aaronrobertshaw <[email protected]> Co-authored-by: andrewserong <[email protected]> Co-authored-by: MaggieCabrera <[email protected]> Co-authored-by: bph <[email protected]> * Hide grid visualizer when template locked or block editing mode is not default * Remove unlocks
I just cherry-picked this PR to the wp/6.7 branch to get it included in the next release: 34395c4 |
…de is not default (#66065) Co-authored-by: talldan <[email protected]> Co-authored-by: aaronrobertshaw <[email protected]> Co-authored-by: andrewserong <[email protected]> Co-authored-by: MaggieCabrera <[email protected]> Co-authored-by: bph <[email protected]> * Hide grid visualizer when template locked or block editing mode is not default * Remove unlocks
…de is not default (WordPress#66065) Co-authored-by: talldan <[email protected]> Co-authored-by: aaronrobertshaw <[email protected]> Co-authored-by: andrewserong <[email protected]> Co-authored-by: MaggieCabrera <[email protected]> Co-authored-by: bph <[email protected]> * Hide grid visualizer when template locked or block editing mode is not default * Remove unlocks
What?
Fixes #65974
The grid visualizer doesn't work so well in zoomed out mode, but it also doesn't have much of a purpose, so in this PR it's being hidden. The PR does so by hiding the visualizer whenever the grid block is template locked or has a non-default block editing mode (which it does in zoom out mode).
Why?
The issue with the visualizer is that it renders in a slot outside the canvas in a slot, so it isn't scaled when zoomed out mode is activated the way the canvas does. It'd probably be a good idea to look at making it scale simultaneously with the canvas. It might be prudent for the zoomed out mode implementation to settle a bit first before doing that. There are still some ongoing changes to the scaling mechanism.
An alternative could also be to finalize #64321, which moves the grid visualisation inside the editor canvas, which should mean it scales along with the canvas. That PR had a few blockers though.
How?
Adds some additional checks for template lock and the block editing modes and
return null
from the visualizer components when these checks returnisVisible === false
.There are two places this has to be added:
packages/block-editor/src/hooks/grid-visualizer.js
- renders when the grid block itself is selectedpackages/block-editor/src/hooks/layout-child.js
- renders when an inner block of the grid is selectedRemaining issues
The grid visualizer still briefly appears incorrectly sized while the canvas zoomed back in:
Kapture.2024-10-11.at.14.56.42.mp4
I'm thinking through ways to solve that 🤔
Testing Instructions
Screenshots or screencast
Before
After