[Bug]: Conditional babel config such as include and exclude is ignored in @storybook/next

[kasperpeulen]

Describe the bug

If I have a babel config in next that uses conditional config such as include or exclude, than those lines get always matched to [root]/__fake__.js

This is happening in those lines: https://github.com/storybookjs/storybook/blob/3a1e61cefec8dfd350d42db5598b2d0d9159a878/code/frameworks/nextjs/src/preset.ts#L59-L69

Reproduction link

https://stackblitz.com/edit/github-iecdof?file=babel.config.js

Reproduction steps

1. Open the button story.
2. See in the console that async/await is transpiled, even though I override the babel-env to be modern.

System

See stackblitz

Additional context

No response

[greptile-apps[bot]]

To address the issue where conditional Babel config such as include and exclude is ignored, modify the babel function in preset.ts to properly handle these conditions. Specifically, update the loadPartialConfig call to respect the original filename from baseConfig.

export const babel: PresetProperty<'babel'> = async (baseConfig: TransformOptions) => {
  const configPartial = loadPartialConfig({
    ...baseConfig,
    // Use the original filename from baseConfig instead of a fake one
    filename: baseConfig.filename || `${getProjectRoot()}/__fake__.js`,
  });

  const options = configPartial?.options;

  // ... rest of the existing code
};

This change ensures that the original filename is used, allowing include and exclude conditions in the Babel config to be respected.

References

/code/frameworks/nextjs/src/preset.ts /code/frameworks/nextjs/src/babel

#### About Greptile

This response provides a starting point for your research, not a precise solution. Help us improve! Please leave a 👍 if this is helpful and 👎 if it is irrelevant. [Ask Greptile](https://app.greptile.com/chat/github/storybookjs/storybook/next) · [Edit Issue Bot Settings](https://app.greptile.com/apps/github)

[chidiebereojingwa]

Can I work on this?

[kasperpeulen]

@chidiebereojingwa Sure!