描述bug

在使用Controls插件的Storybook 6 for React中，当在下拉菜单控件之间切换时，Storybook的画布会因为ForwardRef错误而崩溃。一个有效的用例是Material-UI Button的endIcon/startIcon属性。

使用提供的prop endIcon={<div>initial</div>}进行初始渲染时，渲染正确。只有在下拉菜单中选择一个新选项时才会发生错误。

有趣的是，这个问题只出现在Storybook的Canvas组件上，同样的story在Docs插件中切换时也是正常的；所以它似乎与storybook Canvas有关。

重现

1. 使用带有Controls插件的Storybook 6 for React
2. 创建一个故事并配置一个ReactNode类型的属性来处理下拉菜单控件，其中值是一个组件
3. 选择下拉菜单中的一个选项，你将看到以下错误。

预期行为

组件应更新以表示prop的变化，而不是崩溃。

截图

代码片段

import React from "react";
import { Story, Meta } from "@storybook/react/types-6-0";
import { Button, ButtonProps } from "@material-ui/core/Button";

export default {
  title: "Inputs/Button",
  component: Button,
  argTypes: {
    endIcon: {
      control: {
        options: { Alpha: <div>alphra</div>, Beta: <div>beta</div> },
      },
    },
  },
} as Meta;

const Template: Story<ButtonProps> = (args) => {
  return (
    <Button {...args} />
  );
};

const baseArgs: Partial<ButtonProps> = {
  children: "Button",
  variant: "contained",
};

export const Index = Template.bind({});
Index.args = {
  ...baseArgs,
  color: "default",
  endIcon: <div>initial</div>,
};

系统：

npx sb@next info对我不起作用，但我正在使用以下内容：

"@react-theming/storybook-addon": "^1.0.3",
    "@storybook/addon-actions": "^6.0.13",
    "@storybook/addon-essentials": "^6.0.13",
    "@storybook/addon-links": "^6.0.13",
    "@storybook/addon-storysource": "^6.0.13",
    "@storybook/addon-viewport": "^6.0.13",
    "@storybook/node-logger": "^6.0.13",
    "@storybook/react": "^6.0.13",

附加上下文

在这里添加有关问题的任何其他上下文。