Adds missing test cases for UI components (#26)

Introduces test cases for rendering various UI components, ensuring proper functionality and visual representation.
This addition improves the overall test coverage and reliability of the application.

Author: sensasi-delight

src/components/ui/avatar.test.tsx

@@ -0,0 +1,36 @@
+import { expect, test } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import {
+  Avatar,
+  // AvatarImage,
+  AvatarFallback,
+} from './avatar'
+
+test('Avatar can be rendered', () => {
+  const testId = Date.now()
+
+  render(<Avatar data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+// test('AvatarImage can be rendered', () => {
+//   const testId = Date.now()
+
+//   render(
+//     <Avatar>
+//       <AvatarImage src="/" />
+//     </Avatar>
+//   )
+//   expect(screen.getByTestId(testId)).toBeDefined()
+// })
+
+test('AvatarFallback can be rendered', () => {
+  const testId = Date.now()
+
+  render(
+    <Avatar>
+      <AvatarFallback data-testid={testId} />
+    </Avatar>
+  )
+  expect(screen.getByTestId(testId)).toBeDefined()
+})

src/components/ui/badge.test.tsx

@@ -0,0 +1,10 @@
+import { expect, test } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import { Badge } from './badge'
+
+const testId = Date.now()
+
+test('can be rendered', () => {
+  render(<Badge data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})

src/components/ui/button.test.tsx

@@ -0,0 +1,10 @@
+import { expect, test } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import { Button } from './button'
+
+const testId = Date.now()
+
+test('can be rendered', () => {
+  render(<Button data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})

src/components/ui/card.test.tsx

@@ -0,0 +1,60 @@
+import { expect, test } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import {
+  Card,
+  CardAction,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from './card'
+
+test('Card can be rendered', () => {
+  const testId = Date.now()
+
+  render(<Card data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+test('CardHeader can be rendered', () => {
+  const testId = Date.now()
+
+  render(<CardHeader data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+test('CardContent can be rendered', () => {
+  const testId = Date.now()
+
+  render(<CardContent data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+test('CardFooter can be rendered', () => {
+  const testId = Date.now()
+
+  render(<CardFooter data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+test('CardTitle can be rendered', () => {
+  const testId = Date.now()
+
+  render(<CardTitle data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+test('CardAction can be rendered', () => {
+  const testId = Date.now()
+
+  render(<CardAction data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})
+
+test('CardDescription can be rendered', () => {
+  const testId = Date.now()
+
+  render(<CardDescription data-testid={testId} />)
+  expect(screen.getByTestId(testId)).toBeDefined()
+})