forked from misskey-dev/misskey
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
…13830) * test(storybook): add `components/MkC.*` stories * test(storybook): add some tests * test: add sleep * test: comment-out flaky test * test(storybook): add test for `MkChannelFollowButton` * chore(storybook): tweak sleep duration in `MkChannelFollowButton` story test * fix(chromatic): add delay to `MkChannelList` * chore: replace `mswDecorator` with `mswLoader` * fix(storybook): tweak some parameters * chore: serve static files * fix(chromatic): add delay to `MkCwButton` * chore: delete logging for debug * fix: add right click in `MkContextMenu` play * refactor: remove unused imports
- Loading branch information
Showing
28 changed files
with
1,083 additions
and
86 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
77 changes: 77 additions & 0 deletions
77
packages/frontend/src/components/MkChannelFollowButton.stories.impl.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,77 @@ | ||
| /* | ||
| * SPDX-FileCopyrightText: syuilo and misskey-project | ||
| * SPDX-License-Identifier: AGPL-3.0-only | ||
| */ | ||
|
|
||
| /* eslint-disable @typescript-eslint/explicit-function-return-type */ | ||
| /* eslint-disable import/no-default-export */ | ||
| import { StoryObj } from '@storybook/vue3'; | ||
| import { HttpResponse, http } from 'msw'; | ||
| import { action } from '@storybook/addon-actions'; | ||
| import { expect, userEvent, within } from '@storybook/test'; | ||
| import { channel } from '../../.storybook/fakes.js'; | ||
| import { commonHandlers } from '../../.storybook/mocks.js'; | ||
| import MkChannelFollowButton from './MkChannelFollowButton.vue'; | ||
| import { semaphore } from '@/scripts/test-utils.js'; | ||
| import { i18n } from '@/i18n.js'; | ||
|
|
||
| function sleep(ms: number) { | ||
| return new Promise(resolve => setTimeout(resolve, ms)); | ||
| } | ||
|
|
||
| const s = semaphore(); | ||
| export const Default = { | ||
| render(args) { | ||
| return { | ||
| components: { | ||
| MkChannelFollowButton, | ||
| }, | ||
| setup() { | ||
| return { | ||
| args, | ||
| }; | ||
| }, | ||
| computed: { | ||
| props() { | ||
| return { | ||
| ...this.args, | ||
| }; | ||
| }, | ||
| }, | ||
| template: '<MkChannelFollowButton v-bind="props" />', | ||
| }; | ||
| }, | ||
| args: { | ||
| channel: channel(), | ||
| full: true, | ||
| }, | ||
| async play({ canvasElement }) { | ||
| await s.acquire(); | ||
| await sleep(1000); | ||
| const canvas = within(canvasElement); | ||
| const buttonElement = canvas.getByRole<HTMLButtonElement>('button'); | ||
| await expect(buttonElement).toHaveTextContent(i18n.ts.follow); | ||
| await userEvent.click(buttonElement); | ||
| await sleep(1000); | ||
| await expect(buttonElement).toHaveTextContent(i18n.ts.unfollow); | ||
| await sleep(100); | ||
| await userEvent.click(buttonElement); | ||
| s.release(); | ||
| }, | ||
| parameters: { | ||
| layout: 'centered', | ||
| msw: { | ||
| handlers: [ | ||
| ...commonHandlers, | ||
| http.post('/api/channels/follow', async ({ request }) => { | ||
| action('POST /api/channels/follow')(await request.json()); | ||
| return HttpResponse.json({}); | ||
| }), | ||
| http.post('/api/channels/unfollow', async ({ request }) => { | ||
| action('POST /api/channels/unfollow')(await request.json()); | ||
| return HttpResponse.json({}); | ||
| }), | ||
| ], | ||
| }, | ||
| }, | ||
| } satisfies StoryObj<typeof MkChannelFollowButton>; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
65 changes: 65 additions & 0 deletions
65
packages/frontend/src/components/MkChannelList.stories.impl.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,65 @@ | ||
| /* | ||
| * SPDX-FileCopyrightText: syuilo and misskey-project | ||
| * SPDX-License-Identifier: AGPL-3.0-only | ||
| */ | ||
|
|
||
| /* eslint-disable @typescript-eslint/explicit-function-return-type */ | ||
| /* eslint-disable import/no-default-export */ | ||
| import { StoryObj } from '@storybook/vue3'; | ||
| import { HttpResponse, http } from 'msw'; | ||
| import { action } from '@storybook/addon-actions'; | ||
| import { channel } from '../../.storybook/fakes.js'; | ||
| import { commonHandlers } from '../../.storybook/mocks.js'; | ||
| import MkChannelList from './MkChannelList.vue'; | ||
| export const Default = { | ||
| render(args) { | ||
| return { | ||
| components: { | ||
| MkChannelList, | ||
| }, | ||
| setup() { | ||
| return { | ||
| args, | ||
| }; | ||
| }, | ||
| computed: { | ||
| props() { | ||
| return { | ||
| ...this.args, | ||
| }; | ||
| }, | ||
| }, | ||
| template: '<MkChannelList v-bind="props" />', | ||
| }; | ||
| }, | ||
| args: { | ||
| pagination: { | ||
| endpoint: 'channels/search', | ||
| limit: 10, | ||
| }, | ||
| }, | ||
| parameters: { | ||
| chromatic: { | ||
| // NOTE: ロードが終わるまで待つ | ||
| delay: 3000, | ||
| }, | ||
| layout: 'fullscreen', | ||
| msw: { | ||
| handlers: [ | ||
| ...commonHandlers, | ||
| http.post('/api/channels/search', async ({ request, params }) => { | ||
| action('POST /api/channels/search')(await request.json()); | ||
| return HttpResponse.json(params.untilId === 'lastchannel' ? [] : [ | ||
| channel(), | ||
| channel('lastchannel', 'Last Channel', null), | ||
| ]); | ||
| }), | ||
| ], | ||
| }, | ||
| }, | ||
| decorators: [ | ||
| () => ({ | ||
| template: '<div style="display: flex; align-items: center; justify-content: center; height: 100vh"><div style="max-width: 700px; width: 100%; margin: 3rem"><story/></div></div>', | ||
| }), | ||
| ], | ||
| } satisfies StoryObj<typeof MkChannelList>; |
43 changes: 43 additions & 0 deletions
43
packages/frontend/src/components/MkChannelPreview.stories.impl.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| /* | ||
| * SPDX-FileCopyrightText: syuilo and misskey-project | ||
| * SPDX-License-Identifier: AGPL-3.0-only | ||
| */ | ||
|
|
||
| /* eslint-disable @typescript-eslint/explicit-function-return-type */ | ||
| /* eslint-disable import/no-default-export */ | ||
| import { StoryObj } from '@storybook/vue3'; | ||
| import { channel } from '../../.storybook/fakes.js'; | ||
| import MkChannelPreview from './MkChannelPreview.vue'; | ||
| export const Default = { | ||
| render(args) { | ||
| return { | ||
| components: { | ||
| MkChannelPreview, | ||
| }, | ||
| setup() { | ||
| return { | ||
| args, | ||
| }; | ||
| }, | ||
| computed: { | ||
| props() { | ||
| return { | ||
| ...this.args, | ||
| }; | ||
| }, | ||
| }, | ||
| template: '<MkChannelPreview v-bind="props" />', | ||
| }; | ||
| }, | ||
| args: { | ||
| channel: channel(), | ||
| }, | ||
| parameters: { | ||
| layout: 'fullscreen', | ||
| }, | ||
| decorators: [ | ||
| () => ({ | ||
| template: '<div style="display: flex; align-items: center; justify-content: center; height: 100vh"><div style="max-width: 700px; width: 100%; margin: 3rem"><story/></div></div>', | ||
| }), | ||
| ], | ||
| } satisfies StoryObj<typeof MkChannelPreview>; |
Oops, something went wrong.
9849aabThere was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Chromatic detects changes. Please review the changes on Chromatic.