Page MenuHomePhabricator

Mobile editnotices should display at appropriate widths
Open, Needs TriagePublicBUG REPORT

Assigned To
Authored By
stjn
Oct 18 2024, 5:47 PM
Referenced Files
F57778572: image.png
Wed, Dec 4, 3:14 PM
Unknown Object (File)
Wed, Dec 4, 3:13 PM
F57778553: image.png
Wed, Dec 4, 3:09 PM
F57778528: image.png
Wed, Dec 4, 2:59 PM
F57624343: image.png
Oct 18 2024, 5:47 PM
Tokens
"Like" token, awarded by Nemoralis."Like" token, awarded by Jdlrobson.

Description

Steps to replicate the issue (include links if applicable):

image.png (940×1 px, 305 KB)

What should have happened instead?:
They should be properly resized to the bigger screens. AFAIK some tablet devices also default to the mobile version, so they should not see edit notices like this.

Editnotices were introduced to mobile in T312587: Show edit notices within mobile editing interfaces

Event Timeline

I linked the task where they were ported to extension (T312587) in the last line.

Jdlrobson rescinded a token.
Jdlrobson awarded a token.

Change #1098973 had a related patch set uploaded (by Saint Johann; author: Saint Johann):

[mediawiki/extensions/MobileFrontend@master] Adjust size of editnotices in MobileFrontend

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

The smaller size was deliberately chosen to avoid it being full screen on mobile devices, this allows the users to see the article and editing interface underneath the popup and feel less "lost":

image.png (946×470 px, 172 KB)

If we switch to a large window, that would become full screen on mobile widths.

Well, there’s still a problem of tablet users being sent to the mobile version and seeing this sausage banner. That example is also artificially short, perhaps for English, in other languages this just makes most banners extremely long. It feels like, if the goal was to make it clear that you are in an editing interface, the design should’ve been something like this instead of OO.ui.alert then (maybe with ‘Edit notices’ label though):

image.png (600×450 px, 43 KB)

To provide more examples in Russian to test with (from https://ru.wikipedia.org/wiki/Модуль:Editnotice outputs)

For example, on 480x640 the current design looks like this (only about 70% of available width):

image.png (800×600 px, 76 KB)

Tablet use is orders of magnitude lower than mobile. I'm not opposed to a patch that uses a different width on wider screens, but that would be a more complex change.

(FYI the image in your comment above is not rendering for other users, it needs to be attached using the link in the sidebar)

Fixed. I’m trying to show with the image that some problem also exists on mobile, as well.

I also think a different design should be used if there's intent to ensure a user knows where they are. Edit notices are long and it's not helped by artificially shrinking the available space on small devices just to ensure the user knows where they are (which feels like a terrible rationale TBH). And that's regardless of whether it's displaying at tablet or mobile resolutions.

This actually reminds me of another similar task I opened before, T212848: Make edit notices more visible in Visual Editor. For some reason developers like cramming edit notices into extremely small spaces even though they are a very important part of editing workflow and are not typically put for no reason. The similar solution could be done in this case as well, where an edit notice would be displayed inline in the editor itself above the editing environment (separated by background colour etc.) with a close button.