From be97d94ef6c157da602db6b0cf0d9b883ce1fb09 Mon Sep 17 00:00:00 2001
From: Amirhossein Khalili <amirhosseinkhalili901@gmail.com>
Date: Mon, 21 Sep 2026 18:11:17 +0330
Subject: [PATCH] test(frontend): fix teleported toast assertions

---
 frontend/app/components/CardConverter.test.ts | 22 +++++++++++++------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/frontend/app/components/CardConverter.test.ts b/frontend/app/components/CardConverter.test.ts
index 5c51ff3..a98799f 100644
--- a/frontend/app/components/CardConverter.test.ts
+++ b/frontend/app/components/CardConverter.test.ts
@@ -1,12 +1,24 @@
-import { flushPromises, mount } from '@vue/test-utils'
+import { enableAutoUnmount, flushPromises, mount } from '@vue/test-utils'
 import { afterEach, describe, expect, it, vi } from 'vitest'
 
 import CardConverter from './CardConverter.vue'
 
+enableAutoUnmount(afterEach)
+
 afterEach(() => {
   vi.unstubAllGlobals()
 })
 
+function getAlert() {
+  const alert = document.body.querySelector<HTMLElement>('[role="alert"]')
+
+  if (!alert) {
+    throw new Error('Expected an alert to be rendered')
+  }
+
+  return alert
+}
+
 describe('CardConverter', () => {
   it('shows client validation without calling the API', async () => {
     const fetchMock = vi.fn()
@@ -19,7 +31,7 @@ describe('CardConverter', () => {
     await wrapper.get('form').trigger('submit')
 
     expect(fetchMock).not.toHaveBeenCalled()
-    expect(wrapper.get('[role="alert"]').text()).toContain('۱۶ رقم')
+    expect(getAlert().textContent).toContain('۱۶ رقم')
   })
 
   it('renders the returned iban after a successful request', async () => {
@@ -46,8 +58,6 @@ describe('CardConverter', () => {
 
     expect(wrapper.text()).toContain('IR82 0540 1026 8002 0817 9090 02')
     expect(document.activeElement?.getAttribute('data-result')).toBe('iban')
-
-    wrapper.unmount()
   })
 
   it('renders the safe API error message', async () => {
@@ -74,8 +84,6 @@ describe('CardConverter', () => {
     await wrapper.get('form').trigger('submit')
     await flushPromises()
 
-    expect(wrapper.get('[role="alert"]').text()).toContain(
-      'تبدیل این شماره کارت انجام نشد.',
-    )
+    expect(getAlert().textContent).toContain('تبدیل این شماره کارت انجام نشد.')
   })
 })