diff --git a/examples/official-storybook/stories/demo/button-module-embed.test.js b/examples/official-storybook/stories/demo/button-module-embed.test.js deleted file mode 100644 index 3dc0798894d..00000000000 --- a/examples/official-storybook/stories/demo/button-module-embed.test.js +++ /dev/null @@ -1,15 +0,0 @@ -import { render, fireEvent } from 'react-testing-library'; -import { withText } from './button.stories'; - -const mockAction = jest.fn(); -jest.mock('@storybook/addon-actions', () => ({ - action: () => mockAction, -})); - -describe('button interactivity', () => { - it('should handle clicks', () => { - const comp = render(withText()); - fireEvent.click(comp.getByText('Hello Button')); - expect(mockAction).toHaveBeenCalled(); - }); -}); diff --git a/examples/official-storybook/stories/demo/button.stories.js b/examples/official-storybook/stories/demo/button.stories.js index d6e7caf01f3..7da5a4a6c5c 100644 --- a/examples/official-storybook/stories/demo/button.stories.js +++ b/examples/official-storybook/stories/demo/button.stories.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useState } from 'react'; import { action } from '@storybook/addon-actions'; import { Button } from '@storybook/react/demo'; @@ -24,3 +24,14 @@ export const withSomeEmoji = () => ( withSomeEmoji.story = { name: 'with some emoji', }; + +export const withCounter = () => + React.createElement(() => { + const [counter, setCounter] = useState(0); + const label = `Testing: ${counter}`; + return ; + }); + +withCounter.story = { + name: 'with coumter', +}; diff --git a/examples/official-storybook/stories/demo/module-stories-embed.test.js b/examples/official-storybook/stories/demo/module-stories-embed.test.js new file mode 100644 index 00000000000..826cb7e4ba7 --- /dev/null +++ b/examples/official-storybook/stories/demo/module-stories-embed.test.js @@ -0,0 +1,21 @@ +import { render, fireEvent } from 'react-testing-library'; +import { withText, withCounter } from './button.stories'; + +const mockAction = jest.fn(); +jest.mock('@storybook/addon-actions', () => ({ + action: () => mockAction, +})); + +describe('module story embedding', () => { + it('should test actions', () => { + const comp = render(withText()); + fireEvent.click(comp.getByText('Hello Button')); + expect(mockAction).toHaveBeenCalled(); + }); + + it('should test story state', () => { + const comp = render(withCounter()); + fireEvent.click(comp.getByText('Testing: 0')); + expect(comp.getByText('Testing: 1')).toBeTruthy(); + }); +});