9acad5461e
The DRY pass audit (#375) found two inline mock patterns repeated across the vitest suite: a default empty-playlists mock for $lib/api/playlists (4 exact copies in menu/card tests) and an api-client spy mock for $lib/api/client (9 callers split between get-only and full-RESTy shapes — unified into one helper that always returns all four verb spies). Mirrors the existing test-utils/mocks/likes.ts and test-utils/mocks/quarantine.ts convention. Tests with intentionally divergent shapes (AddToPlaylistMenu's richer createPlaylist payload, PlaylistCard's getPlaylist, route-specific mocks, events.svelte's specific resolved value) stay inline. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
274 lines
10 KiB
TypeScript
274 lines
10 KiB
TypeScript
import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
|
|
import { render, screen, fireEvent, waitFor } from '@testing-library/svelte';
|
|
import { mockQuery } from '../../test-utils/query';
|
|
import { apiClientMock } from '../../test-utils/mocks/client';
|
|
import type { LidarrSearchResult } from '$lib/api/types';
|
|
|
|
// Lidarr search query factory and createRequest are mocked at the module
|
|
// level so each test can shape what the page sees without standing up a
|
|
// real QueryClient + network.
|
|
vi.mock('$lib/api/lidarr', () => ({
|
|
createLidarrSearchQuery: vi.fn()
|
|
}));
|
|
|
|
vi.mock('$lib/api/suggestions', () => ({
|
|
createSuggestionsQuery: vi.fn()
|
|
}));
|
|
|
|
vi.mock('$lib/api/requests', () => ({
|
|
createRequest: vi.fn().mockResolvedValue({ id: 'r1' })
|
|
}));
|
|
|
|
vi.mock('$lib/api/client', () => apiClientMock());
|
|
|
|
import DiscoverPage from './+page.svelte';
|
|
import { createLidarrSearchQuery } from '$lib/api/lidarr';
|
|
import { createSuggestionsQuery } from '$lib/api/suggestions';
|
|
import { createRequest } from '$lib/api/requests';
|
|
|
|
const mockedCreateQuery = createLidarrSearchQuery as ReturnType<typeof vi.fn>;
|
|
const mockedCreateSuggestionsQuery = createSuggestionsQuery as ReturnType<typeof vi.fn>;
|
|
const mockedCreateRequest = createRequest as ReturnType<typeof vi.fn>;
|
|
|
|
function result(over: Partial<LidarrSearchResult> = {}): LidarrSearchResult {
|
|
return {
|
|
mbid: 'mbid-1',
|
|
name: 'Boards of Canada',
|
|
secondary_text: 'Electronic',
|
|
image_url: '',
|
|
artist_mbid: 'art-1',
|
|
album_mbid: '',
|
|
in_library: false,
|
|
requested: false,
|
|
...over
|
|
};
|
|
}
|
|
|
|
beforeEach(() => {
|
|
// Default: empty results, non-pending. Tests override per-case.
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [] }));
|
|
// Default: empty suggestion feed so its empty-state copy renders without
|
|
// interfering with search-mode tests.
|
|
mockedCreateSuggestionsQuery.mockReturnValue(mockQuery({ data: [] }));
|
|
});
|
|
|
|
afterEach(() => {
|
|
vi.clearAllMocks();
|
|
});
|
|
|
|
// FIXME(M7 #374): suite errors at module-load with
|
|
// `TypeError: notifiable_store is not a function` from SvelteKit's
|
|
// internal client.js. Surfaces only on the new dev-push CI; PR-to-main
|
|
// runs were green. Probably a vitest module-resolution interaction
|
|
// with a recent SvelteKit; needs targeted triage. Skipped to unblock
|
|
// CI for #372 — the page itself isn't broken, the test harness is.
|
|
describe.skip('Discover page', () => {
|
|
test('initial state (no query) shows the suggestion feed', () => {
|
|
render(DiscoverPage);
|
|
expect(screen.getByText(/suggested for you/i)).toBeInTheDocument();
|
|
});
|
|
|
|
test('empty input shows the suggestion feed', () => {
|
|
render(DiscoverPage);
|
|
expect(screen.getByText(/suggested for you/i)).toBeInTheDocument();
|
|
// Kind tabs should NOT be visible when input is empty.
|
|
expect(
|
|
screen.queryByRole('button', { name: 'Artists' })
|
|
).not.toBeInTheDocument();
|
|
});
|
|
|
|
test('typing replaces feed with search', async () => {
|
|
vi.useFakeTimers();
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'miles' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
expect(screen.queryByText(/suggested for you/i)).not.toBeInTheDocument();
|
|
expect(screen.getByText(/add music to the library/i)).toBeInTheDocument();
|
|
// Kind tabs visible when searching.
|
|
expect(screen.getByRole('button', { name: 'Artists' })).toBeInTheDocument();
|
|
vi.useRealTimers();
|
|
});
|
|
|
|
test('debounced input fires query factory with typed value after 250ms', async () => {
|
|
vi.useFakeTimers();
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'boards' } });
|
|
// Before the timer elapses, the factory was called only with the
|
|
// initial empty string — never with 'boards'.
|
|
expect(mockedCreateQuery).not.toHaveBeenCalledWith('boards', 'artist');
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
expect(mockedCreateQuery).toHaveBeenLastCalledWith('boards', 'artist');
|
|
vi.useRealTimers();
|
|
});
|
|
|
|
test('switching tabs refetches with the new kind', async () => {
|
|
vi.useFakeTimers();
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'boards' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
// Switch to Albums.
|
|
await fireEvent.click(screen.getByRole('button', { name: 'Albums' }));
|
|
expect(mockedCreateQuery).toHaveBeenLastCalledWith('boards', 'album');
|
|
// Then to Tracks.
|
|
await fireEvent.click(screen.getByRole('button', { name: 'Tracks' }));
|
|
expect(mockedCreateQuery).toHaveBeenLastCalledWith('boards', 'track');
|
|
vi.useRealTimers();
|
|
});
|
|
|
|
test('empty results state renders the voice-rule copy', async () => {
|
|
vi.useFakeTimers();
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [] }));
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'zzz' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
await waitFor(() =>
|
|
expect(
|
|
screen.getByText(/nothing to add for that search yet\./i)
|
|
).toBeInTheDocument()
|
|
);
|
|
vi.useRealTimers();
|
|
});
|
|
|
|
test('artist-kind Request click calls createRequest immediately (no modal)', async () => {
|
|
vi.useFakeTimers();
|
|
const r = result({
|
|
mbid: 'art-mbid',
|
|
artist_mbid: 'art-mbid',
|
|
name: 'Boards of Canada'
|
|
});
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [r] }));
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'boards' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
vi.useRealTimers();
|
|
|
|
const requestBtn = await screen.findByRole('button', {
|
|
name: /request boards of canada/i
|
|
});
|
|
await fireEvent.click(requestBtn);
|
|
expect(mockedCreateRequest).toHaveBeenCalledTimes(1);
|
|
expect(mockedCreateRequest).toHaveBeenCalledWith(
|
|
expect.objectContaining({ kind: 'artist' })
|
|
);
|
|
// Modal must not be present for non-track kinds.
|
|
expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
|
|
});
|
|
|
|
test('requestable card flips to "Requested" after a successful request', async () => {
|
|
vi.useFakeTimers();
|
|
const r = result({
|
|
mbid: 'art-mbid',
|
|
artist_mbid: 'art-mbid',
|
|
name: 'Boards of Canada'
|
|
});
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [r] }));
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'boards' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
vi.useRealTimers();
|
|
|
|
const requestBtn = await screen.findByRole('button', {
|
|
name: /request boards of canada/i
|
|
});
|
|
await fireEvent.click(requestBtn);
|
|
await waitFor(() => {
|
|
const flipped = screen.getByRole('button', { name: /already requested/i });
|
|
expect(flipped).toBeDisabled();
|
|
});
|
|
});
|
|
|
|
test('track-kind Request click opens confirm modal; Confirm calls createRequest', async () => {
|
|
vi.useFakeTimers();
|
|
const r = result({
|
|
mbid: 'tr-mbid',
|
|
artist_mbid: 'art-mbid',
|
|
album_mbid: 'al-mbid',
|
|
name: 'Roygbiv',
|
|
secondary_text: 'Music Has The Right To Children · Boards of Canada'
|
|
});
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [r] }));
|
|
render(DiscoverPage);
|
|
// Type first so the kind tabs become visible (empty-input mode shows the
|
|
// suggestion feed and hides tabs).
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'roy' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
// Switch to track kind.
|
|
await fireEvent.click(screen.getByRole('button', { name: 'Tracks' }));
|
|
vi.useRealTimers();
|
|
|
|
const requestBtn = await screen.findByRole('button', {
|
|
name: /request roygbiv/i
|
|
});
|
|
await fireEvent.click(requestBtn);
|
|
// Modal opens with the explanation copy.
|
|
const dialog = await screen.findByRole('dialog');
|
|
expect(dialog).toBeInTheDocument();
|
|
expect(dialog.textContent).toMatch(/continue/i);
|
|
// Confirm fires createRequest with kind=track.
|
|
await fireEvent.click(screen.getByRole('button', { name: /add the album/i }));
|
|
expect(mockedCreateRequest).toHaveBeenCalledTimes(1);
|
|
expect(mockedCreateRequest).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
kind: 'track',
|
|
lidarr_track_mbid: 'tr-mbid',
|
|
lidarr_album_mbid: 'al-mbid',
|
|
lidarr_artist_mbid: 'art-mbid'
|
|
})
|
|
);
|
|
});
|
|
|
|
test('track-kind modal Cancel does not call createRequest', async () => {
|
|
vi.useFakeTimers();
|
|
const r = result({
|
|
mbid: 'tr-mbid',
|
|
artist_mbid: 'art-mbid',
|
|
album_mbid: 'al-mbid',
|
|
name: 'Roygbiv',
|
|
secondary_text: 'Music Has The Right To Children · Boards of Canada'
|
|
});
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [r] }));
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'roy' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
await fireEvent.click(screen.getByRole('button', { name: 'Tracks' }));
|
|
vi.useRealTimers();
|
|
|
|
const requestBtn = await screen.findByRole('button', {
|
|
name: /request roygbiv/i
|
|
});
|
|
await fireEvent.click(requestBtn);
|
|
await screen.findByRole('dialog');
|
|
await fireEvent.click(screen.getByRole('button', { name: /^cancel$/i }));
|
|
expect(mockedCreateRequest).not.toHaveBeenCalled();
|
|
expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
|
|
});
|
|
|
|
test('in_library result renders kept state regardless of requested', async () => {
|
|
vi.useFakeTimers();
|
|
const r = result({
|
|
mbid: 'kept-1',
|
|
name: 'Kind of Blue',
|
|
in_library: true,
|
|
requested: true
|
|
});
|
|
mockedCreateQuery.mockReturnValue(mockQuery<LidarrSearchResult[]>({ data: [r] }));
|
|
render(DiscoverPage);
|
|
const input = screen.getByLabelText(/search lidarr/i);
|
|
await fireEvent.input(input, { target: { value: 'kind' } });
|
|
await vi.advanceTimersByTimeAsync(250);
|
|
vi.useRealTimers();
|
|
|
|
await waitFor(() => {
|
|
expect(screen.getByRole('button', { name: /in library/i })).toBeDisabled();
|
|
});
|
|
});
|
|
});
|