Add bypass block to job composer

[Bubballoo3]

Fixes #4959. Copies the same approach from the dashboard into the job composer, including giving the main section the main-container id, and copying css styles to keep the skip button hidden unless it has focus.

[johrstrom]

I'm noticing this in 4.1 dashboard as well, but do we need a tabindex='-1' for it to be the very first thing that's focusable? Seems like I keep landing on the 'ondemand' link when the page loads and i have to shift+tab (go back one link) to get to this.

[Bubballoo3]

I think there might be some browser caching affecting where your focus goes, but for me I can

• load the page
• click into the page (move focus out of the browser taskbar)
• press tab once

And the skip navigation button appears.

Another thing that I recall noticing with NVDA is that tab will start focus on whatever is currently being read. So if you do not respond quickly enough and NVDA begins to read the navbar items, the tab key will start you after the skip navigation button. I'd be curious to know what happens if you execute the steps above with and without NVDA enabled.

Besides the fact, tabindex='-1' removes an item from the focus order, but default focus order is supposed to match the DOM order, so there is no reason it shouldn't be first. Another thing we can compare this with is Github's skip navigation button, which I recall the same behavior happening on.

[johrstrom]

OK!