Page MenuHomePhabricator

[S] Page content jumps around as loading happens on Structured Data tab via direct anchor link
Closed, ResolvedPublicBUG REPORT

Description

We have this:
When the Structured Data tab on Commons is loaded via a direct link to a statement block via anchor tag, the page content jumps around as all the JavaScript stuff loads.

We want this:
Either the statement content is already in place before the load of the tab happens
OR
there's some sort of transitional or loading state that happens until everything is in place

Screenshots (if possible):

anchor-load-bug.gif (657×828 px, 400 KB)

re-Load_page_issue.gif (678×957 px, 270 KB)

Acceptance Criteria:

  • Content within the structured data tab loaded via an anchor link is stable and doesn't move around.

During development, please test the following:

  • Test this feature while logged in AND logged out
  • Test this feature on at least one mobile browser

COVID-19 Deployment Criteria

  • Can you roll back this change without lasting impact?
    1. A recovery plan is required as this will help identify our capacity for recovering from the failure
    2. THIS IS A KEY QUESTION, if you can’t answer it, you shouldn’t deploy
  • Is specialized knowledge required to support this change in production? If so, are there multiple people with this knowledge?
  • Is there a way to increase confidence about the correctness of this change?
    1. Reviews (Design, Code, etc)
    2. Testing coverage (unit tests, integration tests)
    3. Manual testing (e.g. Beta, vagrant, docker)

Event Timeline

This might depend on gadgets and javascripts loaded. After opening a file things jump around (dangerous to click on anything), but I see no jumping when following an an anchor link

Confirming for e.g. https://commons.wikimedia.org/wiki/File:18-as_villamos_(4097).jpg#P180 on Firefox 75 when throttling the connection a bit
(copying and pasting a link which allows someone else to easily try reproduce is appreciated).

Based on discussion at the estimation meeting, we will try to implement a tab loading delay of 300ms to see if it solves the problem.

CBogen renamed this task from Page content jumps around as loading happens on Structured Data tab via direct anchor link to [S] Page content jumps around as loading happens on Structured Data tab via direct anchor link.Apr 29 2020, 4:32 PM

Change 603432 had a related patch set uploaded (by Matthias Mullie; owner: Matthias Mullie):
[mediawiki/extensions/WikibaseMediaInfo@master] Don't scroll to anchor until it's done initializing

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

Above patch doesn't implement the delay we discussed earlier, but simply waits for the initial rendering (which I believe should include all jumping around) to be complete. I believe that should suffice - if not, we can still add a minor delay.

Change 603432 merged by jenkins-bot:
[mediawiki/extensions/WikibaseMediaInfo@master] Don't scroll to anchor until it's done initializing

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

So, the original problem, with the Structured Data content changing and jumping about as CSS/javascript loads, seems to be solved. But there's a question of whether it takes about a second too long for the user to see the shift from the File Information to the Structured Data tab. It does seem like the page just sits there for a moment before showing the structured data statements in question, and that can give the impression that the anchor link didn't work until the page suddenly shifts to the right place.

For now though, I'd consider this closed and let's keep an eye on user reaction. If the users using this feature are fine with what seems to amount to a second or two delay on average, all is good.