Page MenuHomePhabricator

Page jumps after opening visual editor on Vector 2022
Closed, ResolvedPublic

Assigned To
Authored By
matmarex
Nov 29 2022, 8:15 PM
Referenced Files
F35824538: image.png
Nov 29 2022, 8:15 PM
F35824536: image.png
Nov 29 2022, 8:15 PM
F35824534: image.png
Nov 29 2022, 8:15 PM
F35824530: image.png
Nov 29 2022, 8:15 PM
F35824528: image.png
Nov 29 2022, 8:15 PM
F35824526: image.png
Nov 29 2022, 8:15 PM
F35824522: image.png
Nov 29 2022, 8:15 PM
F35824518: image.png
Nov 29 2022, 8:15 PM

Description

Testing on https://en.wikipedia.org/wiki/The_Fighting_Temeraire?useskin=vector-2022:

Read modeVisual editor
image.png (2×3 px, 1 MB)
image.png (2×3 px, 1 MB)

Note how the whole page (including the sidebar menu and the big page title) has shifted a little bit upwards.

This happens because visual editor hides the #siteNotice banner container after opening:

Read modeVisual editor
image.png (2×3 px, 1 MB)
image.png (2×3 px, 922 KB)

We do that, because on legacy Vector and other skins, the banner container would be shown below the editing toolbar, which would be confusing to users (it kind of looks as if the banner was part of the article, and the banner becomes impossible to dismiss because that area is not clickable).

https://en.wikipedia.org/wiki/The_Fighting_Temeraire?useskin=vector&banner=shesaid_2022

Read mode (legacy Vector with banner)Visual editorVisual editor if the banner wasn't hidden
image.png (2×3 px, 1 MB)
image.png (2×3 px, 1 MB)
image.png (2×3 px, 1 MB)

However, on Vector 2022, this would not be a problem, as the banner container is above the toolbar. I think we could just let it stay visible:

https://en.wikipedia.org/wiki/The_Fighting_Temeraire?useskin=vector-2022&banner=shesaid_2022

Read mode (Vector 2022 with banner)Visual editorVisual editor if the banner wasn't hidden
image.png (2×3 px, 1 MB)
image.png (2×3 px, 1 MB)
image.png (2×3 px, 1 MB)

Event Timeline

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

[mediawiki/extensions/VisualEditor@master] Only hide #siteNotice on skins where it's shown in the editable area

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

Change 861931 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] Only hide #siteNotice on skins where it's shown in the editable area

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

EAkinloose subscribed.

✅ Page shouldn't jump after opening visual editor on Vector 2022
See https://photos.app.goo.gl/szPtEW2uGoBCUyKZ6