Add skip to top/bottom links to chat

[dhinrichs-scottlogic]

Feature Request

Description

• Add a "Skip to chat input" skiplink (shows up on tabbing to) Button to the top of the chatbox
• Add a "Skip to top of chat" skiplink (shows up on tabbing to) Button to the end of the chatbox

Acceptance criteria

GIVEN The the keyboard focus is on the chat input
WHEN the user tabs to the previous element (shift + tab)
THEN the "skip to top of chat" skip link shows up

WHEN the user activates that link (enter)
THEN the keyboard focus jumps to the "skip to chat input" skip link at the top of the chatbox

WHEN the user activates that link (enter)
THEN the keyboard focus jumps to the chat input

WHEN the keyboard focus is not on the skip links
THEN the skip links are not visible

[pmarsh-scottlogic]

alternative might be to add a "skip to chat box" button at the top of the website

[gsproston-scottlogic]

Adding a question label as we probably want to define exactly when this should happen, and update the ACs for that.

It'd definitely be good to autofocus on the chat box after refreshing or coming to the app for the first time.
Do we want to focus on the chat box after switching levels?

[dhinrichs-scottlogic]

Yes, on second thought, autofocus on the input would mess with the order of content/focus, so that could actually create an accessibility issue. A skip link, and/or ensuring focus is maintained after refresh might be an idea though.
Need to think this through a bit more.

[gsproston-scottlogic]

Just noticed this wasn't added to the project board, so it went under the radar. Added now.

[chriswilty]

@dhinrichs-scottlogic, @pmarsh-scottlogic Is this the issue you were going to look at together, to give more detail on the "Skip To" idea?