Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Latest releases of Histoire and Nuxt are not compatible #472

Closed
6 tasks done
clemcode opened this issue Mar 4, 2023 · 3 comments · Fixed by #473
Closed
6 tasks done

Latest releases of Histoire and Nuxt are not compatible #472

clemcode opened this issue Mar 4, 2023 · 3 comments · Fixed by #473
Labels
to triage This issue needs to be triaged

Comments

@clemcode
Copy link

clemcode commented Mar 4, 2023

Describe the bug

Versions:
histoire, @histoire/plugin-nuxt, @histoire/plugin-vue : 0.15.8
nuxt: 3.2.3

Hi!

When running story:dev with the latest releases of Histoire and Nuxt, an Iframe containing the rendered app.vue file gets displayed below the actual story (See image below). If you scroll down the page on the repro, you will notice that the same page is also displayed below the viewport.

A few errors are also thrown at startup, but don't seem to prevent the app from running.

Sourcemap for "/__resolved__virtual:$histoire-theme.css" points to missing source files
stories/test.story.vue 4302ms (setup:31ms, execute:3183ms, run:1088ms)
[nuxt] error caught during app initialization ReferenceError: document is not defined
    at normalizeContainer (file:///home/projects/nuxt-starter-7hjhxl/node_modules/@vue/runtime-dom/dist/runtime-dom.cjs.js:1616:21)
    at app.mount (file:///home/projects/nuxt-starter-7hjhxl/node_modules/@vue/runtime-dom/dist/runtime-dom.cjs.js:1537:27)
    at initApp (file:///home/projects/nuxt-starter-7hjhxl/node_modules/nuxt/dist/app/entry.mjs:55:14)
Collect stories end 17800ms
Collect stories start all
stories/test.story.vue 96ms (setup:57ms, execute:1ms, run:38ms)
Collect stories end 108ms

Thanks for this awesome project, can't wait to use it with Nuxt!

Reproduction

https://stackblitz.com/edit/nuxt-starter-7hjhxl

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
  npmPackages:
    @histoire/plugin-nuxt: ^0.15.8 => 0.15.8 
    @histoire/plugin-vue: ^0.15.8 => 0.15.8 
    histoire: ^0.15.8 => 0.15.8

Used Package Manager

npm

Validations

@clemcode clemcode added the to triage This issue needs to be triaged label Mar 4, 2023
@stackblitz
Copy link

stackblitz bot commented Mar 4, 2023

Fix this issue in StackBlitz Codeflow Start a new pull request in StackBlitz Codeflow.

@medfreeman
Copy link
Contributor

I confirm that the bug happens since @histoire/plugin-nuxt version 0.15.0:
https://github.com/histoire-dev/histoire/releases/tag/v0.15.0

relevant PR: #443

@medfreeman
Copy link
Contributor

medfreeman commented Mar 6, 2023

Additional reproduction here: https://stackblitz.com/edit/histoire-nuxt3-starter-eb2jnf
(This is the same stackblitz i proposed in #471)

I also reproduced it locally by cloning this repo and making the appropriate updates (instead of displaying the demo page it also displays what's inside the app.vue template, being hi there in the local nuxt example).

Note: if adding pages templates you would get 404s instead because of nuxt's vue-router errors not recognising histoire routes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
to triage This issue needs to be triaged
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants