From 3afda4effc4a099632138c5874ab305baaa5934a Mon Sep 17 00:00:00 2001 From: Austin Greene Date: Wed, 19 May 2021 15:26:40 -0700 Subject: [PATCH] FIX: JS error in @axe-core/react caused by stale reference to heading Noticed a small bug when testing out a newer version of @axe-core/react (we were on a pretty old version of react-axe), we have a case where a heading gets removed during an animation and it seems that heading-order-after is called with a stale result such that when trying to find it's index in the heading order it can't be found and we see a error in the console like `TypeError: Cannot read property 'level' of undefined`. This is a simple naive fix to not use the index if it is -1, but I'm happy to try a different strategy if somebody with more context has a better one! --- lib/checks/navigation/heading-order-after.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/lib/checks/navigation/heading-order-after.js b/lib/checks/navigation/heading-order-after.js index 14cb93acce..13a90939f1 100644 --- a/lib/checks/navigation/heading-order-after.js +++ b/lib/checks/navigation/heading-order-after.js @@ -113,10 +113,12 @@ function headingOrderAfter(results) { return heading.ancestry === path; }); const index = headingOrder.indexOf(heading); - headingOrder.splice(index, 1, { - level: headingOrder[index].level, - result - }); + if (index > -1) { + headingOrder.splice(index, 1, { + level: headingOrder[index].level, + result + }); + } }); // remove any iframes that aren't in context (level == -1)