Background goal
T414518 introduced a new View Suggestions button to indicate when the 1st suggestion available is outside the initial viewport when opening the editor.
This task involves the work of extending the implementation of the View Suggestions button so that it appears as well when the 1st suggestion available is outside the current section being edited.
Story
As someone who is editing a section of an article in using the mobile VisualEditor, I want to be made aware when a suggestion is visible outside the current section being edited and be able to navigate to that suggestion quickly, so that I can discover and act on Suggestions that are outside the section I initially chose to edit.
Proposed solution
the "View suggestion" button will be used for either:
- Navigate to the 1st suggestion when it's outside the initial viewport (when there are suggestions available in that section)
- Navigate to the 1st suggestion when it's outside the current section being edited (in cases where that current section doesn't contain any suggestion)
To avoid that the "View suggestions" button overlaps with the "Edit full page" one, the “View suggestions” button will disappear when the user reaches the “Edit full page” button at the bottom, preventing both buttons from appearing at the same time
Derived Requirement
Ensure that users editing a section in the mobile VisualEditor are notified when the first available suggestion exists outside the section they are currently editing and can quickly navigate to that suggestion using the View suggestions button. Ensure that the View suggestions button navigates users to the first available suggestion when it is outside the initial viewport but within the section being edited. Ensure that the View suggestions button navigates users to the first available suggestion when the current section being edited contains no suggestions but a suggestion exists elsewhere on the page. Ensure that the View suggestions button is hidden when the Edit full page button becomes visible so that both buttons are never displayed simultaneously.
Test Steps
Test Case 1: Ensure the View suggestions button appears when the first suggestion is outside the initial viewport within the current section
- Open a mobile page containing Suggestions.
- Begin editing a section using the mobile VisualEditor.
- Verify that the current section contains at least one suggestion located below the initial visible area.
- Observe the editor immediately after it loads.
- Select View suggestions.
- ✅❓❌⬜ AC1: The View suggestions button is displayed and navigates directly to the first available suggestion outside the initial viewport within the current section.
Test Case 2: Ensure the View suggestions button appears when the current section contains no suggestions but another section does
- Open a mobile page containing Suggestions in a section other than the one being edited.
- Begin editing a section that contains no suggestions using the mobile VisualEditor.
- Observe the editor after it loads.
- Select View suggestions.
- ✅❓❌⬜ AC2: The View suggestions button is displayed and navigates directly to the first available suggestion outside the current section being edited.
Test Case 3: Ensure the View suggestions button is not shown when no suggestions exist on the page
- Open a mobile page that contains no Suggestions.
- Begin editing any section using the mobile VisualEditor.
- Observe the editor after it loads.
- ✅❓❌⬜ AC3: The View suggestions button is not displayed when no suggestions are available anywhere on the page.
Test Case 4: Ensure the View suggestions button hides when the Edit full page button becomes visible
- Open a mobile page containing Suggestions.
- Begin editing a section using the mobile VisualEditor.
- Scroll toward the bottom of the editor until the Edit full page button becomes visible.
- Observe the floating action buttons.
- ✅❓❌⬜ AC4: The View suggestions button is hidden while the Edit full page button is visible so both buttons are never displayed at the same time.
Test Case 5: Ensure the View suggestions button reappears after leaving the Edit full page area
- Open a mobile page containing Suggestions.
- Begin editing a section using the mobile VisualEditor.
- Scroll to the bottom until the Edit full page button is visible.
- Scroll back upward so the Edit full page button is no longer visible.
- Observe the editor.
- ✅❓❌⬜ AC5: The View suggestions button reappears when its display conditions are met after the Edit full page button is no longer visible.
Test Case 6: Ensure navigation always targets the first available suggestion
- Open a mobile page containing multiple Suggestions.
- Begin editing a section using the mobile VisualEditor.
- Select View suggestions.
- Observe the destination after navigation.
- ✅❓❌⬜ AC6: Selecting View suggestions always navigates to the first available suggestion rather than a later suggestion.
Acceptance criteria (or Done)
- Explore possible solutions
- Implement decided solution
QA Results - TestWiki
| AC | Status | Details |
|---|---|---|
| 1 | ✅ | T422979#12102370 |
| 2 | ✅ | T422979#12121738 |
| 3 | ✅ | T422979#12121738 |
| 4 | ✅ | T422979#12102370 |
| 5 | ✅ | T422979#12102370 |
| 6 | ❓ | T422979#12102370 |