stories: fix storybook interaction test for add button

This commit is contained in:
Jamie Kyle 2022-10-14 14:47:44 -07:00 committed by GitHub
parent 449a9a701a
commit 2d5c154e2a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 11 deletions

View file

@ -48,11 +48,12 @@ const interactionTest: PlayFunction<ReactFramework, PropsType> = async ({
canvasElement, canvasElement,
}) => { }) => {
const canvas = within(canvasElement); const canvas = within(canvasElement);
const [btnAddStory] = canvas.getAllByLabelText('Add a story'); const btnAddStory = canvas.getByLabelText('Add a story');
await userEvent.click(btnAddStory); await userEvent.click(btnAddStory);
const textStory = canvas.getByText('Text story');
await userEvent.click(textStory);
await expect(args.onAddStory).toHaveBeenCalled(); await expect(args.onAddStory).toHaveBeenCalled();
const btnStory = canvas.getByText('My Stories');
const [btnStory] = canvas.getAllByText('My Stories');
await userEvent.click(btnStory); await userEvent.click(btnStory);
await expect(args.onClick).toHaveBeenCalled(); await expect(args.onClick).toHaveBeenCalled();
}; };
@ -98,6 +99,7 @@ SendingStory.args = {
], ],
}, },
}; };
SendingStory.play = interactionTest;
export const FailedSendStory = Template.bind({}); export const FailedSendStory = Template.bind({});
FailedSendStory.story = { FailedSendStory.story = {
@ -114,3 +116,4 @@ FailedSendStory.args = {
], ],
}, },
}; };
FailedSendStory.play = interactionTest;

View file

@ -95,10 +95,7 @@ export const MyStoriesButton = ({
size={AvatarSize.FORTY_EIGHT} size={AvatarSize.FORTY_EIGHT}
title={title} title={title}
/> />
<div <div className="MyStories__avatar__add-story" />
aria-label={i18n('Stories__add')}
className="MyStories__avatar__add-story"
/>
</div> </div>
<div className="StoryListItem__info"> <div className="StoryListItem__info">
<> <>
@ -141,10 +138,7 @@ export const MyStoriesButton = ({
storyRing={HasStories.Read} storyRing={HasStories.Read}
title={title} title={title}
/> />
<div <div className="MyStories__avatar__add-story" />
aria-label={i18n('Stories__add')}
className="MyStories__avatar__add-story"
/>
</StoriesAddStoryButton> </StoriesAddStoryButton>
</div> </div>
<div <div