Page MenuHomePhabricator

PHP and JS DropdownInputWidgets have different dimensions (FOUC for the namespace selector dropdown on Special:MovePage)
Closed, ResolvedPublic

Description

  1. Go to https://www.mediawiki.org/wiki/Special:MovePage/Sandbox

Observed: Flash of unstyled content for the namespace selector each time the page is reloaded
Expected: It shouldn't happen each time.

Browser: FF40 on Ubuntu

Event Timeline

Glaisher created this task.Sep 23 2015, 4:57 PM
Glaisher raised the priority of this task from to Needs Triage.
Glaisher updated the task description. (Show Details)
Glaisher added a subscriber: Glaisher.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptSep 23 2015, 4:57 PM

Is this possible? Would need us to build the select widget in styled HTML, which… isn't possible for non-JS clients or something?

matmarex added a subscriber: matmarex.EditedSep 25 2015, 1:34 PM

It's almost impossible to provide a dropdown looking identically to the one we generate with JavaScript, that also actually works, without JavaScript. (We haven't quite rolled out the heavy CSS artillery here, but it would require a lot of fiddling.)

Although, I looked carefully took some screenshots and this looks a bit worse than I thought it does: the height of the dropdown actually changes with JS, shifting the rest of the page down, which is definitely not supposed to happen (and I think it wasn't happening the last time I tested this).

Before flashAfter flash

I'll look into ensuring that the no-JS and JS dropdowns have the exact same dimensions.

matmarex renamed this task from FOUC for the namespace selector dropdown on Special:MovePage to PHP and JS DropdownInputWidgets have different dimensions (FOUC for the namespace selector dropdown on Special:MovePage).Sep 25 2015, 1:35 PM
matmarex claimed this task.
matmarex triaged this task as Normal priority.
matmarex added a project: OOUI.
matmarex set Security to None.

Change 242530 had a related patch set uploaded (by Bartosz Dziewoński):
MediaWiki theme: Make PHP DropdownInputWidget look closer to JS version

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

The flash should become nearly imperceptible with the patch above. (How imperceptible depends on how close your browser's and OS's dropdowns are to OOjs UI's, but the dimensions at least should stay the same.)

Change 242530 merged by jenkins-bot:
MediaWiki theme: Make PHP DropdownInputWidget look closer to JS version

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

matmarex closed this task as Resolved.Sep 30 2015, 4:52 PM

The change has been merged and will be deployed to Wikimedia wikis… at some point. In the future. Soon.

Jdforrester-WMF moved this task from Backlog to Reviewing on the OOUI board.Nov 21 2015, 2:30 AM
Danny_B moved this task from Unsorted to OOUI on the UI-Standardization board.May 20 2016, 8:57 PM
Volker_E removed a subscriber: gerritbot.