e2eを復活させてみる

cypress/e2e/basic.cy.ts

@@ -51,7 +51,7 @@ describe('After setup instance', () => {
     cy.visitHome();
   });
 
-	it('signup', () => {
+	it('signup / onboarding', () => {
 		cy.visitHome();
 
 		cy.intercept('POST', '/api/signup').as('signup');
@@ -73,6 +73,50 @@ describe('After setup instance', () => {
 		cy.get('[data-cy-signup-submit]').click();
 
 		cy.wait('@signup');
+
+		// /onboarding にリダイレクトされる
+		cy.wait(5000);
+		cy.url().should('be', Cypress.config().baseUrl + '/onboarding');
+
+		// 「始める」
+		// 最初にアニメーションがあるので待つ
+		cy.get('[data-cy-user-setup-start]', { timeout: 15000 }).click();
+
+		// 【設定】プロフィール
+		cy.get('[data-cy-user-setup-user-name] input').type('ありす');
+		cy.get('[data-cy-user-setup-user-description] textarea').type('ほげ');
+
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【チュートリアル】ノートって何？
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【チュートリアル】リアクションって何？
+		// インタラクティブ要素があるが、テスト時は無視できるようになっている
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【チュートリアル】タイムラインのしくみ
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【設定】フォロー
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【チュートリアル】ノートの投稿設定
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【チュートリアル】添付ファイルをセンシティブにするには？
+		// インタラクティブ要素があるが、テスト時は無視できるようになっている
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 【設定】プライバシー設定
+		cy.get('[data-cy-user-setup-next]').click();
+
+		// 完了（「ホーム画面に進む」ボタン）
+		cy.get('[data-cy-user-setup-complete]').click();
+
+		// ホームにリダイレクトされる
+		cy.wait(5000);
+		cy.url().should('be', Cypress.config().baseUrl + '/home');
   });
 
   it('signup with duplicated username', () => {

packages/frontend/src/components/MkTutorial.ProfileSettings.vue

@@ -17,11 +17,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</div>
 	</FormSlot>
 
-	<MkInput v-model="name" :max="30" manualSave>
+	<MkInput v-model="name" :max="30" manualSave data-cy-user-setup-user-name>
 		<template #label>{{ i18n.ts._profile.name }}</template>
 	</MkInput>
 
-	<MkTextarea v-model="description" :max="500" tall manualSave>
+	<MkTextarea v-model="description" :max="500" tall manualSave data-cy-user-setup-user-description>
 		<template #label>{{ i18n.ts._profile.description }}</template>
 	</MkTextarea>
 

packages/frontend/src/components/MkTutorial.vue

@@ -28,7 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 							<i class="ti ti-confetti" style="display: block; margin: auto; font-size: 3em; color: var(--accent);"></i>
 							<div style="font-size: 120%;">{{ i18n.ts._initialTutorial._landing.title }}</div>
 							<div>{{ i18n.ts._initialTutorial._landing.description }}</div>
-							<MkButton primary rounded gradate style="margin: 16px auto 0 auto;" data-cy-user-setup-continue @click="next">{{ i18n.ts._initialTutorial.launchTutorial }} <i class="ti ti-arrow-right"></i></MkButton>
+							<MkButton primary rounded gradate style="margin: 16px auto 0 auto;" data-cy-user-setup-start @click="next">{{ i18n.ts._initialTutorial.launchTutorial }} <i class="ti ti-arrow-right"></i></MkButton>
 							<MkButton v-if="skippable" style="margin: 0 auto;" transparent rounded data-cy-user-setup-close @click="emit('close', true)">{{ i18n.ts.close }}</MkButton>
 						</div>
 					</MkSpacer>
@@ -72,7 +72,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<div :class="[$style.pageFooter, { [$style.pageFooterShown]: (page > 0 && page < MAX_PAGE) }]">
 		<div class="_buttonsCenter">
 			<MkButton v-if="initialPage !== page" :disabled="areButtonsLocked" rounded @click="prev"><i class="ti ti-arrow-left"></i> {{ i18n.ts.goBack }}</MkButton>
-			<MkButton primary rounded gradate :disabled="!canContinue" data-cy-user-setup-continue @click="next">{{ i18n.ts.continue }} <i class="ti ti-arrow-right"></i></MkButton>
+			<MkButton primary rounded gradate :disabled="!canContinue" data-cy-user-setup-next @click="next">{{ i18n.ts.continue }} <i class="ti ti-arrow-right"></i></MkButton>
 		</div>
 	</div>
 </div>