Add check chtext element and ids,fix quest problem

app/src/components/AuthForm.vue

@@ -99,7 +99,7 @@ const handleChange = () => {
     </div>
     <form @submit.prevent="handleSubmit()" class="w-full">
       <div v-if="socialLogin && hasSocialLogins">
-        <a
+        <a id="GoogleLogin"
           v-if="availableMethods.google"
           class="inline-flex justify-center items-center rounded-lg py-2 mt-3 bg-bg-primary text-text-secondary w-full border-text-secondary border-2"
           href="/api/v1/auth/google"
@@ -113,7 +113,7 @@ const handleChange = () => {
             以Google繼續
           </span>
         </a>
-        <a
+        <a id="GitHubLogin"
           v-if="availableMethods.github"
           class="inline-flex justify-center items-center rounded-lg py-2 mt-3 bg-bg-primary text-text-secondary w-full border-text-secondary border-2"
           href="/api/v1/auth/github"
@@ -124,10 +124,11 @@ const handleChange = () => {
           />
           <span class="font-medium">
             <!-- Continue with GitHub -->
-            以Github繼續
+            以GitHub繼續
           </span>
         </a>
         <p
+          id="or"
           class="text-text-secondary flex justify-center mt-3"
           v-if="type === 'login' || type === 'register'"
         >
@@ -210,10 +211,11 @@ const handleChange = () => {
           @input="handleChange()"
         />
       </div>
-      <p class="text-error flex justify-center" v-if="errorMessage">
+      <p id="ErrorDisplay" class="text-error flex justify-center" v-if="errorMessage">
         {{ errorMessage }}
       </p>
       <button
+        id="LogInOrSignUp"
         class="inline-flex justify-center rounded-lg font-black py-2 bg-text-primary text-bg w-full"
         type="submit"
       >
@@ -227,21 +229,21 @@ const handleChange = () => {
         </span>
       </button>
 
-      <p class="text-text flex justify-center mt-3">
-        <span v-if="type === 'register'">
+      <p id="SwitchLoginRegister" class="text-text flex justify-center mt-3">
+        <span id="CheckRegistered" v-if="type === 'register'">
           <!-- Already have an account? -->
           已經有帳號了嗎？
-          <RouterLink class="text-text-primary font-bold" to="/login">
+          <RouterLink id="SwitchtoLogin" class="text-text-primary font-bold" to="/login">
             <u>
               <!-- Log in -->
               登入
             </u>
           </RouterLink></span
         >
-        <span v-else-if="type === 'login'">
+        <span id="CheckRegistered" v-else-if="type === 'login'">
           <!-- Don't have an account? -->
           還沒有帳號嗎？
-          <RouterLink class="text-text-primary font-bold" to="/register">
+          <RouterLink id="SwitchtoRegister" class="text-text-primary font-bold" to="/register">
             <u>
               <!-- Sign up -->
               註冊

app/src/components/CommandlistPart.vue

@@ -2,7 +2,7 @@
 
 <template>
   <font-awesome-icon :icon="['fas', 'list']" class="text-text-primary p-1" />
-  <h1 class="inline text-text-primary font-xl">
+  <h1 id="CommandBook" class="inline text-text-primary font-xl">
     <!-- Command Cheatsheets -->
     指令之書
   </h1>

app/src/components/CompleteModal.vue

@@ -18,7 +18,7 @@ setTimeout(() => {
   <div v-if="showModal" class="modal">
     <div class="modal-content bg-bg-secondary rounded-lg">
       <span class="close text-text" @click="closeModal">&times;</span>
-      <h2 class="text-2xl text-text mb-5 w-full inline-flex justify-center">
+      <h2 id="QuestCompleted" class="text-2xl text-text mb-5 w-full inline-flex justify-center">
         <!-- Quest Completed! -->
         關卡完成！
       </h2>
@@ -27,6 +27,7 @@ setTimeout(() => {
         如果您能撥冗填寫這份問卷，我們將不勝感激，這對我們非常重要！
       </p>
       <a
+        id="SurveyButton"
         :href="surveyUrl"
         target="_blank"
         class="inline-flex justify-center rounded-lg text-base font-black py-2 mt-3 bg-text-primary w-full"

app/src/components/GameHeaderPart.vue

@@ -37,7 +37,7 @@ const handleLogout = async () => {
             class="text-text-tertiary h-full w-full"
           />
         </button> -->
-        <p
+        <p id="HeaderText"
           class="text-text-primary inline-block font-bold whitespace-nowrap"
           style="font-size: 2vh"
           v-if="sessionStore.quest"

app/src/components/QuestPart.vue

@@ -12,7 +12,7 @@ import sessionStore from '../store/session'
       <div v-if="sessionStore.quest" class="whitespace-pre-wrap">
         <p class="text-text">{{ sessionStore.quest.instruction }}</p>
         <br />
-        <p class="text-text">
+        <p id="tasks" class="text-text">
           <!-- Tasks: -->
           任務：
         </p>

app/src/components/TerminalPart.vue

@@ -1,6 +1,6 @@
 <template>
   <font-awesome-icon :icon="['fas', 'terminal']" class="text-text p-1" />
-  <button class="text-text h-[5%]">
+  <button id="Terminal" class="text-text h-[5%]">
     <!-- Terminal -->
     終端機
   </button>

app/src/views/LoginPage.vue

@@ -42,7 +42,7 @@ const handleLogin = async ({ username, password, success, error }) => {
       class="w-screen h-screen absolute top-0 left-0 flex flex-wrap justify-center content-center"
     >
       <div class="w-fit">
-        <AuthForm @onSubmit="handleLogin" type="login" />
+        <AuthForm  @onSubmit="handleLogin" type="login" />
       </div>
     </div>
   </div>