Page MenuHomePhabricator

Wikidata Tours: User can reach a step where the tour popup needs to attach to an element which is not visible
Closed, ResolvedPublic5 Estimated Story Points

Description

If you use only the "next" arrow to get to the next tour window, then you can reach later steps without having actually completed the task in each instruction window.
If the skipped task was needed in order to show an element on screen for the next step, then the instruction window will default to the middle of the screen as the element it needs to attach to is not visible
Steps to reproduce:

  • Load this tour - https://test.wikidata.org/w/index.php?title=Q1027&tour=wbqualifiers&data=ok
  • On Step 6 "Add Qualifiers", do not complete the instruction to click on the "edit" button. Instead just click the "next" arrow.
  • On step 7, you can see that the tour popup is just in the centre of the screen. It is trying to attach to the "Add qualifier" button, but this is not visible because the "edit" section was not been opened in Step 6.

Expected behaviour:

  • Clicking next should trigger the behaviour of clicking "Add Qualifiers"

Acceptance criteria:

  • Pop up of the step 7 is attached to Add qualifier button, regardless of whether the Tour participant has click it or has just clicked "next" arrow on the previous step of the tour.

Event Timeline

WMDE-leszek set the point value for this task to 5.May 28 2019, 12:53 PM

Here is what I have so far.


A short screen record of the tour with expected behaviour

Here is what I have so far.


A short screen record of the tour with expected behaviour

nice idea recording it :)

What I see on the recording is basically what this task describes, great stuff @Rosalie_WMDE !
One think I noticed, that it looks like the "Add qualifier" was clicked twice, i.e. there are two "Property" fields and two "remove" icons. This is due to accidental double clicking for reporting, right?

For others to learn more about Wikidata Tours, it would be great to see the code you've changed. With Wikidata Tours being the wiki-specific script this is going to be a bit tricky, but maybe sharing the relevant files as Github gist or something like this would work here?

For others to learn more about Wikidata Tours, it would be great to see the code you've changed. With Wikidata Tours being the wiki-specific script this is going to be a bit tricky, but maybe sharing the relevant files as Github gist or something like this would work here?

Thank you. Will fix it and submit for review on github.

nice idea recording it :)

haha, Thanks.

For others to learn more about Wikidata Tours, it would be great to see the code you've changed. With Wikidata Tours being the wiki-specific script this is going to be a bit tricky, but maybe sharing the relevant files as Github gist or something like this would work here?

it should be possible to see what (will be) changed on the page history, right? but a gist would be nicer indeed.. I wonder if we can find a way to push those into a git repo instead of being wiki pages, but probably that's gonna be lots work that's not worth it?

Change 526379 had a related patch set uploaded (by Rosalie Perside (WMDE); owner: Rosalie Perside (WMDE)):
[mediawiki/extensions/GuidedTour@master] Make the tour steps take action on the page when user does not

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

Actually the change made onWiki is just 3 lines (2 in MediaWiki:Guidedtour-tour-wbqualifier and 1 in MediaWiki:Guidedtour-lib.js). The rest of the change is in the extension folder, see the change on gerrit above.
The github gist https://gist.github.com/rosalieper/815d1a28dc458d3d47f90d1c9bfc5c15/revisions

Also, the change on github has the double click fixed.

Change 526379 merged by jenkins-bot:
[mediawiki/extensions/GuidedTour@master] Make the tour steps take action on the page when user does not

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

Is there anything needed to be done to get it to work on production?

Is there anything needed to be done to get it to work on production?

There are some onWiki changes to do. This gist has the diff https://gist.github.com/rosalieper/815d1a28dc458d3d47f90d1c9bfc5c15/revisions. (The first revision is just addition of original files. The latest revisions shows the changes.)

  NODES
Idea 2
idea 2
Note 3
Project 4