Single stories doesn't work

[rubencanovaca]

Describe the bug

https://histoire.dev/examples/vue3/single-stories.html#within-an-iframe

Single stories doesn't work (without layout property or with { type: 'single' }) and just show the side menu recursively. A warning appears in the console:

[Vue Router warn]: No match found for location with path "/__sandbox"

Locally it works (serve), but not into the dist folder (build), so it's impossible to upload it to production.

Reproduction

System Info

System:
    OS: macOS 13.4
    CPU: (8) arm64 Apple M1 Pro
    Memory: 46.92 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.13.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 9.2.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 113.0.5672.126
    Safari: 16.5
  npmPackages:
    @histoire/plugin-vue: ^0.16.1 => 0.16.1 
    @vitejs/plugin-vue: ^4.0.0 => 4.1.0 
    histoire: ^0.16.1 => 0.16.1 
    vite: ^4.0.0 => 4.2.1

Used Package Manager

yarn

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• The provided reproduction is a minimal reproducible example of the bug.

[sloba88]

I have the same issue, clearly something regarding routing is broken. I was able to work around it by setting:

defaultStoryProps: {
    layout: {
      type: 'single',
      iframe: false,
    }
}

in histoire.config.ts

[SebiBasti]

I have the same issue, clearly something regarding routing is broken. I was able to work around it by setting:

defaultStoryProps: {
    layout: {
      type: 'single',
      iframe: false,
    }
}

in histoire.config.ts

Amazing, that fixed it for me!

[rubencanovaca]

I have the same issue, clearly something regarding routing is broken. I was able to work around it by setting:

defaultStoryProps: {
    layout: {
      type: 'single',
      iframe: false,
    }
}

in histoire.config.ts

But I need a responsive layout (for a component that behaves in different ways on different screen sizest), and there is no way with iframe: false