ember-framework fix: wrong path

[pomm0]

Closes #

What I did

Tried to update our ember app to storybook version 7 and couldn't start storybook due to error:

WARN   Failed to load preset: "@storybook/ember/preset"
ERR! Error: Cannot find module './dist/cjs/preset'
ERR! Require stack:
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/ember/preset.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/node_modules/@storybook/core-common/dist/index.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/node_modules/@storybook/telemetry/dist/index.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/dist/generate.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/bin/index.js
ERR! - /home/[path-to-repo--stripped]/node_modules/storybook/index.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1021:15)
ERR!     at Function.Module._load (node:internal/modules/cjs/loader:866:27)
ERR!     at Module.require (node:internal/modules/cjs/loader:1093:19)
ERR!     at require (node:internal/modules/cjs/helpers:108:18)
ERR!     at Object.<anonymous> (/home/[path-to-repo--stripped]/node_modules/@storybook/ember/preset.js:1:18)
ERR!     at Module._compile (node:internal/modules/cjs/loader:1191:14)
ERR!     at Module._compile (/home/[path-to-repo--stripped]/node_modules/esbuild-register/dist/node.js:2258:26)
ERR!     at Module._extensions..js (node:internal/modules/cjs/loader:1245:10)
ERR!     at Object.newLoader (/home/[path-to-repo--stripped]/node_modules/esbuild-register/dist/node.js:2262:9)
ERR!     at Object.extensions..js (/home/[path-to-repo--stripped]/node_modules/esbuild-register/dist/node.js:4807:24)
ERR!  Error: Cannot find module './dist/cjs/preset'
ERR! Require stack:
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/ember/preset.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/node_modules/@storybook/core-common/dist/index.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/node_modules/@storybook/telemetry/dist/index.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/dist/generate.js
ERR! - /home/[path-to-repo--stripped]/node_modules/@storybook/cli/bin/index.js
ERR! - /home/[path-to-repo--stripped]/node_modules/storybook/index.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1021:15)
ERR!     at Function.Module._load (node:internal/modules/cjs/loader:866:27)
ERR!     at Module.require (node:internal/modules/cjs/loader:1093:19)
ERR!     at require (node:internal/modules/cjs/helpers:108:18)
ERR!     at Object.<anonymous> (/home/[path-to-repo--stripped]/node_modules/@storybook/ember/preset.js:1:18)
ERR!     at Module._compile (node:internal/modules/cjs/loader:1191:14)
ERR!     at Module._compile (/home/[path-to-repo--stripped]/node_modules/esbuild-register/dist/node.js:2258:26)
ERR!     at Module._extensions..js (node:internal/modules/cjs/loader:1245:10)
ERR!     at Object.newLoader (/home/[path-to-repo--stripped]/node_modules/esbuild-register/dist/node.js:2262:9)
ERR!     at Object.extensions..js (/home/[path-to-repo--stripped]/node_modules/esbuild-register/dist/node.js:4807:24) {
ERR!   code: 'MODULE_NOT_FOUND',
ERR!   requireStack: [
ERR!     '/home/[path-to-repo--stripped]/node_modules/@storybook/ember/preset.js',
ERR!     '/home/[path-to-repo--stripped]/node_modules/@storybook/cli/node_modules/@storybook/core-common/dist/index.js',
ERR!     '/home/[path-to-repo--stripped]/node_modules/@storybook/cli/node_modules/@storybook/telemetry/dist/index.js',
ERR!     '/home/[path-to-repo--stripped]/node_modules/@storybook/cli/dist/generate.js',
ERR!     '/home/[path-to-repo--stripped]/node_modules/@storybook/cli/bin/index.js',
ERR!     '/home/[path-to-repo--stripped]/node_modules/storybook/index.js'
ERR!   ]
ERR! }

Comparing preset.js of other frameworks led me to open this PR. But, I do not know storybook internals, so unsure if there is some special build folder for ember. But, manually modifing the url in my node_modules folder works

How to test

1. npx ember new storybook-ember-issue-22203
2. npx storybook@6 init (storybook init with latest tag as mentioned on your website does not work with ember, so you'll have to init version 6 and migrate to v7)
3. follow steps to migrate to v7: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#70-breaking-changes
4. build ember: npm run build
5. start or build storybook: npm run storybook / npm run build-storybook
6. now you'll get the error. When manually changing the path in node_modules/@storybook/ember/preset.js storybook will not start yet (did not migrate further), but the error is gone and you'll receive another errror unrelated to this issue but maybe a following issue of storybook which would need to be addressed with a dedicated issue

I pushed these steps into a repo, you can find it here

Checklist

• Make sure your changes are tested (stories and/or unit, integration, or end-to-end tests)
• Make sure to add/update documentation regarding your changes
• If you are deprecating/removing a feature, make sure to update
  MIGRATION.MD

Maintainers

• If this PR should be tested against many or all sandboxes,
  make sure to add the ci:merged or ci:daily GH label to it.
• Make sure this PR contains one of the labels below.

["cleanup", "BREAKING CHANGE", "feature request", "bug", "documentation", "maintenance", "dependencies", "other"]

[valentinpalkovic]

Hi @pomm0,

Thank you for your first contribution! Really appreciated :)

Could you adjust your description by filling out the part "How to test"? That would be great!

[pomm0]

Hi @pomm0,

Thank you for your first contribution! Really appreciated :)

Could you adjust your description by filling out the part "How to test"? That would be great!

Thanks for the reply @valentinpalkovic, I already started to fill it out once, but stopped as npx storybook@latest init seems not to work on a fresh ember app and assumed that you'll have a setup to test against anyway.
I just updated the issue description.