search

SharePoint / sp-dev-docs

SharePoint & Viva Connections Developer Documentation
https://docs.microsoft.com/en-us/sharepoint/dev/
Creative Commons Attribution 4.0 International
1.24k stars 1k forks source link

Child Element Not Accessible With Tab Key #8207

Open username4114 opened 2 years ago

username4114 commented 2 years ago

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

Additional environment details

Issue description

I am using an application customizer to make a Rasa chatbot accessible.

I need to make the child elements of a div container accessible with the tab / (shift + tab) keys.

The container has a tabindex="0" and the child divs and hyperlinks also have a tabindex="0":

<div style="border: 1px solid black; width: 350px; height: 150px;" tabindex="0">
    this is a link: <a href="#" tabindex="0">Link</a>
    <br>
    this is a div: <div style="border: 1px solid black; width: 100px; height: 100px;" tabindex="0"></div>
</div>

If you paste this anywhere in a SharePoint library or a SharePoint list using the browser's inspect element mode, there is no issue.

However, anywhere else (e.g. landing page of the SharePoint site), the problem is that you need to press 'Enter' to access the child elements, and then 'Escape' to 'get out of' the div container.

I would like a solution to make the child elements accessible by using the tab and shift+tab keys.

ghost commented 2 years ago

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

AJIXuMuK commented 1 year ago

@username4114 - sorry for the delay. Lists (and Document Libraries) and Pages are 2 separate SPAs that can behave differently. Unfortunately, as of now there are no plans on making changes to DOM/eventing. I will mark this issue as "tracked" to review it later.