diff --git a/docs/docs/observed.md b/docs/docs/observed.md
index 076e5bff..8636e1e9 100644
--- a/docs/docs/observed.md
+++ b/docs/docs/observed.md
@@ -52,6 +52,11 @@ Returns the observed element currently in the DOM for a name, or `null`.
const element = observedElement.getElement("myButton");
```
+When multiple elements share a name, an accessibility filter skips ineligible
+registrations and returns the first eligible match in registration order.
+The same selection applies to pending `waitElement()` and `requestFocus()`
+calls; an ineligible earlier registration does not block a later eligible one.
+
### `waitElement()`
Waits (up to `timeout` ms) for an element with the given name to appear.
diff --git a/src/State/ObservedElement.ts b/src/State/ObservedElement.ts
index 943bd66d..d7f14bbd 100644
--- a/src/State/ObservedElement.ts
+++ b/src/State/ObservedElement.ts
@@ -280,7 +280,9 @@ export class ObservedElementAPI
delete this._observedById[uid];
}
- return el;
+ if (el) {
+ return el;
+ }
}
}
@@ -615,7 +617,10 @@ export class ObservedElementAPI
!waitingAccessibleElement.conditionTimer
) {
const resolveAccessible = () => {
- const element = this.getElement(observedName);
+ const element = this.getElement(
+ observedName,
+ ObservedElementAccessibilities.Accessible
+ );
if (
element &&
@@ -644,7 +649,10 @@ export class ObservedElementAPI
!waitingFocusableElement.conditionTimer
) {
const resolveFocusable = () => {
- const element = this.getElement(observedName);
+ const element = this.getElement(
+ observedName,
+ ObservedElementAccessibilities.Focusable
+ );
if (
element &&
diff --git a/tests/ObservedElement.test.tsx b/tests/ObservedElement.test.tsx
index 1a766dff..3d5b1e95 100644
--- a/tests/ObservedElement.test.tsx
+++ b/tests/ObservedElement.test.tsx
@@ -7,6 +7,7 @@ import * as React from "react";
import {
getTabsterAttribute,
Types,
+ ObservedElementAccessibilities,
ObservedElementRequestStatuses,
ObservedElementFailureReasons,
} from "tabster";
@@ -17,6 +18,191 @@ describe("Focusable", () => {
await BroTest.bootstrapTabsterPage({ observed: true });
});
+ it("should return the first eligible duplicate for the requested accessibility", async () => {
+ const name = "duplicate";
+ const observed = getTabsterAttribute({ observed: { names: [name] } });
+
+ await new BroTest.BroTest(
+