Skip to content

Commit

Permalink
[React@18 failing test] fix discover/group3 discover doc viewer flyou…
Browse files Browse the repository at this point in the history
…t accessibility should use expected a11y attributes (#196844)

## Summary

We're working on upgrading Kibana to React@18 (in Legacy Mode). There
are a couple failing tests when running React@18 in Legacy mode and this
is one of them


[[job]](https://buildkite.com/elastic/kibana-pull-request/builds/243743#01929ee7-11b8-41c3-af79-1437561a6ef0)
[[logs]](https://buildkite.com/organizations/elastic/pipelines/kibana-pull-request/builds/243743/jobs/01929ee7-11b8-41c3-af79-1437561a6ef0/artifacts/01929f0a-dc7a-42ff-9a01-809c31e1dc71)
FTR Configs #58 / discover/group3 discover doc viewer flyout
accessibility should use expected a11y attributes

This one is simple. Native to react `useId` implementation produces ids
like this: `:r3:` and when you attempt to use such ids with id selector
they're invalid . e.g. `document.querySelector('#:r3:')` throws an
error. A workaround is to use attribute selector
`document.querySelector('[id=":r3:"]')`. This is the same problem as
we've seen before #191632
  • Loading branch information
Dosant authored Oct 18, 2024
1 parent f86d171 commit cf5d2e7
Showing 1 changed file with 2 additions and 2 deletions.
4 changes: 2 additions & 2 deletions test/functional/apps/discover/group3/_doc_viewer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -625,7 +625,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
);
expect(role).to.be('dialog');
expect(tabindex).to.be('0');
expect(await find.existsByCssSelector(`#${describedBy}`)).to.be(true);
expect(await find.existsByCssSelector(`[id="${describedBy}"]`)).to.be(true);
expect(noFocusLock).to.be('true');
// overlay flyout
await reduceScreenWidth();
Expand All @@ -635,7 +635,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
noFocusLock = await testSubjects.getAttribute('docViewerFlyout', 'data-no-focus-lock');
expect(role).to.be('dialog');
expect(tabindex).to.be('0');
expect(await find.existsByCssSelector(`#${describedBy}`)).to.be(true);
expect(await find.existsByCssSelector(`[id="${describedBy}"]`)).to.be(true);
expect(noFocusLock).to.be(null);
});
});
Expand Down

0 comments on commit cf5d2e7

Please sign in to comment.