User tests: Successful: Unsuccessful:
When a tour step targets a fancy select box (like the category or the tags field), the dropdown, although accessible with the keyboard, is not accessible with the mouse. Therefore, it is impossible to select a category or a tag via the mouse.
This PR fixes the issue by allowing a target and all inner elements to be available over the tour overlay.
Start the 'Create an article' tour. Go all the way to the selection of a category.
Then try and select tags.
Go through a couple tours to ensure there is no side-effect and that all tours can be run properly.
Note: the z-index of the overlay is 9997, the z-index of the step popups is 9999.
Therefore I chose a z-index of 9998 for the targets.
A good tour to test z-index values is the welcome tour. In the 'notifications panel' step, step and target can start to overlap on a smaller size window.
The dropdown cannot be clicked.
The dropdown can be clicked.
In the welcome tour:
Please select:
Documentation link for docs.joomla.org:
No documentation changes for docs.joomla.org needed
Pull Request link for manual.joomla.org:
No documentation changes for manual.joomla.org needed
Status | New | ⇒ | Pending |
Category | ⇒ | Repository NPM Change |
Labels |
Added:
NPM Resource Changed
PR-5.2-dev
|
Thank you for testing this PR!
Comment: In "Welcome tour > Notifications panel", step and target overlap on a smaller size window ("iphone se" on firefox responsive design mode). Why is the tour step not on top of the notifications panel?
The tours are not supported on screens smaller than 526 pixels (whenever the admin menu turns into 'mobile' mode).
That said, this is what I see when emulating IPhone SE in Firefox:
I have tested this item ✅ successfully on bb2a154
Thank you, works now as expected :)
Status | Pending | ⇒ | Ready to Commit |
RTC
Labels |
Added:
RTC
|
Status | Ready to Commit | ⇒ | Fixed in Code Base |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2024-08-29 11:10:17 |
Closed_By | ⇒ | Hackwar |
I have tested this item ✅ successfully on bb2a154
Test: All guided tours (macbook air, 13-inch, 2019).
Comment: In "Welcome tour > Notifications panel", step and target overlap on a smaller size window ("iphone se" on firefox responsive design mode). Why is the tour step not on top of the notifications panel?
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/43960.