From 2797a923b1bb1313f84c7e3c8fd32cc61b32ce31 Mon Sep 17 00:00:00 2001 From: Johannes Emerich Date: Mon, 26 Aug 2024 13:08:07 +0200 Subject: [PATCH 1/3] Fix outdated docs for 'focusInitial' --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index fb8272b..c0f7cd3 100644 --- a/index.js +++ b/index.js @@ -77,7 +77,7 @@ function handleUserDirection(direction) { * Standard heuristics are used to determine which element should be the first to receive focus. * * 1. Look for elements with explicit tabindex attribute set, choose lowest index > 0 - * 2. If no tabindex was set, treat container as a 'first' group + * 2. If no tabindex was set, treat container as a 'linear' group * * @param {Direction} direction * @param {Element} container From 0ae55d3a591be6efdc4761a20c7826dc6a918477 Mon Sep 17 00:00:00 2001 From: Johannes Emerich Date: Mon, 26 Aug 2024 16:08:29 +0200 Subject: [PATCH 2/3] Add regression test for linear groups with full size items --- cypress/e2e/spec.cy.ts | 32 ++++++++++++++++++++++ cypress/fixtures/group-linear-stretch.html | 29 ++++++++++++++++++++ 2 files changed, 61 insertions(+) create mode 100644 cypress/fixtures/group-linear-stretch.html diff --git a/cypress/e2e/spec.cy.ts b/cypress/e2e/spec.cy.ts index 29d7adc..cd06ca9 100644 --- a/cypress/e2e/spec.cy.ts +++ b/cypress/e2e/spec.cy.ts @@ -186,6 +186,38 @@ describe("focus-shift spec", () => { ]) ) + it( + "linear-type group with stretched item LR", + testFor("./cypress/fixtures/group-linear-stretch.html", { className: "rows" }, [ + { eventType: "keydown", selector: "#button-big", options: keyevent({ key: "ArrowLeft" }) }, + { eventType: "keydown", selector: "#button-small", options: keyevent({ key: "ArrowDown" }) } + ]) + ) + + it( + "linear-type group with stretched item RL", + testFor("./cypress/fixtures/group-linear-stretch.html", { className: "rows" }, [ + { eventType: "keydown", selector: "#button-big", options: keyevent({ key: "ArrowRight" }) }, + { eventType: "keydown", selector: "#button-small", options: keyevent({ key: "ArrowDown" }) } + ]) + ) + + it( + "linear-type group with stretched item TD", + testFor("./cypress/fixtures/group-linear-stretch.html", { className: "columns" }, [ + { eventType: "keydown", selector: "#button-big", options: keyevent({ key: "ArrowDown" }) }, + { eventType: "keydown", selector: "#button-small", options: keyevent({ key: "ArrowRight" }) } + ]) + ) + + it( + "linear-type group with stretched item DT", + testFor("./cypress/fixtures/group-linear-stretch.html", { className: "columns" }, [ + { eventType: "keydown", selector: "#button-big", options: keyevent({ key: "ArrowUp" }) }, + { eventType: "keydown", selector: "#button-small", options: keyevent({ key: "ArrowRight" }) } + ]) + ) + it( "memorize-type group TD", testFor("./cypress/fixtures/group-memorize.html", { className: "rows" }, [ diff --git a/cypress/fixtures/group-linear-stretch.html b/cypress/fixtures/group-linear-stretch.html new file mode 100644 index 0000000..577541b --- /dev/null +++ b/cypress/fixtures/group-linear-stretch.html @@ -0,0 +1,29 @@ + + + + + + + + + +
+ + +
+ + + From 95eaa8f1cd21aed37f241a97840e97c12af273bc Mon Sep 17 00:00:00 2001 From: Johannes Emerich Date: Mon, 26 Aug 2024 13:09:02 +0200 Subject: [PATCH 3/3] Fix linear moves with large elements The implementation incorrectly inverted the direction of movement for both the origin point and element annotation, but it should only be done for the origin point. --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index c0f7cd3..060593a 100644 --- a/index.js +++ b/index.js @@ -515,7 +515,7 @@ function focusActiveElement(direction, origin, group) { function focusLinear(direction, origin, group) { const originPoint = makeOrigin(opposite(direction), origin) const candidates = getFocusableElements(group).map((candidate) => - annotate(opposite(direction), origin, candidate) + annotate(direction, origin, candidate) ) const bestCandidate = getMinimumBy(candidates, (candidate) => euclidean(originPoint, candidate.point)