JumpTo Main does not work on Home Page

[mcking65]

In the preview of PR 99 where the APG JumpTo menu is implemented, jump to main content function does not work on the APG Home page in the /WAI/ARIA/APG site.

Jump to main landmark works on all other pages in the site. Jump to other landmarks and headings works on the home page. It is only jumping to the main content landmark on the home page that does not work.

[jongund]

@mcking65
It looks like there is a hidden H1 on the home page.
JumpTo looks for the first child heading in main to set focus, JumpTo is assuming that the first heading in a main element is visible.
What is the purpose of the hidden H1?

Jon

[mcking65]

I'll let @alflennik or @richnoah explain the hidden h1; I don't know.

However, I'm thinking about the robustness of the jump to main algorithm. It doesn't seem very robust to assume that main starts with a heading. Sometimes there is an H1 outside of main and a fair bit of content that precedes the first heading in main. While not ideal design, that does happen on some web sites. Would jump To main not work on those sites? Would it jump to a heading that is far from the beginning of main?

I like the experience when main starts with a heading an jumpTo focuses that heading; it works very nicely. I am concerned about situations where that may not be the best behavior. In some situations, it could be better to focus a div containing text, a paragraph, or some other element. I wonder if it would be more reliable if focus were set on the main element itself in cases that are ambiguous.

At a minimum, the algorithm should probably check to ensure the element it will focus is visible.

[mcking65]

@jongund

Are you able to look into this? What are your thoughts on my previous comment?

[jongund]

Here is a an update to the SkipTo.js script that should fix the problem of trying to move focus to a hidden header.

https://github.com/paypal/skipto/tree/dev/v4.2/downloads/js

As per the conversation today, the APG will just switch from using "JumpTo" to using "SkipTo" to eliminate the need to maintain two separate code repositories and make it easier for other people to add the "SkipTo" functionality to their website.

[mcking65]

This is fixed by #125 by having the hidden H1 removed. However, #131 also ensures that the skipto function only focuses visible elements.