From 2cdef0f7bdf2d43e48276dddb8330c372e2689ee Mon Sep 17 00:00:00 2001
From: iNSaNiA0821 <shinjisakai821@gmail.com>
Date: Tue, 3 Dec 2024 12:57:09 -0500
Subject: [PATCH] chore: add VIcon vitest file(#20517)

---
 .../VIcon/__tests__/VIcon.spec.browser.tsx    |  59 ++++++++
 .../VIcon/__tests__/VIcon.spec.cy.tsx         | 126 ------------------
 2 files changed, 59 insertions(+), 126 deletions(-)
 create mode 100644 packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.browser.tsx
 delete mode 100644 packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.cy.tsx

diff --git a/packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.browser.tsx b/packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.browser.tsx
new file mode 100644
index 00000000000..74c828e877b
--- /dev/null
+++ b/packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.browser.tsx
@@ -0,0 +1,59 @@
+import { VIcon } from '../VIcon'
+
+// Utilities
+import { render, screen } from '@test'
+
+describe('VIcon', () => {
+  describe('icon prop', () => {
+    it('should render icon from default set', () => {
+      render(() => <VIcon icon="mdi-home" />)
+
+      const icon = screen.getByText('', { selector: '.mdi-home' })
+      expect(icon).toHaveClass('mdi-home')
+      expect(icon).toHaveClass('mdi')
+    })
+  })
+
+  describe('default slot', () => {
+    it('should render icon from default set', () => {
+      render(() => <VIcon>mdi-home</VIcon>)
+
+      const icon = screen.getByText('', { selector: '.mdi-home' })
+      expect(icon).toHaveClass('mdi-home')
+      expect(icon).toHaveClass('mdi')
+    })
+
+    it('should render default slot if no icon value is found', () => {
+      const Foo = () => (
+        <svg style="width: 100%; height: 100%;" class="foo">
+          <path d="M7,10L12,15L17,10H7Z" />
+        </svg>
+      )
+
+      render(() => (
+        <VIcon>
+          <Foo />
+        </VIcon>
+      ))
+
+      const svg = screen.getByText('', { selector: '.foo' })
+      expect(svg).toBeInTheDocument()
+    })
+  })
+
+  it('should render svg icon', () => {
+    render(() => <VIcon icon="svg:M7,10L12,15L17,10H7Z" />)
+
+    const svg = screen.getByText('', { selector: 'svg' })
+    expect(svg).toBeInTheDocument()
+    const path = svg.querySelector('path')
+    expect(path).toHaveAttribute('d', 'M7,10L12,15L17,10H7Z')
+  })
+
+  it('should render class icon', () => {
+    render(() => <VIcon icon="class:foo" />)
+
+    const icon = screen.getByText('', { selector: '.foo' })
+    expect(icon).toHaveClass('foo')
+  })
+})
diff --git a/packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.cy.tsx b/packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.cy.tsx
deleted file mode 100644
index c1b34f9a4a7..00000000000
--- a/packages/vuetify/src/components/VIcon/__tests__/VIcon.spec.cy.tsx
+++ /dev/null
@@ -1,126 +0,0 @@
-/// <reference types="../../../../types/cypress" />
-
-// Components
-import { VClassIcon } from '..'
-import { VIcon } from '../VIcon'
-
-// Icons
-import { aliases } from '@/iconsets/mdi'
-
-// Utilities
-import { defineComponent } from 'vue'
-
-describe('VIcon', () => {
-  describe('icon prop', () => {
-    it('should render icon from default set', () => {
-      cy.mount(() => (
-        <VIcon icon="mdi-home" />
-      ))
-
-      cy.get('.v-icon').should('have.class', 'mdi')
-      cy.get('.v-icon').should('have.class', 'mdi-home')
-    })
-
-    it('should render aliased icon', () => {
-      cy.mount(() => (
-        <VIcon icon="$close" />
-      ), null, { icons: { aliases } })
-
-      cy.get('.v-icon').should('have.class', 'mdi')
-      cy.get('.v-icon').should('have.class', 'mdi-close')
-    })
-
-    it('should render icon from alternative set', () => {
-      cy.mount(() => (
-        <VIcon icon="foo:bar" />
-      ), null, {
-        icons: {
-          defaultSet: 'mdi',
-          sets: {
-            foo: {
-              component: props => <VClassIcon { ...props } />,
-            },
-          },
-        },
-      })
-
-      cy.get('.v-icon').should('have.class', 'bar')
-    })
-  })
-
-  describe('default slot', () => {
-    it('should render icon from default set', () => {
-      cy.mount(() => (
-        <VIcon>mdi-home</VIcon>
-      ))
-
-      cy.get('.v-icon').should('have.class', 'mdi')
-      cy.get('.v-icon').should('have.class', 'mdi-home')
-    })
-
-    it('should render aliased icon', () => {
-      cy.mount(() => (
-        <VIcon>$close</VIcon>
-      ), null, { icons: { aliases } })
-
-      cy.get('.v-icon').should('have.class', 'mdi')
-      cy.get('.v-icon').should('have.class', 'mdi-close')
-    })
-
-    it('should render icon from alternative set', () => {
-      cy.mount(() => (
-        <VIcon>
-          foo:bar
-        </VIcon>
-      ), null, {
-        icons: {
-          defaultSet: 'mdi',
-          sets: {
-            foo: {
-              component: props => <VClassIcon { ...props } />,
-            },
-          },
-        },
-      })
-
-      cy.get('.v-icon').should('have.class', 'bar')
-    })
-
-    it('should render default slot if no icon value found', () => {
-      const Foo = defineComponent({
-        setup () {
-          return () => (
-            <svg style="width: 100%; height: 100%;" class="foo">
-              <path d="M7,10L12,15L17,10H7Z"></path>
-            </svg>
-          )
-        },
-      })
-
-      cy.mount(() => (
-        <VIcon>
-          <Foo>bar</Foo>
-        </VIcon>
-      ))
-
-      cy.get('.v-icon > svg.foo').should('exist')
-    })
-  })
-
-  it('should render svg icon', () => {
-    cy.mount(() => (
-      <VIcon icon="svg:M7,10L12,15L17,10H7Z" />
-    ))
-
-    cy.get('.v-icon svg').should('exist')
-    cy.get('.v-icon path').should('have.attr', 'd', 'M7,10L12,15L17,10H7Z')
-  })
-
-  it('should render class icon', () => {
-    cy.mount(() => (
-      <VIcon icon="class:foo" />
-    ))
-
-    cy.get('.v-icon').should('have.class', 'foo')
-  })
-})