error SB_PREVIEW_API_0010 due to indentation during Chromatic Extract process

[cgbl-90]

Describe the bug

We hit error:

Error: Error: page.evaluate: SB_PREVIEW_API_0010 (MissingStoryFromCsfFileError): 
Couldn't find story matching id 'library-2-0-animatedtypingwrapper--default' after importing a CSF file.

The Storybook was published correctly, but the Chromatic verification step was failing.
Verification could not handle subdirectories properly:

[
{
directory: getFrontendPath('images'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Icons',
},
{
directory: getFrontendPath('styles'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Design tokens',
},
{
directory: getFrontendPath('components/lib/new'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Library 2.0',
},
{
directory: getFrontendPath('components/lib'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Library',
},
],

It places all stories in components/lib under Library EXCEPT all under components/lib/new.
This works in Storybook only.

Replacing it with

[
{
directory: getFrontendPath('images'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Icons',
},
{
directory: getFrontendPath('styles'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Design tokens',
},
{
directory: getFrontendPath('components/lib/new'),
files: '**/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Library 2.0',
},
{
directory: getFrontendPath('components/lib'),
files: '!(new)/*.stories.@(mdx|tsx|ts|jsx|js)',
titlePrefix: 'Library',
},
],

Note the "!(new)" in the components/lib section solves this and I can now finally deploy the storybook and verify it.
Without the fix Chromatic adds the story to both the top folder and the nested folder, which is probably what causes the issue.

Without fix (confuses chromatic):

Library
- FirstComponent
- subdir/
- SecondComponent

Library 2.0
- SecondComponent

With fix (publish works):

Library
- FirstComponent

Library 2.0
- SecondComponent

To Reproduce

chromatic-issue.zip

System

N/A

Additional context

Refer to internal task: AP-4626

[shilman]

@tmeasday if this works in Storybook and fails in Chromatic is it a storybook issue or a Chromatic one? I checked out the linear issue and the apps team said to escalate to Storybook. I wonder if we should just fail indexing if a component/story gets indexed by two different globs in main.js?

[tmeasday]

if this works in Storybook and fails in Chromatic is it a storybook issue or a Chromatic one?

@shilman it doesn't work in storybook, as .extract() fails.

I wonder if we should just fail indexing if a component/story gets indexed by two different globs in main.js?

Yeah that sounds good to me. The issue is clearly the duplicate importPath in index.json.