SOLVED: Slider (Nestable) previous arrow receives aria-label="undefined"

Browser: Chrome 110
OS: macOS / Windows / Linux / etc.
URL: N/A
Video: N/A

Hi Bricks team,

I’m seeing an accessibility-label issue with Slider (Nestable) in Bricks 2.4.1.

On the frontend, the previous-arrow button receives:

aria-label="undefined"

The next-arrow button correctly receives:

aria-label="Next slide"

Both arrows still navigate correctly; the issue is specifically the previous button’s accessible name.

Source findings

In assets/js/frontend.js, Bricks supplies:

splideOptions.i18n = {
  prev: window.bricksData.i18n.prevSlide,
  next: window.bricksData.i18n.nextSlide,
  // ...
}

However, the bundled assets/js/libs/splide.js, around line 2005, reads:

var prevLabel =
  prevIndex > -1 && index < prevIndex
    ? i18n.last
    : i18n.previous

The apparent mismatch is prev versus previous. The bundled library’s own default translation dictionary also uses prev.

We compared the installed files against a freshly downloaded official Bricks 2.4.1 ZIP. Both Splide builds and frontend.js are byte-for-byte identical, and the mismatch exists in the ZIP too. No theme files were modified.

To check

  1. Add a Slider (Nestable) with several slides.
  2. Use the Slide type and enable arrows.
  3. View the frontend and inspect the previous button’s aria-label.
  4. Advance a slide and inspect it again.

Our observed case is inside a reusable component, but the mismatch appears in the bundled initialization/library code.

Could you confirm this and correct the previous-arrow translation-key mismatch in an upcoming release?

Thanks!

We’ve addressed this in Bricks 2.4.2, now available as a one-click update in your WordPress Dashboard.

Please read the changelog entry before updating, and let us know if you experience any issues.