Anvil/tests/components/atoms/Avatar.test.ts

61 lines
1.4 KiB
TypeScript
Raw Normal View History

import '@testing-library/jest-dom'
import { render, screen } from '@testing-library/svelte'
import Avatar from '../../../src/lib/components/atoms/Avatar.svelte'
describe('Avatar.svelte', () => {
it('should mount', () => {
// Arrange
// Nothing to prepare
// Act
const { container } = render(Avatar);
// Assert
expect(container).toBeTruthy()
})
it('should pick up the passed image', () => {
// Arrange
const avatar = 'https://example.com/avatar.png'
// Act
render(Avatar, { avatar })
const figure = screen.getByTestId('avatar')
const image = figure.querySelector('img')
// Assert
expect(figure).toBeInTheDocument()
expect(image).not.toBeNull()
expect(image).toHaveAttribute('src', avatar)
})
it('should use an image with alt text', () => {
// Arrange
const avatar = 'https://example.com/avatar.png'
const displayName = 'Jane Doe'
// Act
render(Avatar, { avatar, displayName })
const figure = screen.getByTestId('avatar')
// Assert
expect(figure).toBeInTheDocument()
expect(screen.getByAltText(displayName)).toBeDefined()
})
it('should use the initials as text', () => {
// Arrange
const displayName = 'Jane Doe'
const initials = displayName.substring(0, 2).toUpperCase()
// Act
render(Avatar, { displayName })
const figure = screen.getByTestId('avatar')
// Assert
expect(figure).toBeInTheDocument()
expect(screen.getByText(initials)).toBeDefined()
})
})