Repository: storybook
Issue: ArgsTable tabs disappear when navigating between stories with and without addon-controls argTypes
Labels: bug,block: argstable

**Describe the bug**
ArgsTable tabs disappear when navigating between stories with and without addon-controls argTypes.

**To Reproduce**

You need two stories. One of them (e.g. "Default") should have at least two tabs in ArgsTable (e.g. "Foo" and "Bar"). The other (e.g. "WithControls") should be the same thing, but with addon-controls argTypes, which adds a "Story" tab to the ArgsTable.

1. Click "Foo" tab in "WithControls".
2. Click "Story" tab in "WithControls".
3. Navigate to "Default".
4. Notice tabs are empty. Although, it's able to fix itself if I click on one of them.

**Expected behavior**
"Default" should show "Foo" and "Bar" tabs.

**Screenshots**
![argstable-tabs-disappear](https://user-images.githubusercontent.com/6496295/108791034-fab65500-7532-11eb-9672-8eef594b39ca.gif)

**Code snippets**
<details><summary>foo.react-component.js</summary>

```
import PropTypes from 'prop-types';
import React from 'react';

export default class Foo extends React.Component {
    static propTypes = {
        foo: PropTypes.string.isRequired,
    };

    render() {
        return this.props.foo;
    }
}

export class Bar extends React.Component {
    static propTypes = {
        bar: PropTypes.string.isRequired,
    };

    render() {
        return this.props.bar;
    }
}

```

</details>

<details><summary>foo.stories.js</summary>

```
import React from 'react';

import Foo, {Bar} from './foo.react-component.js';

export default {
    title: 'example/Foo',
    component: Foo,
    subcomponents: {Bar},
};

export const Default = () => <Foo foo="foo" />;

export const WithControls = (args) => <Foo {...args} />;

WithControls.args = {foo: 'Foo'};
WithControls.argTypes = {
    foo: {
        control: {type: 'select', options: ['Foo', 'FOO', 'foo']},
    },
};

```

</details>

<details><summary>preview.js</summary>

```
import {
    DocsContainer,
    Title,
    Description,
    ArgsTable,
    Source,
    CURRENT_SELECTION,
} from '@storybook/addon-docs/blocks';
import {parameters as reactDocsParameters} from '@storybook/addon-docs/dist/frameworks/react/config';
import React from 'react';

export const parameters = {
    docs: {
        ...reactDocsParameters.docs,
        container: DocsContainer,
        page: () => (
            <>
                <Title />
                <Description of={CURRENT_SELECTION} />
                <Source id={CURRENT_SELECTION} />
                <ArgsTable of={CURRENT_SELECTION} story={CURRENT_SELECTION} showComponent={true} />
            </>
        ),
    },
};

```

</details>

<details><summary>main.js</summary>

```
module.exports = {
    stories: ['../**/foo.stories.js'],
    addons: ['@storybook/addon-docs/register', '@storybook/addon-controls/register'],
};
```

</details>

**System**
```
System:
  OS: macOS 10.15.7
  CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Binaries:
  Node: 14.15.3 - /usr/local/bin/node
  Yarn: 1.9.4 - ~/.yarn/bin/yarn
  npm: 6.14.9 - /usr/local/bin/npm
Browsers:
  Chrome: 88.0.4324.182
npmPackages:
  @storybook/addon-controls: 6.1.18 => 6.1.18 
  @storybook/addon-docs: 6.1.18 => 6.1.18 
  @storybook/addons: 6.1.18 => 6.1.18 
  @storybook/react: 6.1.18 => 6.1.18 
  @storybook/theming: 6.1.18 => 6.1.18
```

**Additional context**
- I installed addon-docs via manual configuration per https://github.com/storybookjs/storybook/tree/next/addons/docs#manual-configuration, not via the preset.
- I am using a custom `docs.page` per https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/docspage.md#remixing-docspage-using-doc-blocks. See main.js and preview.js in the "Code snippets" section.
- I am not doing any customization with addon-controls.