Ensure skip to main content logic is working

[marcellamaki]

Summary

Adds id=main on the div immediately surrounding the <slot/> in AppBarPage where the index page goes.

Note that this does not resolve some lingering semantic page structure issues where there are some ambiguous <main> elements in various plugins/pages, as the existing logic was not actually based on the HTML element but rather the id. My browser extension suggests that the addition of id=main on this div does not add additional main elements to the page that would be confusing (i.e. potentially multiple in a section, if a nested page already has an HTML <main>)

Reviewer guidance

Does skip to main work in all plugins?

---

Testing checklist

• Contributor has fully tested the PR manually
• If there are any front-end changes, before/after screenshots are included
• Critical user journeys are covered by Gherkin stories
• Critical and brittle code paths are covered by unit tests

PR process

• PR has the correct target branch and milestone
• PR has 'needs review' or 'work-in-progress' label
• If PR is ready for review, a reviewer has been added. (Don't use 'Assignees')
• If this is an important user-facing change, PR or related issue has a 'changelog' label
• If this includes an internal dependency change, a link to the diff is provided

Reviewer checklist

• Automated test coverage is satisfactory
• PR is fully functional
• PR has been tested for accessibility regressions
• External dependency files were updated if necessary (yarn and pip)
• Documentation is updated
• Contributor is in AUTHORS.md

[github-actions]

Build Artifacts

Asset type	Download link
PEX file	kolibri-.pex
Windows Installer (EXE)	kolibri-0.17.0b0.dev0+git.19.ge0dd6c4b-windows-setup-unsigned.exe
Debian Package	kolibri_0.17.0b0.dev0+git.19.ge0dd6c4b-0ubuntu1_all.deb
Mac Installer (DMG)	kolibri-0.17.0b0.dev0+git.19.ge0dd6c4b.dmg
Android Package (APK)	kolibri-0.17.0b0.dev0+git.19.ge0dd6c4b-0.1.3-debug.apk
TAR file	kolibri-0.17.0b0.dev0+git.19.ge0dd6c4b.tar.gz
WHL file	kolibri-0.17.0b0.dev0+git.19.ge0dd6c4b-py2.py3-none-any.whl

[radinamatic]

Tested all the pages that have the topbar with the main navigation with NVDA Speech viewer opened, and the Skip to main content is back in business! 👏🏽 💯

Thank you! 🙏🏽

[marcellamaki]

After some discussion with @rtibbles (who is totally, definitely, absolutely not working today) on Slack, he confirmed the correct approach is migrating the id=main to the AppBarPage and Immersive page, and cleaning it up in other places. Other concerns raised on slack about the use of "main" more broadly (as a class name, <main> element, etc.) should be tracked in follow up, and some decisions should be main re: prioritization order for the logic, as well as a consistency for the accessible experience.

So, I'm going to use this + Radina's approval to go ahead and merge, after re-confirming that id=main now only exists in these two files, and that there will not be duplicate ids on the same page (as raised in slack discussion)