[Bug?]: scroll restoration breaks when using Embla

[maxwell8888]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

If I add the official Embla solid wrapper to a page in a SolidStart app, the scroll restoration when using the back button breaks.

Expected behavior 🤔

Adding Embla should not impact SolidStart's scroll restoration

Steps to reproduce 🕹

Steps

1. Init a solid project with routing:

max@max-Latitude-7290:~/projects$ npm init solid

> npx
> create-solid

┌  
 Create-Solid v0.6.11
│
◇  Project Name
│  solid-embla-scroll-restore-mre
│
◇  What type of project would you like to create?
│  SolidStart
│
◇  Use Typescript?
│  Yes
│
◇  Which template would you like to use?
│  with-tailwindcss
│
◇  Project created 🎉
│
◇  To get started, run: ──────────────╮
│                                     │
│  cd solid-embla-scroll-restore-mre  │
│  npm install                        │
│  npm run dev                        │
│                                     │
├─────────────────────────────────────╯

2. Add "embla-carousel-solid": "^8.6.0", to package.json dependencies.
3. Update index.tsx to

import { For } from "solid-js";

export default function Home() {
  return (
    <For each={Array.from({ length: 100 })}>
      {(_, i) => (
        <div class="border-4 border-amber-700 p-20">
          <a href="/about">Hello {i()}</a>
        </div>
      )}
    </For>
  );
}

4. Update about.tsx to

import createEmblaCarousel from "embla-carousel-solid";

export default function About() {
  const [emblaRef, emblaApi] = createEmblaCarousel();

  return (
    <div class="embla__viewport" ref={emblaRef}>
      <div></div>
    </div>
  );
}

5. npm run dev, scroll to e.g. the 21st block that says "Hello 20" , click on the link to /about, click the browser back button, and you are returned to the root page but the scroll is at the top rather than at "Hello 20" where you left it.

Expected Behavior

If you repeat the above steps but without embla in the About component and instead e.g. a simple <div>About</div>, when clicking the browser back button you are returned to the root page but at your previous scroll position i.e. over "Hello 20", as expected for normal web page behaviour which Solid aims to match with it's router, as far as I understand.

Context 🔦

I have removed Embla from my app to ensure scroll restoration works correctly, but I still need a carousel for the app and it is not something that is easy to create myself.

I originally opened an issue in Embla's repo but I just tried to reproduce the issue using TanstackStart and the scroll restoration worked fine so it looks to me more likely an issue with SolidStart rather than Embla.

Your environment 🌎

System:
    OS: Linux 6.14 Ubuntu 24.04.3 LTS 24.04.3 LTS (Noble Numbat)
    CPU: (8) x64
  Binaries:
    Node: 23.8.0 - /home/max/.nvm/versions/node/v23.8.0/bin/node
    npm: 10.9.2 - /home/max/.nvm/versions/node/v23.8.0/bin/npm

package.json:
  "@solidjs/start": "^1.1.0",