expo-popcore-app/components/message/SwipeToDelete.test.tsx

105 lines
2.8 KiB
TypeScript

import React from 'react'
import { render, fireEvent } from '@testing-library/react-native'
import { SwipeToDelete } from './SwipeToDelete'
describe('SwipeToDelete Component', () => {
const mockOnDelete = jest.fn()
const mockChildren = <></>
beforeEach(() => {
jest.clearAllMocks()
})
it('should render children', () => {
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete}>
<></>
</SwipeToDelete>
)
expect(getByTestId('swipe-container')).toBeTruthy()
})
it('should render delete button', () => {
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete}>
<></>
</SwipeToDelete>
)
expect(getByTestId('swipe-delete-button')).toBeTruthy()
})
it('should call onDelete when delete button is pressed', () => {
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete}>
<></>
</SwipeToDelete>
)
fireEvent.press(getByTestId('swipe-delete-button'))
expect(mockOnDelete).toHaveBeenCalledTimes(1)
})
it('should render with custom delete text', () => {
const { getByText } = render(
<SwipeToDelete onDelete={mockOnDelete} deleteText="移除">
<></>
</SwipeToDelete>
)
expect(getByText('移除')).toBeTruthy()
})
it('should render default delete text when not provided', () => {
const { getByText } = render(
<SwipeToDelete onDelete={mockOnDelete}>
<></>
</SwipeToDelete>
)
expect(getByText('删除')).toBeTruthy()
})
it('should be disabled when disabled prop is true', () => {
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete} disabled>
<></>
</SwipeToDelete>
)
fireEvent.press(getByTestId('swipe-delete-button'))
expect(mockOnDelete).not.toHaveBeenCalled()
})
it('should apply custom style to container', () => {
const customStyle = { marginTop: 10 }
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete} style={customStyle}>
<></>
</SwipeToDelete>
)
const container = getByTestId('swipe-container')
expect(container).toBeTruthy()
})
})
describe('SwipeToDelete Accessibility', () => {
const mockOnDelete = jest.fn()
it('should have accessible delete button', () => {
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete}>
<></>
</SwipeToDelete>
)
const deleteButton = getByTestId('swipe-delete-button')
expect(deleteButton.props.accessibilityRole).toBe('button')
})
it('should have accessibility label on delete button', () => {
const { getByTestId } = render(
<SwipeToDelete onDelete={mockOnDelete}>
<></>
</SwipeToDelete>
)
const deleteButton = getByTestId('swipe-delete-button')
expect(deleteButton.props.accessibilityLabel).toBe('删除')
})
})