From 1a8a8806ee21d6b984d2c66fc62fa76e166b74ef Mon Sep 17 00:00:00 2001
From: leejooy96 <leejooy96@gmail.com>
Date: Tue, 31 Oct 2023 15:27:50 +0900
Subject: [PATCH] test: do not use deprecated methods

---
 src/renderer/screens/MainScreen.vue |  4 ++--
 tests/app.spec.ts                   | 19 ++++++++++---------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/renderer/screens/MainScreen.vue b/src/renderer/screens/MainScreen.vue
index f91f9822..df48345d 100644
--- a/src/renderer/screens/MainScreen.vue
+++ b/src/renderer/screens/MainScreen.vue
@@ -72,8 +72,8 @@ const handleCountIncrease = (): void => {
             </v-btn>
           </v-col>
           <v-col cols="3">
-            <v-badge id="counter-badge" color="blue" :content="counter">
-              <v-btn id="btn-counter" icon color="primary" @click="handleCountIncrease">
+            <v-badge data-testid="counter-badge" color="blue" :content="counter">
+              <v-btn data-testid="btn-counter" icon color="primary" @click="handleCountIncrease">
                 <v-icon icon="mdi-plus-circle" />
                 <v-tooltip activator="parent" location="bottom">
                   {{ $t('menu.increase-count') }}
diff --git a/tests/app.spec.ts b/tests/app.spec.ts
index 1a1d824e..baf80a77 100644
--- a/tests/app.spec.ts
+++ b/tests/app.spec.ts
@@ -12,9 +12,10 @@ function waiting(milliseconds: number) {
 function isElementVisible(selector: string, waitingMilliseconds = 100) {
   return new Promise((resolve) => {
     setTimeout(async () => {
-      expect(await appWindow.isVisible(selector), `Confirm selector '${selector}' is visible`).toBe(
-        true
-      )
+      await expect(
+        appWindow.locator(selector).first(),
+        `Confirm selector '${selector}' is visible`
+      ).toBeVisible()
       resolve(true)
     }, waitingMilliseconds)
   })
@@ -43,14 +44,14 @@ test('Document element check', async () => {
 })
 
 test('Counter button click check', async () => {
-  await appWindow.click('#btn-counter', { clickCount: 10, delay: 50 })
+  await appWindow.getByTestId('btn-counter').click({ clickCount: 10, delay: 50 })
 
-  const counterValueElement = await appWindow.$('#counter-badge .v-badge__badge')
+  const counterValueElement = await appWindow
+    .getByTestId('counter-badge')
+    .getByRole('status')
+    .innerHTML()
 
-  expect(
-    await appWindow.evaluate((element) => element.innerHTML, counterValueElement),
-    'Confirm counter value is same'
-  ).toBe('10')
+  expect(counterValueElement).toBe('10')
 })
 
 test.afterAll(async () => {