Feat: open file inspector #322
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
dominikg
commented
May 2, 2022
dominikg
commented
May 2, 2022
dominikg
commented
May 2, 2022
dominikg
commented
May 2, 2022
dominikg
commented
May 2, 2022
…ging; update browser select for testing
dominikg
commented
May 2, 2022
bluwy
reviewed
May 3, 2022
…ility options for toggle, docs
… a breaking change
bluwy
reviewed
May 6, 2022
There was a problem hiding this comment.
Looks pretty good 👍 Works well locally for me.
The only small quirk so far is that on macos, using holdMode: true, ctrl-shift doesn't really work as ctrl-click is considered a right click and it doesn't look like it can be prevented. Maybe we can set meta-shift as the default for macos, rest be ctrl-shift for a nicer experience.
bluwy
approved these changes
May 6, 2022
Merged
IanVS
added a commit
to storybookjs/builder-vite
that referenced
this pull request
May 18, 2022
Fixes #381 There have been two changes in @sveltejs/vite-plugin-svelte that cause problems for us, which this PR addresses: - https://github.com/sveltejs/vite-plugin-svelte/releases/tag/%40sveltejs%2Fvite-plugin-svelte%401.0.0-next.42 started to merge the `svelte.config.js` file [by default](sveltejs/vite-plugin-svelte#317), which may not be what storybook users want / expect, since their production config may be different from the storybook config (same reason we don't automatically merge `vite.config.js`). With the changes here, the `configFile` option in `svelteOptions` can still be set to `true` or to a specific file, if desired. - https://github.com/sveltejs/vite-plugin-svelte/releases/tag/%40sveltejs%2Fvite-plugin-svelte%401.0.0-next.43 began [returning an array of plugins](sveltejs/vite-plugin-svelte#322) rather than just a single one. This would normally be fine, except that we hack around with the plugin to create two separate ones, with different names, to avoid HMR in story files. So, this PR checks to see if the result is an array or not, and reacts accordingly. Note, I'm throwing away the inspector for story files. This might be a problem, but until we hear about it, I think this'll be fine. The inspector is still pretty experimental anyway, from what I can tell. To test, you can revert the changes I've made in `vite-config.ts`, and you'll see that the `svelte` example breaks (I updated the svelte plugin in it). With the changes, it builds successfully. This also enables the use of the new experimental inspection plugin.  To enable this feature, be sure you have `@sveltejs/vite-plugin-svelte` version `1.0.0-next.43` or higher, then add the following to your `svelteOptions` in `.storybook/main.js`: ```js module.exports = { // ... rest of config framework: '@storybook/svelte', svelteOptions: { preprocess: preprocess(), experimental: { inspector: true }, // <-- this line }, }; ``` Then, when the storybook opens, focus a story iframe and press cmd+shift (mac) or ctrl+shift (windows) to activate.
Merged
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Inspired by vite-plugin-vue-inspector and it's svelte sibling https://github.com/tanhauhau/vite-plugin-svelte-inspector, this PR bakes it into vite-plugin-svelte as an experimental option.
To use it, set
experimental:{inspector: true}either inline on vite-plugin-svelte definition or in your svelte config.Use custom
InspectorOptionsto customize it's behavior