Page MenuHomePhabricator

Tipsy popup mispositioned on page load
Closed, DeclinedPublic

Description

When displaying a popup immediately after the page is loaded, if the anchor element is itself created by Javascript code, the popup can end up at the wrong position. Possibly the tipsy positioning code runs before the page is repainted and the anchor is updated to its correct position.

Steps to reproduce:

  • install MediaViewer changeset https://gerrit.wikimedia.org/r/#/c/164530/
  • comment out lines 316 and 318 in resources/mmv/mmv.bootstrap.js (which is a workaround for this bug)
  • open a file page, scroll down to the bottom of the image
  • run >> mw.mmv.bootstrap.config.setInLocalStorage( 'mmv-showStatusInfo', '1' ); << in the browser console
  • reload the page

Expected result: a popup appears, and the tip is positioned a few pixels above the "open in Media Viewer" button

Actual results: the tip is positioned well below the button. After closing and reopening ( >> mw.mmv.bootstrap.statusInfoDialog.close() << / >> mw.mmv.bootstrap.statusInfoDialog.open() << ) it is positioned correctly.

(The tipsy element in the example has been significantly restyled but removing all styling does not change anything.)

Workaround: set a timeout so that the tooltip appears later. In my attempts, 1000ms worked but 500 did not. I tried more intelligent approaches (making sure the tooltip does not appear before the domready event, delaying it until .is(':visible') for the button returns true) but they did not work.


Version: unspecified
Severity: normal

Details

Reference
bz72267