default component args missing from importing named export stories in unit tests

When importing named export stories into unit tests as described in the docs any defaulted component args are not retained

To Reproduce Steps to reproduce the behavior:

My story file is as follows

export default {
    component: Button,
    title: 'Button',
    args: {
        label: 'My Button',
        href: 'https://www.foo.com',
    },
};

const Template = args => (<Button {...args} />);

export const OffsiteButton = Template.bind({});
OffsiteButton.args = {
    offsite: true,
};

and then I import it into my unit as described in the docs like so:

import { OffsiteButton } from './Button.stories';

it('renders offsite button', () => {
    const wrapper = shallow(<OffsiteButton { ...OffsiteButton.args } />);
});

The resulting rendered element has the offsite arg assigned but is missing the label and href args assigned in the default export. This is not the case when storybook renders the story.

Expected behavior I would have expected the default export args and the component args to be merged. But the args defined in the default export are missing.

System

 System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i5-8400H CPU @ 2.50GHz
  Binaries:
    Node: 12.16.3 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 89.0.4389.90
    Edge: Spartan (44.19041.423.0), Chromium (89.0.774.48)
  npmPackages:
    @storybook/addon-essentials: ^6.2.0-rc.0 => 6.2.0-rc.0
    @storybook/addon-links: ^6.2.0-rc.0 => 6.2.0-rc.0
    @storybook/builder-webpack5: ^6.2.0-rc.0 => 6.2.0-rc.0
    @storybook/preset-scss: ^1.0.3 => 1.0.3
    @storybook/react: ^6.2.0-rc.0 => 6.2.0-rc.0

Temp solution: I can manually merge the named and default export args manually and assign them but that seems to default the purpose of the default args in storybook.

import ButtonDefaults, { OffsiteButton } from './Button.stories';
it('renders offsite button', () => {
    const wrapper = shallow(<OffsiteButton {...{ ...ButtonDefaults.args, ...OffsiteButton .args }} />);
});

[shilman]

@tmeasday perhaps this is something we can take care of as part of https://github.com/storybookjs/storybook/issues/12654

I agree about the documentation update. I also wonder whether we can migrate the react-independent bits to core.

[adamdiestelkamp]

Hey! I’m running into this issue with Storybook when trying to group my Doc stories into a single snapshot for Chromatic.

I’m importing the stories for a particular component and then displaying them all together on a single page import * as stories from './docs.stories';

But running into the same issue of if the story was using Template.bind({}) it doesn’t display correctly which makes the visual test for that case useless.

Using the composeStories() worked great though. Would have been nice if this had been default or available within Storybook directly but glad you all had this thread, thanks!