ARIA Accessibility improvements (#10674)

* Add missing aria-expanded attributes

* Improve autoComplete for phone numbers & email addresses

* Fix room summary card heading order

* Fix missing label on timeline search field

* Use appropriate semantic elements for dropdown listbox

* Use semantic list elements in keyboard settings tab

* Use semantic list elements in spotlight

* Fix types and i18n

* Improve types

* Update tests

* Add snapshot test
This commit is contained in:
Michael Telatynski 2023-04-20 18:13:30 +01:00 committed by GitHub
parent 2da52372d4
commit 782060a26e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
24 changed files with 611 additions and 157 deletions

View file

@ -174,7 +174,7 @@ describe("Spotlight Dialog", () => {
expect(filterChip.innerHTML).toContain("Public rooms");
const content = document.querySelector("#mx_SpotlightDialog_content")!;
const options = content.querySelectorAll("div.mx_SpotlightDialog_option");
const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options.length).toBe(1);
expect(options[0].innerHTML).toContain(testPublicRoom.name);
});
@ -196,7 +196,7 @@ describe("Spotlight Dialog", () => {
expect(filterChip.innerHTML).toContain("People");
const content = document.querySelector("#mx_SpotlightDialog_content")!;
const options = content.querySelectorAll("div.mx_SpotlightDialog_option");
const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options.length).toBeGreaterThanOrEqual(1);
expect(options[0]!.innerHTML).toContain(testPerson.display_name);
});
@ -242,7 +242,7 @@ describe("Spotlight Dialog", () => {
expect(filterChip.innerHTML).toContain("Public rooms");
const content = document.querySelector("#mx_SpotlightDialog_content")!;
const options = content.querySelectorAll("div.mx_SpotlightDialog_option");
const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options.length).toBe(1);
expect(options[0]!.innerHTML).toContain(testPublicRoom.name);
@ -265,7 +265,7 @@ describe("Spotlight Dialog", () => {
expect(filterChip.innerHTML).toContain("People");
const content = document.querySelector("#mx_SpotlightDialog_content")!;
const options = content.querySelectorAll("div.mx_SpotlightDialog_option");
const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options.length).toBeGreaterThanOrEqual(1);
expect(options[0]!.innerHTML).toContain(testPerson.display_name);
});
@ -324,7 +324,7 @@ describe("Spotlight Dialog", () => {
await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!;
options = content.querySelectorAll("div.mx_SpotlightDialog_option");
options = content.querySelectorAll("li.mx_SpotlightDialog_option");
});
it("should find Rooms", () => {
@ -350,7 +350,7 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers();
const options = document.querySelectorAll("div.mx_SpotlightDialog_option");
const options = document.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options.length).toBeGreaterThanOrEqual(1);
expect(options[0]!.innerHTML).toContain(testPerson.display_name);
@ -372,7 +372,7 @@ describe("Spotlight Dialog", () => {
await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!;
const options = content.querySelectorAll("div.mx_SpotlightDialog_option");
const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options.length).toBe(1);
expect(options[0].innerHTML).toContain(testPublicRoom.name);