test: use testid instead of element selector

src/renderer/screens/MainScreen.vue

@@ -49,7 +49,7 @@ const handleCountIncrease = (): void => {
     <v-row no-gutters align="center" class="text-center">
       <v-col cols="12" md="5">
         <img
-          id="main-logo"
+          data-testid="main-logo"
           alt="logo"
           draggable="false"
           class="ma-auto h-auto w-75"
@@ -59,9 +59,9 @@ const handleCountIncrease = (): void => {
       <v-col cols="12" md="7">
         <h2 class="my-4">{{ $t('desc.welcome-title') }}</h2>
         <p>{{ $t('desc.welcome-desc') }}</p>
-        <p class="my-4"
+        <p class="my-4">
-          >App Version: <strong>{{ appVersion }}</strong></p
+          App Version: <strong>{{ appVersion }}</strong>
-        >
+        </p>
         <v-row class="my-4">
           <v-col cols="3">
             <v-btn icon color="primary" @click="handleChangeTheme">
@@ -99,7 +99,7 @@ const handleCountIncrease = (): void => {
           </v-col>
           <v-col cols="12">
             <v-select
-              id="select-language"
+              data-testid="select-language"
               :model-value="locale"
               density="compact"
               :label="$t('menu.change-language')"

tests/app.spec.ts

@@ -9,11 +9,11 @@ function waiting(milliseconds: number) {
   return new Promise((resolve) => setTimeout(resolve, milliseconds))
 }
 
-function isElementVisible(selector: string, waitingMilliseconds = 100) {
+function existElementByTestId(selector: string, waitingMilliseconds = 100) {
   return new Promise((resolve) => {
     setTimeout(async () => {
       await expect(
-        appWindow.locator(selector).first(),
+        appWindow.getByTestId(selector).first(),
         `Confirm selector '${selector}' is visible`
       ).toBeVisible()
       resolve(true)
@@ -38,9 +38,8 @@ test('Environment check', async () => {
 })
 
 test('Document element check', async () => {
-  await isElementVisible('.v-toolbar__content')
+  await existElementByTestId('main-logo')
-  await isElementVisible('#main-logo')
+  await existElementByTestId('select-language')
-  await isElementVisible('#select-language')
 })
 
 test('Counter button click check', async () => {