Page MenuHomePhabricator

[S] Make the reporting dialog usable on Timeless and Monobook skins
Closed, ResolvedPublic

Assigned To
Authored By
Dreamy_Jazz
Nov 7 2023, 3:13 PM
Referenced Files
F41502811: image.png
Nov 14 2023, 2:15 AM
F41502809: image.png
Nov 14 2023, 2:15 AM
F41502806: image.png
Nov 14 2023, 2:15 AM
F41500382: image.png
Nov 14 2023, 2:15 AM
F41500136: image.png
Nov 14 2023, 2:15 AM
F41500132: image.png
Nov 14 2023, 2:15 AM
F41499992: image.png
Nov 14 2023, 2:15 AM
F41499793: image.png
Nov 14 2023, 2:15 AM

Description

Following T350675: [S] Make ReportIncident available on all skins, the reporting dialog can be used on the Timeless and Monobook skins. As these are used on production wikis, they can be used to test as part of the MTP. Therefore the experience using these skins should be usable enough for the MTP.

Currently when using Timeless the success confirmation banner is not shown and extra blank space is shown above the form fields. When using Monobook the reporting dialog is too small in width on desktop devices.

Before this task on Monobook:

image.png (1×2 px, 334 KB)

image.png (1×2 px, 302 KB)

Before this task on Timeless:

image.png (1×2 px, 269 KB)

Acceptance criteria
  • The reporting dialog is usable and looks reasonable on the Timeless skin
  • The reporting dialog is usable and looks reasonable on the Monobook skin

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript

Change 972392 had a related patch set uploaded (by Dreamy Jazz; author: Dreamy Jazz):

[mediawiki/extensions/ReportIncident@master] Fixes to code to support Timeless and Monobook

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

Dreamy_Jazz renamed this task from Make the reporting dialog usable on Timeless and Monobook skins to [S] Make the reporting dialog usable on Timeless and Monobook skins.Nov 7 2023, 3:33 PM

Test wiki created on Patch demo by DJacksonA using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/9c288a6eec/w

Test wiki created on Patch demo by DJacksonA using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/aca05b71da/w

Change 972392 merged by jenkins-bot:

[mediawiki/extensions/ReportIncident@master] Fixes to code to support Timeless and Monobook

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

Suggested QA steps:

  1. Install ReportIncident
  2. Log into an account with a confirmed email address
  3. Open the reporting dialog and navigate to step 2
  4. In a new tab open the same user talk page
  5. Switch to the Timeless skin
  6. Open the reporting dialog on the new tab
  7. Verify that the reporting dialog looks similar to it does on Vector 2022 (comparing the new and previous tab)
  8. Submit a report on the second tab and verify that the success banner is shown at the top of the page
  9. Switch to the Monobook skin
  10. Re-load the second tab
  11. Open the reporting dialog
  12. Verify that the dialog looks similar to what is does on Vector 2022 (except the decrease in font-size)

Test wiki created on Patch demo by DJacksonA using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/21de341c05/w

Per the ticket Description, I have verified the new code has been implemented... Thank you for the QA Steps @Dreamy_Jazz


Testing was executed at the following urls:
https://patchdemo.wmflabs.org/wikis/21de341c05/w
https://ko.wikipedia.beta.wmflabs.org
https://eo.wikipedia.beta.wmflabs.org
https://fa.wikipedia.beta.wmflabs.org


When using Monobook the reporting dialog is too small in width on desktop devices.

Monobook skin -- information dialogue page and form field page now show the correct width and spacing for desktop devices.

image.png (893×625 px, 265 KB)

image.png (901×613 px, 236 KB)

image.png (779×1 px, 346 KB)

image.png (831×1 px, 316 KB)

image.png (897×731 px, 194 KB)

image.png (899×745 px, 173 KB)

image.png (803×1 px, 372 KB)

image.png (841×1 px, 354 KB)


Currently when using Timeless the success confirmation banner is not shown and extra blank space is shown above the form fields

Timeless skin -- information dialogue page and form field page now show the correct spacing for desktop devices, and the Success Confirmation banner is now displaying after user submits the Report.

image.png (904×697 px, 172 KB)

image.png (888×734 px, 144 KB)

image.png (907×731 px, 164 KB)

image.png (894×1 px, 570 KB)

image.png (889×1 px, 487 KB)

image.png (924×1 px, 620 KB)

image.png (916×1 px, 114 KB)

image.png (923×1 px, 112 KB)

image.png (825×1 px, 98 KB)

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

https://patchdemo.wmflabs.org/wikis/9c288a6eec/w/

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

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

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

https://patchdemo.wmflabs.org/wikis/21de341c05/w/