@storybook/addon-actions@npm:6.5.0-alpha.64 causes configuration error

Describe the bug Adding @storybook/addon-actions@npm:6.5.0-alpha.64 to the addons in the configuration results in an error.

To Reproduce

package.json deps (next is currently 6.5.0-alpha.64):

    "@storybook/addon-actions": "next",
    "@storybook/addon-controls": "next",
    "@storybook/addon-docs": "next",
    "@storybook/addon-links": "next",
    "@storybook/addons": "next",
    "@storybook/api": "next",
    "@storybook/builder-webpack5": "next",
    "@storybook/components": "next",
    "@storybook/core-events": "next",
    "@storybook/manager-webpack5": "next",

main.js:

module.exports = {
  core: {
    builder: "webpack5",
  },

  features: {
    previewMdx2: true,
  },

  stories: ['./*.stories.js', './stories/*.stories.js', '../../**/*.stories.(js|ts|tsx)'],
  addons: ['@storybook/addon-docs', '@storybook/addon-actions', '@storybook/addon-links', '@storybook/addon-controls'],
};

run command:

yarn run start-storybook

results in error:

info => Loading presets
ERR! TypeError: (intermediate value) is not iterable
ERR!     at _default (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-builder-webpack5-virtual-f6bab782af/0/cache/@storybook-builder-webpack5-npm-6.5.0-alpha.64-6b61656f32-8eefb6f4eb.zip/node_modules/@storybook/builder-webpack5/dist/cjs/preview/iframe-webpack.config.js:70:22)
ERR!     at processTicksAndRejections (node:internal/process/task_queues:96:5)
ERR!     at async starterGeneratorFn (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-builder-webpack5-virtual-f6bab782af/0/cache/@storybook-builder-webpack5-npm-6.5.0-alpha.64-6b61656f32-8eefb6f4eb.zip/node_modules/@storybook/builder-webpack5/dist/cjs/index.js:116:16)
ERR!     at async Object.start (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-builder-webpack5-virtual-f6bab782af/0/cache/@storybook-builder-webpack5-npm-6.5.0-alpha.64-6b61656f32-8eefb6f4eb.zip/node_modules/@storybook/builder-webpack5/dist/cjs/index.js:272:14)
ERR!     at async Promise.all (index 0)
ERR!     at async storybookDevServer (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-core-server-virtual-66e8f1bae6/0/cache/@storybook-core-server-npm-6.5.0-alpha.64-3829db92dd-a417498b98.zip/node_modules/@storybook/core-server/dist/cjs/dev-server.js:139:28)
ERR!     at async buildDevStandalone (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-core-server-virtual-66e8f1bae6/0/cache/@storybook-core-server-npm-6.5.0-alpha.64-3829db92dd-a417498b98.zip/node_modules/@storybook/core-server/dist/cjs/build-dev.js:118:31)
ERR!     at async buildDev (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-core-server-virtual-66e8f1bae6/0/cache/@storybook-core-server-npm-6.5.0-alpha.64-3829db92dd-a417498b98.zip/node_modules/@storybook/core-server/dist/cjs/build-dev.js:164:5)
ERR!  TypeError: (intermediate value) is not iterable
ERR!     at _default (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-builder-webpack5-virtual-f6bab782af/0/cache/@storybook-builder-webpack5-npm-6.5.0-alpha.64-6b61656f32-8eefb6f4eb.zip/node_modules/@storybook/builder-webpack5/dist/cjs/preview/iframe-webpack.config.js:70:22)
ERR!     at processTicksAndRejections (node:internal/process/task_queues:96:5)
ERR!     at async starterGeneratorFn (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-builder-webpack5-virtual-f6bab782af/0/cache/@storybook-builder-webpack5-npm-6.5.0-alpha.64-6b61656f32-8eefb6f4eb.zip/node_modules/@storybook/builder-webpack5/dist/cjs/index.js:116:16)
ERR!     at async Object.start (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-builder-webpack5-virtual-f6bab782af/0/cache/@storybook-builder-webpack5-npm-6.5.0-alpha.64-6b61656f32-8eefb6f4eb.zip/node_modules/@storybook/builder-webpack5/dist/cjs/index.js:272:14)
ERR!     at async Promise.all (index 0)
ERR!     at async storybookDevServer (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-core-server-virtual-66e8f1bae6/0/cache/@storybook-core-server-npm-6.5.0-alpha.64-3829db92dd-a417498b98.zip/node_modules/@storybook/core-server/dist/cjs/dev-server.js:139:28)
ERR!     at async buildDevStandalone (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-core-server-virtual-66e8f1bae6/0/cache/@storybook-core-server-npm-6.5.0-alpha.64-3829db92dd-a417498b98.zip/node_modules/@storybook/core-server/dist/cjs/build-dev.js:118:31)
ERR!     at async buildDev (/Users/jvalore/Projects/mindful-ui/.yarn/__virtual__/@storybook-core-server-virtual-66e8f1bae6/0/cache/@storybook-core-server-npm-6.5.0-alpha.64-3829db92dd-a417498b98.zip/node_modules/@storybook/core-server/dist/cjs/build-dev.js:164:5)

Removing @storybook/addon-actions from the addons array fixes the error.

System

  System:
    OS: macOS 10.15.7
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
  Binaries:
    Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node
    Yarn: 3.2.0 - ~/.yarn/bin/yarn
    npm: 8.3.1 - ~/.nvm/versions/node/v16.14.0/bin/npm
  Browsers:
    Chrome: 100.0.4896.88
    Firefox: 98.0.2
    Safari: 13.1.3

Additional context Add any other context about the problem here.

[nbelzer]

Had the same issue pop up here when upgrading from 6.4.22 to 6.5.4. While we took some time to dive into the storybook code to try and figure out what is causing it, we were not able to figure out the exact cause.

The reason the issue popped up for us seems to be related to @storybook/addon-essentials and @storybook/addon-actions, as you can see based on our findings below:

We tried several configurations, the following failed:

module.exports = {
  stories: [ ... ],
  addons: ['@storybook/addon-essentials'],
}

The following configurations worked:

module.exports = {
  stories: [ ... ],
  addons: [{
    name: '@storybook/addon-essentials',
    options: {
      'actions': false,
    }
  }],
}

module.exports = {
  stories: [ ... ],
  addons: ['@storybook/addon-actions', '@storybook/addon-essentials'],
}

module.exports = {
  stories: [ ... ],
  addons: ['@storybook/addon-docs', '@storybook/addon-controls', '@storybook/addon-actions', '@storybook/addon-backgrounds', '@storybook/addon-viewport', '@storybook/addon-toolbars', '@storybook/addon-measure', '@storybook/addon-outline'],
}

Because we were able to load every add-on separately without issue we believe the issue might be related to how @storybook/addon-essentials includes the add-ons compared to how this is handled when the add-ons are specified separately.

System information

  System:
    OS: macOS 12.3.1
  Binaries:
    Node: 16.14.0
    Yarn: 1.22.17
    npm: 8.3.1

[JulioC]

@yannickrocks the workaround appears to be adding the affected addon manually before essentials:

module.exports = {
  stories: [ ... ],
  addons: ['@storybook/addon-actions', '@storybook/addon-essentials'],
}