diff --git a/src/components/ItaliaTheme/Blocks/Listing/Commons/utils.js b/src/components/ItaliaTheme/Blocks/Listing/Commons/utils.js index c72dbeb7e..82282bd32 100644 --- a/src/components/ItaliaTheme/Blocks/Listing/Commons/utils.js +++ b/src/components/ItaliaTheme/Blocks/Listing/Commons/utils.js @@ -61,7 +61,7 @@ export const useSlider = (userAutoplay) => { if ((userAutoplay && !slide) || (userAutoplay && !slide.length > 0)) return; - // Custom handling of focus as per Arter a11y audit and request + // Custom handling of focus for a11y const link = visibleSlideTitle( `a.slide-link[data-slide="${currentSlide}"]`, ); @@ -70,7 +70,14 @@ export const useSlider = (userAutoplay) => { return; } // eslint-disable-next-line no-unused-expressions - else link.focus(); + else if ( + // if the focus was already on a slide, move it to the current one + Array.from(document.querySelectorAll('.slick-slide')).some((el) => + el.contains(document.activeElement), + ) + ) { + link.focus(); + } }; return { diff --git a/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx index daa0a93ed..d68ca7704 100644 --- a/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx +++ b/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx @@ -50,7 +50,7 @@ const messages = defineMessages({ }); function NextArrow(props) { - // Custom handling of focus as per Arter a11y audit and request + // Custom handling of focus for a11y const { className, style, onClick, intl, currentSlide } = props; const handleClick = (options) => { onClick(options, false); @@ -85,7 +85,7 @@ function NextArrow(props) { } function PrevArrow(props) { - // Custom handling of focus as per Arter a11y audit and request + // Custom handling of focus for a11y const { className, style, @@ -225,7 +225,7 @@ const SliderTemplate = ({ }; const renderCustomDots = (props) => { - // Custom handling of focus as per Arter a11y audit and request + // Custom handling of focus for a11y return (