125 lines
3.3 KiB
TypeScript
125 lines
3.3 KiB
TypeScript
// ModelReload.test.tsx
|
|
import React from 'react'
|
|
import '@testing-library/jest-dom'
|
|
import { render, screen, act } from '@testing-library/react'
|
|
import ModelReload from './ModelReload'
|
|
import { useActiveModel } from '@/hooks/useActiveModel'
|
|
|
|
jest.mock('@/hooks/useActiveModel')
|
|
|
|
describe('ModelReload Component', () => {
|
|
beforeEach(() => {
|
|
jest.useFakeTimers()
|
|
})
|
|
|
|
afterEach(() => {
|
|
jest.useRealTimers()
|
|
})
|
|
|
|
it('renders nothing when not loading', () => {
|
|
;(useActiveModel as jest.Mock).mockReturnValue({
|
|
stateModel: { loading: false },
|
|
})
|
|
|
|
const { container } = render(<ModelReload />)
|
|
expect(container).toBeEmptyDOMElement()
|
|
})
|
|
|
|
it('renders loading message when loading', () => {
|
|
;(useActiveModel as jest.Mock).mockReturnValue({
|
|
stateModel: { loading: true, model: { id: 'test-model' } },
|
|
})
|
|
|
|
render(<ModelReload />)
|
|
expect(screen.getByText(/Reloading model test-model/)).toBeInTheDocument()
|
|
})
|
|
|
|
it('updates loader percentage over time', () => {
|
|
;(useActiveModel as jest.Mock).mockReturnValue({
|
|
stateModel: { loading: true, model: { id: 'test-model' } },
|
|
})
|
|
|
|
render(<ModelReload />)
|
|
|
|
// Initial render
|
|
expect(screen.getByText(/Reloading model test-model/)).toBeInTheDocument()
|
|
const loaderElement = screen.getByText(
|
|
/Reloading model test-model/
|
|
).parentElement
|
|
|
|
// Check initial width
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 50%')
|
|
|
|
// Advance timers and check updated width
|
|
act(() => {
|
|
jest.advanceTimersByTime(250)
|
|
})
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 78%')
|
|
|
|
// Advance to 99%
|
|
for (let i = 0; i < 27; i++) {
|
|
act(() => {
|
|
jest.advanceTimersByTime(250)
|
|
})
|
|
}
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 99%')
|
|
|
|
// Advance one more time to hit the 250ms delay
|
|
act(() => {
|
|
jest.advanceTimersByTime(250)
|
|
})
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 99%')
|
|
})
|
|
|
|
it('stops at 99%', () => {
|
|
;(useActiveModel as jest.Mock).mockReturnValue({
|
|
stateModel: { loading: true, model: { id: 'test-model' } },
|
|
})
|
|
|
|
render(<ModelReload />)
|
|
|
|
const loaderElement = screen.getByText(
|
|
/Reloading model test-model/
|
|
).parentElement
|
|
|
|
// Advance to 99%
|
|
for (let i = 0; i < 50; i++) {
|
|
act(() => {
|
|
jest.advanceTimersByTime(250)
|
|
})
|
|
}
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 99%')
|
|
|
|
// Advance more and check it stays at 99%
|
|
act(() => {
|
|
jest.advanceTimersByTime(1000)
|
|
})
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 99%')
|
|
})
|
|
|
|
it('resets to 0% when loading completes', () => {
|
|
const { rerender } = render(<ModelReload />)
|
|
;(useActiveModel as jest.Mock).mockReturnValue({
|
|
stateModel: { loading: true, model: { id: 'test-model' } },
|
|
})
|
|
|
|
rerender(<ModelReload />)
|
|
|
|
const loaderElement = screen.getByText(
|
|
/Reloading model test-model/
|
|
).parentElement
|
|
|
|
expect(loaderElement?.firstChild).toHaveStyle('width: 50%')
|
|
// Set loading to false
|
|
;(useActiveModel as jest.Mock).mockReturnValue({
|
|
stateModel: { loading: false },
|
|
})
|
|
|
|
rerender(<ModelReload />)
|
|
|
|
expect(
|
|
screen.queryByText(/Reloading model test-model/)
|
|
).not.toBeInTheDocument()
|
|
})
|
|
})
|