web-stories-wp icon indicating copy to clipboard operation
web-stories-wp copied to clipboard

Published 20 hours ago • verified publisher icon GoogleForCreators

Zoom behavior broken

Open ayushnirwal opened this issue 1 year ago • 6 comments

Bug Description

On a 2K display, going from Fill or 200% zoom level (with some non-zero scroll) to 100% leaves the Display layer and frames layer un aligned.

Expected Behaviour

The Display Layer should not be out of view.

Steps to Reproduce

  1. Add a few elements to the story.
  2. Set the zoom level to 200% or Fill.
  3. Scroll to the bottom of the canvas.
  4. Set the zoom level to 100% or Fill.

Screenshots

https://user-images.githubusercontent.com/53055971/232972445-c829b06b-edb5-4ef1-a6f7-c814ea761709.mov

Additional Context

  • Plugin Version: 1.32.0-alpha.0
  • WordPress Version: 6.2
  • Operating System: MacOS
  • Browser: Chrome
  • Display resolution: 2048 * 1080

ayushnirwal avatar Apr 19 '23 05:04 ayushnirwal

Good catch! We should fix this

swissspidy avatar Apr 25 '23 11:04 swissspidy

Possibly related: #7638

swissspidy avatar May 02 '23 09:05 swissspidy

@AnuragVasanwala are you able to reproduce this one?

swissspidy avatar Nov 08 '23 14:11 swissspidy

@AnuragVasanwala are you able to reproduce this one?

@swissspidy Yes, I tried to reproduce it and Display Layer gets out of the view. Upon adding a new element gets back Display Layer so need fix for this. Will identify the cause.

Do you suggest any pointers regarding the issue?

AnuragVasanwala avatar Nov 09 '23 04:11 AnuragVasanwala

Unfortunately I don‘t have any pointers. It‘s also not a high priority issue, let‘s focus on the group layer bug first.

swissspidy avatar Nov 09 '23 07:11 swissspidy

@swissspidy Just an update!

Changing false value of --overflow-y to auto (from visible) seems fixed the issue but still trying to figure out why? 🤔

https://github.com/GoogleForCreators/web-stories-wp/blob/53b1b9ee359e6e9eab09428d87513907ce020667/packages/story-editor/src/components/canvas/layout.js#L361

- '--overflow-y': hasVerticalOverflow ? 'scroll' : 'visible', 
+ '--overflow-y': hasVerticalOverflow ? 'scroll' : 'auto',

AnuragVasanwala avatar Nov 20 '23 12:11 AnuragVasanwala