Page MenuHomePhabricator

Wikidata page scrolls back to "In more languages" block after every change of DOM
Open, HighPublicBUG REPORT

Description

Problem:
Item pages are seemingly randomly scrolling back to the "in more languages" block after changes in the DOM.

Video: https://www.youtube.com/watch?v=racoqXQFNpA

Steps to reproduce:
Option 1:

  1. On Item page scroll to the end of "In more languages" block: "In more languages" line shouldn't be visible, but "All entered languages" should be
  2. Run $( '.wikibase-title-id' ).text( 'test' ); in console (or just reload a page)
  3. Page will scroll back to the "In more languages" title

Option 2:

  1. Enable one of the live clock gadgets
  2. Open Item page
  3. Scroll past "In more languages" block
  4. Page will scroll back to "in more languages" title

Option 3:

  1. Open Item page
  2. Scroll down past "in more languages" block
  3. Hover over "edit" link on a statement
  4. Page will scroll back to "in more languages" title

Notes:

  • It seems to have started after March 18th
  • This seems to be happening in Chrome but not Firefox
  • This happens on both Items and Properties

Event Timeline

For me, the problem shows up in a different spot too: When I have the language box open, I can scroll to approximately the 10th or 11th language on the list and then it bounces back up to the top of the screen. Anything below that is inaccessible.

Anything below the label box is inaccessible unless I wait a long time for whatever is causing this problem to stop/finish and is not guaranteed even then.

(Also, I have neither clock gadget enabled.)

I can reproduce it by doing step 1 and then hovering over an edit link

I also have this problem. Sometimes I can break out of it by repeatedly changing my screen zoom (CTRL-, CTRL+).

Lydia_Pintscher changed the subtype of this task from "Task" to "Bug Report".

I had this problem in Chrome and not in Firefox. Got rid of it by turning off the Local Live Clock gadget.

I have this problem in Chrome and I do not have the UTC live clock gadget enabled.

I can't reproduce it, tried with all options said above. Maybe clean your cache?

Lydia_Pintscher added a subscriber: Lydia_Pintscher.

I can't reproduce it, tried with all options said above. Maybe clean your cache?

We could just reproduce it again with a new login as well. Are you trying in Chrome? Do you still have "in more languages" visible?
Noa and Tonina are having a look.

Reverting https://gerrit.wikimedia.org/r/c/mediawiki/extensions/Wikibase/+/670912 would fix it (one of the sticky css patches). but if it's possible, finding a solution would be better.

Reverting https://gerrit.wikimedia.org/r/c/mediawiki/extensions/Wikibase/+/670912 would fix it (one of the sticky css patches). but if it's possible, finding a solution would be better.

According to https://caniuse.com/css-sticky position: sticky is partially supported for Chrome v. 89 and 90 and fully supported for 91-92.
The latest version I get when I update Chrome is 89, though, so people still get the somewhat-supported version of position: sticky.
That might be the cause of the bug, though I don't get why it happens only on Vector and not on Timeless for example.

The partial support footnote says:

Supported on th elements, but not thead or tr - See Chrome bug

Can it be related?

Using Chrome and having the same problem in Wikidata when hovering over "add statement". Closing up the "In more languages" panel seems to stop it. Making that panel visible again, makes the big start happening again.

Change https://gerrit.wikimedia.org/r/c/mediawiki/extensions/Wikibase/+/670912 has been reverted to fix this bug.
The change will be re-introduced once Chrome starts fully supporting position: sticky. Please see T212191

Waiting for deployment to test this fix.

Well done figuring out the root cause 😃