Scrolling disabled after resizing browser

[jasonbahl]

Describe the bug
Scrolling to the bottom of the content after resizing the browser is broken.

I have a post with:

1545 words
10 headings
39 paragraphs
62 blocks

I was working on editing content and resized my window to 50% of my screen (13" Mac Book Pro) so that I could have another browser window open next to it. When I resized my browser window to 100% of my screen, I could no longer scroll to the bottom of my content. My blocks are getting cut off and I can't continue editing after the last block.

To Reproduce
Steps to reproduce the behavior:

1. Go to a Gutenberg post
2. Add a lot of content, enough to make the content taller than the window
3. Resize browser to 780px width, 870px height (~50% width of 13" Macbook pro)
4. Resize browser back 1500px or more (full size of 13" Macbook pro)
5. Try to scroll down to the last block(s), or metaboxes.

Expected behavior
Be able to scroll down to the bottom of my content and continue adding more content after resizing the window

Screenshots

Screenshot shows:

• browser at full width
• scroll to the bottom to show all blocks and meta box area
• resize browser to 50% width
• make an edit to a block
• resize browser to 100% width
• try to scroll to the end of the blocks / metabox area
• scrolling is cut off

Desktop (please complete the following information):

• OS: Mac OSX 10.14
• Browser Chrome v69.0.3497.100
• WP: 4.9.7
• Gutenberg: 4.1.1

Additional context

After trying to investigate more, it seems like it might have to do with the height of the admin menu? I'm also noticing I can't scroll my main dashboard admin menu either.

When I'm on a 23" monitor vs my laptop monitor, and all my menu items are visible, the scroll issue for the blocks isn't an issue. Seems like the issue is somehow related to the admin menu 🤔

[Robertght]

Hi there @jasonbahl !

Thank you for reporting this!

I'm currently trying to replicate this behavior but I didn't have any luck yet.

In this sense, I'd like us to focus on the following steps:

• Have you by any chance tried to disable the third party plugins and to give it another shot?
• Also, are you running any browser extensions? If yes, would you mind trying to switch them off one by one to see if the experience improves?
• Do you have the possibility of testing this on a more similar environment to mine?

Here are my specs:

OS: macOS Mojave 10.14 (18A391)
Browser Chrome v70.0.3538.77
WP: 4.9.8
Gutenberg: 4.1.1

[jasonbahl]

@Robertght I’m afk today, but wanted to see if you saw my note about possibly being related to the admin menu?

Can you register serveral admin menu pages so that the menu is taller than your screen, then test again?

I believe something in Gutenberg may be resizing things based on some selector in the menu or something along those lines. 🤷‍♂️

[jasonbahl]

Looks like this might be related: #11185

[designsimply]

I tested with WordPress 4.9.8 and Gutenberg 4.5.1 using Firefox 63.0.1 on macOS 10.13.6 and Chrome 70 on Windows 10 and was unable to get scrolling to stop working even though I added 4 plugins that all add admin menu items (Yoast SEO, Elementor, Rank Math, Jetpack) which made the left menu longer than the viewport on my laptop.

@jasonbahl because more than one person tested and couldn't replicate the problem, it makes me suspect that the cause is from one of your plugins. Could you try temporarily disabling one plugin at a time and re-testing to see if any of them is the source of a conflict when combined with Gutenberg? Or if you can list your active plugins maybe we can spot one that seems suspect and recommend which to try temporarily disabling first.

[jasonbahl]

I’ll retest with latest versions of core and Gutenberg and let you know

[designsimply]

Closing and asking if you can please re-open once you've had a chance to check on this! Also want to note it would be good to consolidate with #11185 if it makes sense.