diff --git a/packages/frontend/src/components/MkChannelFollowButton.stories.impl.ts b/packages/frontend/src/components/MkChannelFollowButton.stories.impl.ts
index 08357ce736..e918fa7f42 100644
--- a/packages/frontend/src/components/MkChannelFollowButton.stories.impl.ts
+++ b/packages/frontend/src/components/MkChannelFollowButton.stories.impl.ts
@@ -8,9 +8,18 @@
 import { StoryObj } from '@storybook/vue3';
 import { HttpResponse, http } from 'msw';
 import { action } from '@storybook/addon-actions';
+import { expect, userEvent, waitFor, within } from '@storybook/test';
 import { channel } from '../../.storybook/fakes.js';
 import { commonHandlers } from '../../.storybook/mocks.js';
 import MkChannelFollowButton from './MkChannelFollowButton.vue';
+import { semaphore, tick } 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 {
@@ -36,6 +45,19 @@ export const Default = {
 		channel: channel(),
 		full: true,
 	},
+	async play({ canvasElement }) {
+		await s.acquire();
+		await sleep(100);
+		const canvas = within(canvasElement);
+		const buttonElement = canvas.getByRole<HTMLButtonElement>('button');
+		await expect(buttonElement).toHaveTextContent(i18n.ts.follow);
+		await userEvent.click(buttonElement);
+		await sleep(100);
+		await expect(buttonElement).toHaveTextContent(i18n.ts.unfollow);
+		await sleep(100);
+		await userEvent.click(buttonElement);
+		s.release();
+	},
 	parameters: {
 		layout: 'centered',
 		msw: {