dify

dify/web/app/components/base/spinner/index.spec.tsx

@@ -0,0 +1,49 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import '@testing-library/jest-dom'
+import Spinner from './index'
+
+describe('Spinner component', () => {
+  it('should render correctly when loading is true', () => {
+    const { container } = render(<Spinner loading={true} />)
+    const spinner = container.firstChild as HTMLElement
+
+    expect(spinner).toHaveClass('animate-spin')
+
+    // Check for accessibility text
+    const screenReaderText = spinner.querySelector('span')
+    expect(screenReaderText).toBeInTheDocument()
+    expect(screenReaderText).toHaveTextContent('Loading...')
+  })
+
+  it('should be hidden when loading is false', () => {
+    const { container } = render(<Spinner loading={false} />)
+    const spinner = container.firstChild as HTMLElement
+
+    expect(spinner).toHaveClass('hidden')
+  })
+
+  it('should render with custom className', () => {
+    const customClass = 'text-blue-500'
+    const { container } = render(<Spinner loading={true} className={customClass} />)
+    const spinner = container.firstChild as HTMLElement
+
+    expect(spinner).toHaveClass(customClass)
+  })
+
+  it('should render children correctly', () => {
+    const childText = 'Child content'
+    const { getByText } = render(
+      <Spinner loading={true}>{childText}</Spinner>,
+    )
+
+    expect(getByText(childText)).toBeInTheDocument()
+  })
+
+  it('should use default loading value (false) when not provided', () => {
+    const { container } = render(<Spinner />)
+    const spinner = container.firstChild as HTMLElement
+
+    expect(spinner).toHaveClass('hidden')
+  })
+})