[Bug]: --includeTags missing some tests

[kraftman]

Describe the bug

I'm using --includeTags to filter components tagged with 'component'. While the tests are running, it says '24 passed', but when it completes it changes to '13 passed', and ignores some of the component stories. I've tried checking the stories to see if there are any obvious differences but I cant see any. I've included examples below.

To Reproduce

run :test-storybook --includeTags="component" --coverage --coverageDirectory sb-coverage

this story runs:

import React from 'react';
import { userEvent, within, expect, fn } from '@storybook/test';
import CancelButton from './CancelButton';

export default {
  title: 'Components/CancelButton',
  tags: ['component'],
  component: CancelButton,
};

export const Default = {};

export const Test = {
  args: {
    onClick: fn(),
    onClickData: { test: 'test' },
  },
  play: async ({ args, canvasElement }) => {
    const canvas = within(canvasElement);
    await userEvent.click(canvas.getByRole('button'));
    await expect(args.onClick).toHaveBeenCalledWith({ test: 'test' });
  },
};

this story is ignored:

import React from 'react';
import { within, expect, fn, userEvent } from '@storybook/test';
import Checkbox from './Checkbox';

export default {
  title: 'Components/Checkbox',
  component: Checkbox,
  tags: ['component'],
  args: {
    onChange: fn(),
    defaultValue: false,
    label: 'Send me news',
    value: false,
    formState: {
      checkbox: {
        value: {
          checkbox: false,
        },
      },
    },
    componentName: 'checkbox',
  },
};

export const Default = {
  play: async ({ args, canvasElement }) => {
    const canvas = within(canvasElement);
    const checkbox = canvas.getByRole('checkbox');
    expect(checkbox).toBeInTheDocument();
    userEvent.click(checkbox);
    // await waitFor(() => expect(checkbox).toBeChecked());
    // expect(args.onChange).toHaveBeenCalledWith({ value: { checkbox: true } });
  },
};

System

Storybook Environment Info:

  System:
    OS: Linux 5.15 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish)
    CPU: (24) x64 AMD Ryzen 9 7900X 12-Core Processor
    Shell: 5.8.1 - /usr/bin/zsh
  Binaries:
    Node: 20.13.0 - ~/.nvm/versions/node/v20.13.0/bin/node
    Yarn: 1.22.22 - ~/mason-web/node_modules/.bin/yarn <----- active
    npm: 10.5.2 - ~/.nvm/versions/node/v20.13.0/bin/npm
  npmPackages:
    @storybook/addon-actions: ^8.1.9 => 8.1.9
    @storybook/addon-controls: ^8.1.9 => 8.1.9
    @storybook/addon-coverage: ^1.0.4 => 1.0.4
    @storybook/addon-designs: ^8.0.2 => 8.0.2
    @storybook/addon-essentials: ^8.1.9 => 8.1.9
    @storybook/addon-interactions: ^8.1.9 => 8.1.9
    @storybook/addon-links: ^8.1.9 => 8.1.9
    @storybook/addon-mdx-gfm: ^8.1.9 => 8.1.9
    @storybook/addon-storysource: ^8.1.9 => 8.1.9
    @storybook/addon-viewport: ^8.1.9 => 8.1.9
    @storybook/addon-webpack5-compiler-babel: ^3.0.3 => 3.0.3
    @storybook/manager-api: ^8.1.9 => 8.1.9
    @storybook/react: ^8.1.9 => 8.1.9
    @storybook/react-webpack5: ^8.1.9 => 8.1.9
    @storybook/source-loader: ^8.1.9 => 8.1.9
    @storybook/test: ^8.1.9 => 8.1.9
    @storybook/test-runner: ^0.18.2 => 0.18.2
    msw-storybook-addon: ^2.0.2 => 2.0.2
    storybook: ^8.1.9 => 8.1.9

Additional context

No response

[kraftman]

So I dug into this a bit more, and it seems to be an issue about only having one named export? or one named export with tests?

if I change 'export const Default' to 'export const Test' it still isnt picked up, however if i then add an empty 'export const Default = {}' above it then the test is included

for reference this is the updated version of the above that works

import React from 'react';
import { within, expect, fn, userEvent, waitFor } from '@storybook/test';
import Checkbox from './Checkbox';

export default {
  title: 'Components/Checkbox',
  tags: ['component'],
  component: Checkbox,
  args: {
    onChange: fn(),
    defaultValue: false,
    label: 'Send me news',
    value: false,
    formState: {
      checkbox: {
        value: {
          checkbox: false,
        },
      },
    },
    componentName: 'checkbox',
  },
};

export const Default = {};

export const ValidateClick = {
  play: async ({ args, canvasElement }) => {
    const canvas = within(canvasElement);
    const checkbox = canvas.getByRole('checkbox');
    expect(checkbox).toBeInTheDocument();
    userEvent.click(checkbox);
    await waitFor(() => expect(checkbox).toBeChecked());
    expect(args.onChange).toHaveBeenCalledWith({ value: { checkbox: true } });
  },
};

[yannbf]

Hey @kraftman thanks a lot for catching this bug. There is an inconsistency between transformation modes (non index-json and index-json), I'll work on fixing this ASAP!