Walkthroughs on phones
How walkthroughs find links your app keeps behind its menu button on a phone, and what to do when one gets stuck.
On a phone, most apps hide their sidebar or top navigation behind a menu button, often a ☰. When a walkthrough's next step is one of those links, Skavelo first says Open the menu first, points at the menu button, and then points at the link once the menu opens. The step card moves out of the way so the link stays in view.
How Skavelo knows which button opens the menu
When Skavelo learns your web app, it also opens one page at phone size. It notes the navigation links that are hidden there, taps the likely menu buttons one at a time, and keeps the one that shows them. That button is used for every walkthrough on a phone from then on. Learning blocks every change while it does this, so nothing is saved or sent.
The activity log on the Learning tab says which button it found, for example "On phones, the navigation opens from "Open menu"". If your app changes its menu, run Re-learn every page from the website's menu so Skavelo checks again.
If learning didn't find a button, Skavelo looks for one on the page: a button that says which part of the page it opens, then one named like a menu.
When a walkthrough gets stuck on a phone
If a user on a phone closes a walkthrough at a step whose link was hidden in the menu, and Skavelo couldn't find a button to open it, it appears in Needs attention as Stuck on a phone, with the step it stopped at. To fix it:
- On the Learning tab, choose Re-learn every page from your web app's menu, so Skavelo looks for the menu button again.
- If it still isn't found, ask a developer to add
data-sk-menuto your menu button. Skavelo then always uses that button. See Marking your menu button.
<button data-sk-menu aria-label="Menu">☰</button>