enhance(frontend): 로그인 화면에서 Enter를 입력하면 다음 단계로 이동할 수 있음

kokonect-link · Nov 7, 2024 · 1d1f6f5 · 1d1f6f5
1 parent 74f70ca
commit 1d1f6f5
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 3 deletions.
diff --git a/CHANGELOG_CHERRYPICK.md b/CHANGELOG_CHERRYPICK.md
@@ -31,6 +31,7 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2024xx](CHANGE
 ### Client
 - Enhance: 노트 작성 영역에서 각 항목이 더 잘 구분되도록 조정함
 - Enhance: `노트 삭제 예약`이 설정된 노트의 노트 삭제 시간을 알 수 있음
+- Enhance: 로그인 화면에서 `Enter`를 입력하면 다음 단계로 이동할 수 있음
 - Fix: 노트 삭제 예약 기한을 `기간 지정`으로 설정한 경우 노트가 즉시 삭제될 수 있음
 - Fix: 이벤트가 포함된 노트를 `삭제 후 편집` 또는 `내용 복사 후 편집`할 때, 이벤트를 편집하지 않으면 노트를 게시할 수 없음
 - Fix: `노트 삭제 예약`이 적용된 노트의 상태가 표시되지 않음

diff --git a/packages/frontend/src/components/MkSignin.input.vue b/packages/frontend/src/components/MkSignin.input.vue
@@ -32,7 +32,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 		<!-- username入力 -->
 		<form class="_gaps_s" @submit.prevent="emit('usernameSubmitted', username)">
-			<MkInput v-model="username" :placeholder="i18n.ts.username" type="text" pattern="^[a-zA-Z0-9_]+$" :spellcheck="false" autocomplete="username webauthn" autofocus required data-cy-signin-username>
+			<MkInput v-model="username" :placeholder="i18n.ts.username" type="text" pattern="^[a-zA-Z0-9_]+$" :spellcheck="false" autocomplete="username webauthn" autofocus required data-cy-signin-username @enter.prevent="emit('usernameSubmitted', username)">
 				<template #prefix>@</template>
 				<template #suffix>@{{ host }}</template>
 			</MkInput>

diff --git a/packages/frontend/src/components/MkSignin.password.vue b/packages/frontend/src/components/MkSignin.password.vue
@@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			<!-- ブラウザ オートコンプリート用 -->
 			<input type="hidden" name="username" autocomplete="username" :value="user.username">
 
-			<MkInput v-model="password" :placeholder="i18n.ts.password" type="password" autocomplete="current-password webauthn" :withPasswordToggle="true" required autofocus data-cy-signin-password>
+			<MkInput v-model="password" :placeholder="i18n.ts.password" type="password" autocomplete="current-password webauthn" :withPasswordToggle="true" required autofocus data-cy-signin-password @enter.prevent="onSubmit">
 				<template #prefix><i class="ti ti-lock"></i></template>
 				<template #caption><button class="_textButton" type="button" @click="resetPassword">{{ i18n.ts.forgotPassword }}</button></template>
 			</MkInput>

diff --git a/packages/frontend/src/components/MkSignin.totp.vue b/packages/frontend/src/components/MkSignin.totp.vue
@@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 		<!-- totp入力 -->
 		<form class="_gaps_s" @submit.prevent="emit('totpSubmitted', token)">
-			<MkInput v-model="token" type="text" :pattern="isBackupCode ? '^[A-Z0-9]{32}$' :'^[0-9]{6}$'" autocomplete="one-time-code" required autofocus :spellcheck="false" :inputmode="isBackupCode ? undefined : 'numeric'">
+			<MkInput v-model="token" type="text" :pattern="isBackupCode ? '^[A-Z0-9]{32}$' :'^[0-9]{6}$'" autocomplete="one-time-code" required autofocus :spellcheck="false" :inputmode="isBackupCode ? undefined : 'numeric'" @enter.prevent="emit('totpSubmitted', token)">
 				<template #label>{{ i18n.ts.token }} ({{ i18n.ts['2fa'] }})</template>
 				<template #prefix><i v-if="isBackupCode" class="ti ti-key"></i><i v-else class="ti ti-123"></i></template>
 				<template #caption><button class="_textButton" type="button" @click="isBackupCode = !isBackupCode">{{ isBackupCode ? i18n.ts.useTotp : i18n.ts.useBackupCode }}</button></template>