arg values don't merge when set to undefined

[lifeiscontent]

Describe the bug
I'd expect standard merging of objects to work.

Object.assign({foo: ''}, {foo: undefined}) // {foo: undefined}

To Reproduce

1. create a story
2. define args and argTypes in the default export
3. redefine args / argTypes for individual stories to undefined
4. notice that args don't merge.
5. if the values are set to null they DO merge.

Expected behavior
Both null and undefined should merge into args.

Screenshots
If applicable, add screenshots to help explain your problem.

Code snippets

import { Meta, Story } from '@storybook/react/types-6-0';
import React from 'react';
import { Card, CardFooter, CardProps } from '.';
import { Avatar } from '../Avatar';

export default {
  title: 'Components/Content/Card',
  component: Card,
  subcomponents: {
    CardFooter,
  },
  args: {
    tabIndex: 0,
    $variant: 'edgeToEdge',
    preview: (
      <img
        src="sunset-delight.jpg"
        alt="Preview"
        style={{ objectFit: 'cover', width: '100%', height: `${2 / 3 * 100}%`, verticalAlign: 'top' }}
      />
    ),
    eyebrow: 'Nature',
    head: 'The Life of Skies & Sunsets',
    body:
      'Lorem ipsum dolor sit amet, vim te nominavi moderatius efficiantur. Inimicus reprimique consectetuer eu eos. Reque aliquam in per.',
    footer: (
      <CardFooter
        cue={<Avatar $size="smallest" src="avatar.jpg" alt="Avatar" />}
        title="Betty Cooper"
        subtitle="Oct 31, 2020 • 3 min read"
      />
    ),
  },
  argTypes: {
    onClick: {
      action: 'onClick',
    },
    $variant: {
      control: {
        type: 'select',
        options: ['edgeToEdge', 'offEdge', 'cardless'],
      },
    },
  },
} as Meta;

const Template: Story<CardProps> = args => <Card {...args} />;

export const Main = Template.bind({});

export const OffEdge = Template.bind({});

OffEdge.args = {
  $variant: 'offEdge',
};

export const Cardless = Template.bind({});

Cardless.args = {
  $variant: 'cardless',
};

export const Eyebrowless = Template.bind({});

Eyebrowless.args = {
  eyebrow: undefined,
};

export const Bodyless = Template.bind({});

Bodyless.args = {
  body: undefined,
};

export const CoreOnly = Template.bind({});

CoreOnly.args = {
  footer: undefined,
};

export const HeadOnly = Template.bind({});

HeadOnly.args = {
  body: undefined,
  eyebrow: undefined,
  footer: undefined,
};

export const Minimal = Template.bind({});

Minimal.args = {
  eyebrow: undefined,
  body: undefined,
};

export const Avatarless = Template.bind({});

Avatarless.args = {
  footer: (
    <CardFooter title="Betty Cooper" subtitle="Oct 31, 2020 • 3 min read" />
  ),
};

System
Please paste the results of npx sb@next info here.

Additional context
Add any other context about the problem here.

[shilman]

Son of a gun!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.1.0-alpha.33 containing PR #12958 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease