histoire-dev / histoire-dev/histoire

Vuetify button cannot be mounted on story with grid layout

Open
#709 1 comment 0 reactions 0 assignees View on GitHub
to triage
Dominant language
TypeScript
Stars
3.6k
Forks
212
PR merge metrics
No merged PRs in 30d

Description

### Describe the bug

Unable to use vuetify button on story
```vue



Hello world

import { VBtn } from "vuetify/components/VBtn"

```
The above story throws expection when you try to select the component.
Screenshot 2024-04-09 at 21 59 25

### Reproduction

https://stackblitz.com/edit/vitejs-vite-ixfceb

```npm run story:dev```

### System Info

```shell
System:
OS: macOS 14.4.1
CPU: (10) arm64 Apple M1 Pro
Memory: 771.09 MB / 32.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.19.0 - ~/.nvm/versions/node/v18.19.0/bin/node
npm: 10.2.3 - ~/.nvm/versions/node/v18.19.0/bin/npm
pnpm: 8.10.3 - ~/Library/pnpm/pnpm
Browsers:
Chrome: 121.0.6167.184
Edge: 123.0.2420.81
Safari: 17.4.1
npmPackages:
@histoire/plugin-vue: ^0.17.16 => 0.17.16
@vitejs/plugin-vue: ^4.2.3 => 4.6.2
histoire: ^0.17.16 => 0.17.16
vite: ^4.4.5 => 4.5.3
```
```

### Used Package Manager

npm

### Validations

- [X] Follow our [Code of Conduct](https://github.com/histoire-dev/histoire/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guidelines](https://github.com/histoire-dev/histoire/blob/main/CONTRIBUTING.md).
- [X] Read the [docs](https://histoire.dev/guide/).
- [X] Check that there isn't [already an issue](https://github.com/histoire-dev/histoire/issues) that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/histoire-dev/histoire/discussions).
- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.

Contributor guide

Open the contributing guide

Research direction

Start with the linked StackBlitz reproduction and run `npm run story:dev` to observe the failure when selecting the Vuetify button in the grid-layout story. Trace the grid-layout story mounting and selection path; done means the provided VBtn story mounts and can be selected without throwing an exception.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript, vite
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.