233 lines
10 KiB
TypeScript
233 lines
10 KiB
TypeScript
import { describe, it, expect, vi, beforeEach } from 'vitest'
|
|
import { render, screen, waitFor } from '@testing-library/react'
|
|
import userEvent from '@testing-library/user-event'
|
|
import { MemoryRouter, Route, Routes } from 'react-router-dom'
|
|
import ItemPage from '../src/pages/ItemPage.js'
|
|
import type { ItemDetail, MatchedAlbum } from '../src/types.js'
|
|
|
|
vi.mock('../src/api.js', async (importOriginal) => {
|
|
const actual = await importOriginal<typeof import('../src/api.js')>()
|
|
return {
|
|
...actual,
|
|
api: {
|
|
...actual.api,
|
|
getItem: vi.fn(),
|
|
setRip: vi.fn(),
|
|
setMatch: vi.fn(),
|
|
deleteItem: vi.fn(),
|
|
searchAlbums: vi.fn(),
|
|
lendItem: vi.fn(),
|
|
returnLoan: vi.fn(),
|
|
},
|
|
}
|
|
})
|
|
|
|
import { api, ApiError } from '../src/api.js'
|
|
|
|
const item: ItemDetail = {
|
|
id: 1,
|
|
discogsReleaseId: 1001,
|
|
title: 'Motion',
|
|
artist: 'The Cinematic Orchestra',
|
|
year: 1999,
|
|
formats: ['CD'],
|
|
genres: ['Electronic'],
|
|
labels: ['Ninja Tune'],
|
|
tracklist: [{ position: '1', title: 'Overture' }],
|
|
catno: 'ZENCD012',
|
|
country: 'UK',
|
|
artworkUrl: '/artwork/abc.jpg',
|
|
barcodes: ['5021592210629'],
|
|
dateAdded: '2026-08-29',
|
|
ripOverride: null,
|
|
ripStatus: 'not_ripped',
|
|
matchedAlbum: null,
|
|
loan: null,
|
|
}
|
|
|
|
const matched: MatchedAlbum = {
|
|
id: 77,
|
|
subsonicId: 'alb-1',
|
|
lastPlayedAt: '2026-09-01T10:00:00Z',
|
|
webUrl: 'http://navidrome.local/app/#/album/alb-1',
|
|
}
|
|
const rippedItem: ItemDetail = { ...item, ripStatus: 'ripped', matchedAlbum: matched }
|
|
|
|
beforeEach(() => {
|
|
vi.mocked(api.getItem).mockReset()
|
|
vi.mocked(api.getItem).mockResolvedValue(item as never)
|
|
vi.mocked(api.setRip).mockReset()
|
|
vi.mocked(api.setMatch).mockReset()
|
|
vi.mocked(api.deleteItem).mockReset()
|
|
vi.mocked(api.searchAlbums).mockReset()
|
|
vi.mocked(api.lendItem).mockReset()
|
|
vi.mocked(api.returnLoan).mockReset()
|
|
})
|
|
|
|
function renderItem() {
|
|
return render(
|
|
<MemoryRouter initialEntries={['/item/1']}>
|
|
<Routes>
|
|
<Route path="/item/:id" element={<ItemPage />} />
|
|
<Route path="/library" element={<p>library</p>} />
|
|
</Routes>
|
|
</MemoryRouter>
|
|
)
|
|
}
|
|
|
|
describe('ItemPage', () => {
|
|
it('renders metadata and the rip-status banner', async () => {
|
|
renderItem()
|
|
await waitFor(() => expect(screen.getByRole('heading', { name: 'Motion' })).toBeTruthy())
|
|
expect(screen.getByText('The Cinematic Orchestra')).toBeTruthy()
|
|
expect(screen.getByText(/not ripped yet/i)).toBeTruthy()
|
|
expect(screen.getByText(/ZENCD012/)).toBeTruthy()
|
|
expect(screen.getByText(/5021592210629/)).toBeTruthy()
|
|
expect(screen.getByText('Overture')).toBeTruthy()
|
|
expect(screen.getByRole('link', { name: /view on discogs/i }).getAttribute('href')).toBe(
|
|
'https://www.discogs.com/release/1001'
|
|
)
|
|
})
|
|
|
|
it('rip override: mark ripped, then reset to auto', async () => {
|
|
vi.mocked(api.setRip).mockResolvedValue({ ...item, ripOverride: true, ripStatus: 'ripped' } as never)
|
|
renderItem()
|
|
await userEvent.click(await screen.findByRole('button', { name: /mark ripped/i }))
|
|
await waitFor(() => expect(api.setRip).toHaveBeenCalledWith(1, true))
|
|
await waitFor(() => expect(screen.getByText(/in your digital collection/i)).toBeTruthy())
|
|
|
|
vi.mocked(api.setRip).mockResolvedValue(item as never)
|
|
await userEvent.click(screen.getByRole('button', { name: /reset to auto/i }))
|
|
await waitFor(() => expect(api.setRip).toHaveBeenCalledWith(1, null))
|
|
})
|
|
|
|
it('re-match: search albums and link one', async () => {
|
|
vi.mocked(api.searchAlbums).mockResolvedValue({
|
|
albums: [{ id: 77, subsonicId: 'a1', title: 'Motion (Remaster)', artist: 'The Cinematic Orchestra' }],
|
|
} as never)
|
|
vi.mocked(api.setMatch).mockResolvedValue({ ...item, ripStatus: 'ripped' } as never)
|
|
renderItem()
|
|
await userEvent.click(await screen.findByRole('button', { name: /re-match/i }))
|
|
await userEvent.click(screen.getByRole('button', { name: /^search$/i }))
|
|
const albumRadio = await screen.findByRole('radio', { name: /motion \(remaster\)/i })
|
|
await userEvent.click(albumRadio)
|
|
await userEvent.click(screen.getByRole('button', { name: /^link$/i }))
|
|
await waitFor(() => expect(api.setMatch).toHaveBeenCalledWith(1, 77))
|
|
})
|
|
|
|
it('re-match refreshes the link state', async () => {
|
|
vi.mocked(api.getItem)
|
|
.mockResolvedValueOnce({ ...rippedItem, matchedAlbum: null } as never)
|
|
.mockResolvedValue({ ...rippedItem } as never)
|
|
vi.mocked(api.searchAlbums).mockResolvedValue({
|
|
albums: [{ id: 77, subsonicId: 'a1', title: 'Motion (Remaster)', artist: 'The Cinematic Orchestra' }],
|
|
} as never)
|
|
vi.mocked(api.setMatch).mockResolvedValue({ ...item } as never)
|
|
renderItem()
|
|
await waitFor(() => expect(screen.getByRole('heading', { name: 'Motion' })).toBeTruthy())
|
|
expect(screen.queryByRole('link', { name: /listen in navidrome/i })).toBeNull()
|
|
|
|
await userEvent.click(screen.getByRole('button', { name: /re-match/i }))
|
|
await userEvent.click(screen.getByRole('button', { name: /^search$/i }))
|
|
const albumRadio = await screen.findByRole('radio', { name: /motion \(remaster\)/i })
|
|
await userEvent.click(albumRadio)
|
|
await userEvent.click(screen.getByRole('button', { name: /^link$/i }))
|
|
|
|
await waitFor(() => expect(screen.getByRole('link', { name: /listen in navidrome/i })).toBeTruthy())
|
|
})
|
|
|
|
it('unlink clears the match', async () => {
|
|
vi.mocked(api.setMatch).mockResolvedValue(item as never)
|
|
renderItem()
|
|
await userEvent.click(await screen.findByRole('button', { name: /re-match/i }))
|
|
await userEvent.click(screen.getByRole('button', { name: /^unlink$/i }))
|
|
await waitFor(() => expect(api.setMatch).toHaveBeenCalledWith(1, null))
|
|
})
|
|
|
|
it('remove deletes the item and navigates back to the library', async () => {
|
|
vi.mocked(api.deleteItem).mockResolvedValue({ ok: true } as never)
|
|
renderItem()
|
|
await userEvent.click(await screen.findByRole('button', { name: /^remove$/i }))
|
|
await userEvent.click(await screen.findByRole('button', { name: /^confirm remove$/i }))
|
|
await waitFor(() => expect(api.deleteItem).toHaveBeenCalledWith(1))
|
|
await waitFor(() => expect(screen.getByText('library')).toBeTruthy())
|
|
})
|
|
|
|
it('re-match clears the picked album when searching again', async () => {
|
|
vi.mocked(api.searchAlbums)
|
|
.mockResolvedValueOnce({
|
|
albums: [{ id: 77, subsonicId: 'a1', title: 'Motion (Remaster)', artist: 'The Cinematic Orchestra' }],
|
|
} as never)
|
|
.mockResolvedValueOnce({
|
|
albums: [{ id: 88, subsonicId: 'a2', title: 'Something Else', artist: 'Other Artist' }],
|
|
} as never)
|
|
renderItem()
|
|
await userEvent.click(await screen.findByRole('button', { name: /re-match/i }))
|
|
await userEvent.click(screen.getByRole('button', { name: /^search$/i }))
|
|
await userEvent.click(await screen.findByRole('radio', { name: /motion \(remaster\)/i }))
|
|
await userEvent.click(screen.getByRole('button', { name: /^search$/i }))
|
|
const linkBtn = await screen.findByRole('button', { name: /^link$/i })
|
|
expect(linkBtn).toHaveProperty('disabled', true)
|
|
})
|
|
|
|
it('shows Reset to auto for a manual not-ripped override', async () => {
|
|
vi.mocked(api.getItem).mockResolvedValue({ ...item, ripOverride: false, ripStatus: 'not_ripped' } as never)
|
|
renderItem()
|
|
await waitFor(() => expect(screen.getByText(/not ripped yet \(manually set\)/i)).toBeTruthy())
|
|
expect(screen.getByRole('button', { name: /reset to auto/i })).toBeTruthy()
|
|
expect(screen.getByRole('button', { name: /mark ripped/i })).toBeTruthy()
|
|
})
|
|
|
|
it('shows an error when a rip toggle fails', async () => {
|
|
vi.mocked(api.setRip).mockRejectedValue(new TypeError('fetch failed'))
|
|
renderItem()
|
|
await userEvent.click(await screen.findByRole('button', { name: /mark ripped/i }))
|
|
await waitFor(() => expect(screen.getByText(/didn't work/i)).toBeTruthy())
|
|
})
|
|
|
|
it('shows Listen in Navidrome link for a ripped item with a matched album', async () => {
|
|
vi.mocked(api.getItem).mockResolvedValue(rippedItem as never)
|
|
renderItem()
|
|
const link = await screen.findByRole('link', { name: /listen in navidrome/i })
|
|
expect(link.getAttribute('href')).toBe('http://navidrome.local/app/#/album/alb-1')
|
|
expect(link.getAttribute('target')).toBe('_blank')
|
|
})
|
|
|
|
it('hides the link when matchedAlbum is null even if ripped', async () => {
|
|
vi.mocked(api.getItem).mockResolvedValue({ ...rippedItem, matchedAlbum: null } as never)
|
|
renderItem()
|
|
await waitFor(() => expect(screen.getByRole('heading', { name: 'Motion' })).toBeTruthy())
|
|
expect(screen.queryByRole('link', { name: /listen in navidrome/i })).toBeNull()
|
|
})
|
|
|
|
it('shows last played under the rip banner', async () => {
|
|
vi.mocked(api.getItem).mockResolvedValue(rippedItem as never)
|
|
renderItem()
|
|
expect(await screen.findByText(/last played/i)).toBeTruthy()
|
|
})
|
|
|
|
it('lend and return flow', async () => {
|
|
vi.mocked(api.getItem)
|
|
.mockResolvedValueOnce(rippedItem as never)
|
|
.mockResolvedValueOnce({ ...rippedItem, loan: { id: 9, borrower: 'Bob', lentAt: '2026-09-03' } } as never)
|
|
vi.mocked(api.lendItem).mockResolvedValue({ id: 9, itemId: 1, borrower: 'Bob', lentAt: '2026-09-03', returnedAt: null } as never)
|
|
renderItem()
|
|
await userEvent.type(await screen.findByLabelText(/borrower/i), 'Bob')
|
|
await userEvent.click(screen.getByRole('button', { name: /^lend$/i }))
|
|
await waitFor(() => expect(api.lendItem).toHaveBeenCalledWith(1, 'Bob'))
|
|
|
|
vi.mocked(api.returnLoan).mockResolvedValue({ ok: true } as never)
|
|
await waitFor(() => expect(screen.getByText(/out to bob/i)).toBeTruthy())
|
|
await userEvent.click(screen.getByRole('button', { name: /mark returned/i }))
|
|
await waitFor(() => expect(api.returnLoan).toHaveBeenCalledWith(9))
|
|
})
|
|
|
|
it('lend failure surfaces the inline message', async () => {
|
|
vi.mocked(api.lendItem).mockRejectedValue(new ApiError(409, 'already_on_loan'))
|
|
renderItem()
|
|
await userEvent.type(await screen.findByLabelText(/borrower/i), 'Bob')
|
|
await userEvent.click(screen.getByRole('button', { name: /^lend$/i }))
|
|
await waitFor(() => expect(screen.getByText(/already out to someone/i)).toBeTruthy())
|
|
})
|
|
})
|