dify/web/app/components/base/node-status/index.spec.tsx

62 lines
2.3 KiB
TypeScript

import { render, screen } from '@testing-library/react'
import NodeStatus, { NodeStatusEnum } from '.'
describe('NodeStatus', () => {
it('renders with default status (warning) and default message', () => {
const { container } = render(<NodeStatus />)
expect(screen.getByText('Warning')).toBeInTheDocument()
// Default warning class
expect(container.firstChild).toHaveClass('bg-state-warning-hover')
expect(container.firstChild).toHaveClass('text-text-warning')
})
it('renders with error status and default message', () => {
const { container } = render(<NodeStatus status={NodeStatusEnum.error} />)
expect(screen.getByText('Error')).toBeInTheDocument()
expect(container.firstChild).toHaveClass('bg-state-destructive-hover')
expect(container.firstChild).toHaveClass('text-text-destructive')
})
it('renders with custom message', () => {
render(<NodeStatus message="Custom Message" />)
expect(screen.getByText('Custom Message')).toBeInTheDocument()
})
it('renders children correctly', () => {
render(
<NodeStatus>
<span data-testid="child">Child Element</span>
</NodeStatus>,
)
expect(screen.getByTestId('child')).toBeInTheDocument()
expect(screen.getByText('Child Element')).toBeInTheDocument()
})
it('applies custom className', () => {
const { container } = render(<NodeStatus className="custom-test-class" />)
expect(container.firstChild).toHaveClass('custom-test-class')
})
it('applies styleCss correctly', () => {
const { container } = render(<NodeStatus styleCss={{ color: 'red' }} />)
expect(container.firstChild).toHaveStyle({ color: 'rgb(255, 0, 0)' })
})
it('applies iconClassName to the icon', () => {
const { container } = render(<NodeStatus iconClassName="custom-icon-class" />)
// The icon is the first child of the div
const icon = container.querySelector('.custom-icon-class')
expect(icon).toBeInTheDocument()
expect(icon).toHaveClass('h-3.5')
expect(icon).toHaveClass('w-3.5')
})
it('passes additional HTML attributes to the container', () => {
render(<NodeStatus data-testid="node-status-container" id="my-id" />)
const container = screen.getByTestId('node-status-container')
expect(container).toHaveAttribute('id', 'my-id')
})
})