Page MenuHomePhabricator

An item that is too wide (e.g. image resized to full width) overflows and obscures the sidebar in the visual diff
Closed, ResolvedPublic1 Estimated Story Points

Description

I'm copy/pasting from https://www.mediawiki.org/wiki/Topic:Tn9sxkrou2a264xd .

"Problem

An image resized to full horizontal width, using the visual editor goes overflows and may obscure the text in the sidebar.

Reproduction steps

Go to an article with an image, e.g. VisualEditor/Design/User testing and enter edit mode
Click on File:July31 toolbar.png
Click edit
Click Advanced settings
Click make full size
Click apply changes
Click publish changes
Click review changes
Click Visual
Expected

The image doesn't on top of the sidebar. A scroll bar can be use to see the rest of it.

Actual

The image goes beyond the preview section and is also visible in the sidebar".

TheDJ confirms and adds, "Might want to have at least overflow:hidden on .ve-ui-diffElement-content" .

Our IP friend adds, "Yes, this also happens full width (100%) "<pre>" blocks, and overflow hidden wouldn't work too well because it would hide some entered content, unless maybe a scroll bar is added to the separate preview area."

Example diff:
https://en.wikipedia.beta.wmflabs.org/w/index.php?title=User:ESanders_(WMF)/sandbox/wide&type=revision&diff=534948&oldid=534947&diffmode=visual

Event Timeline

Jdforrester-WMF renamed this task from An image resized to full width overflows and shows up in sidebar to An item that is too wide (e.g. image resized to full width) overflows and obscures the sidebar in the visual diff.Apr 25 2017, 7:23 PM
Jdforrester-WMF triaged this task as Medium priority.
Jdforrester-WMF set the point value for this task to 1.
Jdforrester-WMF moved this task from To Triage to TR6: Visual diffs on the VisualEditor board.

Change 755509 had a related patch set uploaded (by Esanders; author: Esanders):

[VisualEditor/VisualEditor@master] DiffElement: Use horizontal scroll when necessary on content area

https://gerrit.wikimedia.org/r/755509

Test wiki created on Patch demo by ESanders (WMF) using patch(es) linked to this task:

https://patchdemo.wmflabs.org/wikis/b7bc3a81aa/w/

Change 755509 merged by jenkins-bot:

[VisualEditor/VisualEditor@master] DiffElement: Use horizontal scroll when necessary on content area

https://gerrit.wikimedia.org/r/755509

Change 757507 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/VisualEditor@master] Update VE core submodule to master (bbeac08b7)

https://gerrit.wikimedia.org/r/757507

Change 757507 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] Update VE core submodule to master (bbeac08b7)

https://gerrit.wikimedia.org/r/757507

Test wiki on Patch demo by ESanders (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmflabs.org/wikis/b7bc3a81aa/w/

With a large enough width and height to fill or exceed full screen, the scrollbar is displayed such that user would have to scroll to view full content.
See:
Preview right before you save the change

Screenshot 2022-01-29 at 02.19.28.png (1×2 px, 347 KB)

Visual diff between previous and current versions
Screenshot 2022-01-29 at 02.20.52.png (1×2 px, 236 KB)

ppelberg claimed this task.