Page MenuHomePhabricator

LookupElement has padding at the end if there is just one suggestion
Closed, ResolvedPublic

Description

The list of suggestions created by OO.ui.mixin.LookupElement has a strange padding at the bottom when there is just one suggestion. This padding isn't there for more suggestions.
To reproduce, you can go to https://doc.wikimedia.org/oojs-ui/master/demos/?page=widgets&theme=wikimediaui&direction=ltr&platform=desktop#LookupElement-try-inputting-an-integer and change the code in the following way:

widget.getLookupRequest = function () { var value = this.getValue(), deferred = $.Deferred(), delay = 500 + Math.floor( Math.random() * 500 ); this.getValidity().then( function () { setTimeout( function () { deferred.resolve( [ value * 2 ] ); }, delay ); }, function () { deferred.resolve( [] ); } ); return deferred.promise( { abort: function () {} } ); }

This results in something like this:

Note the small area below the highlighted selection.

Event Timeline

Schnark created this task.Apr 12 2019, 7:48 AM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 12 2019, 7:48 AM

I think this might be a problem with all dropdown menus – for some reason MenuSelectWidget has a min-height in its styles.

This was introduced as override for b105f753541c37bfb1.
I think it would make sense to update it to height of 1 element again, didn't dig further when those two (MenuSelectWidget and its items) got out of sync.

Volker_E triaged this task as Low priority.Apr 25 2019, 10:53 AM

And I see this is in parts a regression as well, the menu items have shrinked in size with recent amendment of line-height & padding.

Regression has not to do with that specific issue, which was already in place before the named change. Will fix the regression separately and then care about this task.

Change 506840 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[oojs/ui@master] MenuSelectWidget: Amend value to reflect one option's height

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

Volker_E moved this task from Backlog to Reviewing on the OOUI board.Apr 26 2019, 9:24 PM

Change 506840 merged by jenkins-bot:
[oojs/ui@master] MenuSelectWidget: Amend value to reflect one option's height

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

Volker_E closed this task as Resolved.Apr 27 2019, 7:59 AM
Volker_E claimed this task.
Volker_E moved this task from Reviewing to OOUI-0.31.6 on the OOUI board.
Volker_E edited projects, added OOUI (OOUI-0.31.6); removed OOUI.
Volker_E removed a project: Patch-For-Review.

Change 508807 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[mediawiki/core@master] Update OOUI to v0.31.6

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

Change 508807 merged by jenkins-bot:
[mediawiki/core@master] Update OOUI to v0.31.6

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