[Bug]: sb7+vite env variables not working inside addons

[Luk-z]

Describe the bug

Environment variables are not available inside addon.

This is a repo to reproduce the error: node16 + sb7 + vite + npm
https://github.com/Luk-z/vite_ts_sb7_npm

This is a repo where the env variables works inside addons: node14 + sb6 + vite + npm
https://github.com/Luk-z/vite_ts_sb6_npm

To write the simple addon i followed https://storybook.js.org/docs/react/addons/writing-addons.

I'm expecting env variables are available inside an addon.

To Reproduce

https://github.com/Luk-z/vite_ts_sb7_npm

System

$ npx sb@next info

Environment Info:

  System:
    OS: macOS 12.6
    CPU: (10) arm64 Apple M1 Pro
  Binaries:
    Node: 16.19.0 - ~/.nvm/versions/node/v16.19.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v18.12.1/bin/yarn
    npm: 8.19.3 - ~/.nvm/versions/node/v16.19.0/bin/npm
  Browsers:
    Chrome: 108.0.5359.124
    Firefox: 106.0.1
    Safari: 16.0
  npmPackages:
    @storybook/addon-essentials: ^7.0.0-beta.30 => 7.0.0-beta.30 
    @storybook/addon-interactions: ^7.0.0-beta.30 => 7.0.0-beta.30 
    @storybook/addon-links: ^7.0.0-beta.30 => 7.0.0-beta.30 
    @storybook/blocks: ^7.0.0-beta.30 => 7.0.0-beta.30 
    @storybook/react: ^7.0.0-beta.30 => 7.0.0-beta.30 
    @storybook/react-vite: ^7.0.0-beta.30 => 7.0.0-beta.30 
    @storybook/testing-library: ^0.0.13 => 0.0.13

Additional context

No response

[IanVS]

Where are you setting the STORYBOOK_TEST env var?

[Luk-z]

.env file https://github.com/Luk-z/vite_ts_sb7_npm/blob/main/.env

[IanVS]

I think this isn't related to Vite, since it's an addon and being rendered in the manager. @ndelangen is this maybe a consequence of changing the manager over from Webpack to esbuild? I see that process.env is an empty object even when prepending to the storybook command (STORYBOOK_TEST=abcd storybook dev -p 6006), so it doesn't seem related to loading the .env file.

[ndelangen]

Right.. so the builder-manager needs to be modified to setup injecting environment variables into addons-bundles.

Likely to be implemented here:

storybook/code/lib/builder-manager/src/index.ts

Lines 77 to 83 in e7c7462

	aliasPlugin({
	process: require.resolve('process/browser.js'),
	util: require.resolve('util/util.js'),
	assert: require.resolve('browser-assert'),
	}),
	globalExternals(definitions),
	pnpPlugin(),

[IanVS]

Not released yet, was closed accidentally from PR title.

[ndelangen]

@IanVS @vanessayuenn @shilman we're using the auto close feature nowadays, correct?

[shilman]

Yes. @IanVS We're experimenting with using GH's PR-issue linkage feature so that our workflow is more standard

[shilman]

Crikey!! I just released https://github.com/storybookjs/storybook/releases/tag/v7.0.0-beta.39 containing PR #20834 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb@next upgrade --prerelease

[Luk-z]

It works, thx!