[Bug]: Selected slide gets reset on window resize if using breakpoints

Author: twillhornCreated Sep 11, 2025Updated Sep 13, 2025
Labelsbugcore

Which variants of Embla Carousel are you using?

  • embla-carousel (Core)
  • embla-carousel-react
  • embla-carousel-vue
  • embla-carousel-svelte
  • embla-carousel-autoplay
  • embla-carousel-auto-scroll
  • embla-carousel-solid
  • embla-carousel-auto-height
  • embla-carousel-class-names
  • embla-carousel-fade
  • embla-carousel-docs (Documentation)
  • embla-carousel-docs (Generator)

Steps to reproduce

I had options like this:

const [emblaRef, emblaApi] = useEmblaCarousel(
{
     breakpoints: {
       '(min-width: 0px)': {
         align: 'center',
         startIndex: selectedSlideIndex,
       },
       '(min-width: 1024px)': {
         align: 'start',
         startIndex: selectedSlideIndex,
       },
     },
 }
)

If I scroll away from the starting slide, then resize the window, reInit is triggered and it reverts the carousel to the startIndex. Looking at the code I realized that by using breakpoints I was bypassing the logic to preserve the selected slide on reActivate: https://github.com/davidjerleke/embla-carousel/blob/e3dbdb33f7b1da756ba2af561c4247c33f816d1a/packages/embla-carousel/src/components/EmblaCarousel.ts#L130

I was able to fix the issue by pulling up the startIndex

const [emblaRef, emblaApi] = useEmblaCarousel(
{
      startIndex: selectedSlideIndex,
      breakpoints: {
        '(min-width: 0px)': {
          align: 'center',
        },
        '(min-width: 1024px)': {
          align: 'start',
        },
      },
  }
)

But if someone needs to have separate startIndex in their breakpoints they won't be able to do this,.

Expected Behavior

startIndex should be preserved, even in breakpoints, in the reActivate case

Additional Context

I have also tried...

What browsers are you seeing the problem on?

Chrome

Version

v8.3.1

CodeSandbox

https://codesandbox.io/p/devbox/embla-carousel-default-react-forked-n58dkk?workspaceId=ws_756UjTF2dBHsKJZDhYR1G5

Before submitting

  • I've made research efforts and searched the documentation
  • I've searched for existing issues
  • I agree to follow this project's Contributing Guidelines for bug reports

Source: davidjerleke/embla-carousel