Page MenuHomePhabricator

Translate's "Mark as reviewed" tooltip is mispositioned
Closed, ResolvedPublic

Description

Translate's "Mark as reviewed" tooltip is mispositioned, due to changes in OOjs UI. (Split off from T160852.)

Steps to reproduce:

  • Visit a Special:Translate in proofread mode (example)

Event Timeline

matmarex created this task.Apr 3 2017, 11:12 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 3 2017, 11:12 PM
matmarex added a comment.EditedApr 3 2017, 11:12 PM

Side note… looks like the way you position the popup no longer works correctly, partially [due to rGOJUa46af11dd5f3: PopupWidget: Position anchor relative to popup, not popup relative to anchor], partially due to rGOJUa3caf97b7167: PopupWidget: Make popups able to actually pop *up*, as well as sideways. But I'm not really sure if this should be considered a regression in OOjs UI or a pre-existing bug in how you do positioning that was now exposed.

For reference, the current code is:

offset = $icon.offset();
tooltip.$element.css( {
	top: offset.top + $icon.outerHeight() + 5,
	left: offset.left + $icon.outerWidth() - 20
} ).appendTo( 'body' );
tooltip.toggleClipping( false ).toggle( true );

There are two ways you could fix it:

  1. Disable the built-in positioning and position manually after you display the popup:
offset = $icon.offset();
tooltip.$element.appendTo( 'body' );
tooltip.toggle( true ).toggleClipping( false ).togglePositioning( false );
tooltip.$element.css( {
	top: offset.top + $icon.outerHeight() + 5,
	left: offset.left + $icon.outerWidth() - tooltip.$element.width() / 2
} );
tooltip.$anchor.css( 'margin-left', '50%' );
  1. Instruct the popup to position itself relative to the checkbox icon:
tooltip.$element.appendTo( 'body' );
tooltip.setFloatableContainer( $icon );
tooltip.toggle( true ).toggleClipping( false );

Change 346211 had a related patch set uploaded (by Bartosz Dziewoński):
[mediawiki/extensions/Translate@master] Fix "Mark as reviewed" tooltip positioning

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

Change 346211 merged by jenkins-bot:
[mediawiki/extensions/Translate@master] Fix "Mark as reviewed" tooltip positioning

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

matmarex updated the task description. (Show Details)
matmarex claimed this task.
Nikerabbit closed this task as Resolved.

Thanks @matmarex for the patch. It's faster me to review than to hunt someone else do a code review. Verified on test.wikipedia.org.

Nikerabbit reopened this task as Open.Jun 12 2017, 2:48 PM

This is again broken, although in a slightly different way:

@matmarex Since you worked on this last time, may I inquire your suggestions for appropriate fix again?

Change 376232 had a related patch set uploaded (by Bartosz Dziewoński; owner: Bartosz Dziewoński):
[mediawiki/extensions/Translate@master] Fix "Mark as reviewed" tooltip's anchor location

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

Change 376232 merged by jenkins-bot:
[mediawiki/extensions/Translate@master] Fix "Mark as reviewed" tooltip's anchor location

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

matmarex closed this task as Resolved.Sep 8 2017, 9:30 PM
matmarex removed a project: Patch-For-Review.