minstrel/web/src/routes/search/search.test.ts

import { afterEach, describe, expect, test, vi } from 'vitest';
import { render, screen } from '@testing-library/svelte';
import { mockQuery } from '../../test-utils/query';
import { emptyLikesMock } from '../../test-utils/mocks/likes';
import { apiClientMock } from '../../test-utils/mocks/client';
import { pageUrlModule } from '$test-utils/mocks/appState';
import type { ArtistRef, AlbumRef, SearchResponse } from '$lib/api/types';
import { makeTrack } from '$test-utils/fixtures/track';

const state = vi.hoisted(() => ({
  pageUrl: new URL('http://localhost/search')
}));

vi.mock('$app/state', () => pageUrlModule(state));

vi.mock('$lib/api/queries', () => ({
  createSearchQuery: vi.fn()
}));

vi.mock('$lib/player/store.svelte', () => ({
  playQueue: vi.fn(),
  playRadio: vi.fn(),
  enqueueTrack: vi.fn(),
  enqueueTracks: vi.fn(),
  player: { current: undefined }
}));

vi.mock('$lib/api/client', () => apiClientMock());

vi.mock('$lib/api/likes', () => emptyLikesMock());

import SearchPage from './+page.svelte';
import { createSearchQuery } from '$lib/api/queries';

function emptyResp(): SearchResponse {
  return {
    artists: { items: [], total: 0, limit: 10, offset: 0 },
    albums:  { items: [], total: 0, limit: 10, offset: 0 },
    tracks:  { items: [], total: 0, limit: 10, offset: 0 }
  };
}

const artist: ArtistRef = { id: 'a1', name: 'Miles Davis', sort_name: 'Miles Davis', album_count: 12, cover_url: '' };
const album: AlbumRef = {
  id: 'al1', title: 'Kind of Blue', sort_title: 'Kind of Blue', artist_id: 'a1', artist_name: 'Miles Davis',
  year: 1959, track_count: 5, duration_sec: 2630, cover_url: '/api/albums/al1/cover', cover_art_source: null
};
const track = makeTrack({
  title: 'So What',
  album_id: 'al1', album_title: 'Kind of Blue',
  artist_id: 'a1', artist_name: 'Miles Davis',
  duration_sec: 545
});

afterEach(() => {
  vi.clearAllMocks();
  state.pageUrl = new URL('http://localhost/search');
});

describe('search page', () => {
  test('empty ?q= shows the "Start typing" prompt and fires no query', () => {
    state.pageUrl = new URL('http://localhost/search');
    render(SearchPage);
    expect(screen.getByText(/start typing/i)).toBeInTheDocument();
    expect(createSearchQuery).not.toHaveBeenCalled();
  });

  test('all three sections render when all three facets have items', () => {
    state.pageUrl = new URL('http://localhost/search?q=miles');
    const resp: SearchResponse = {
      ...emptyResp(),
      artists: { items: [artist], total: 1, limit: 10, offset: 0 },
      albums:  { items: [album],  total: 1, limit: 10, offset: 0 },
      tracks:  { items: [track],  total: 1, limit: 10, offset: 0 }
    };
    (createSearchQuery as ReturnType<typeof vi.fn>).mockReturnValue(mockQuery({ data: resp }));
    render(SearchPage);
    expect(screen.getByRole('heading', { name: /artists/i })).toBeInTheDocument();
    expect(screen.getByRole('heading', { name: /albums/i })).toBeInTheDocument();
    expect(screen.getByRole('heading', { name: /tracks/i })).toBeInTheDocument();
  });

  test('empty facets are hidden', () => {
    state.pageUrl = new URL('http://localhost/search?q=miles');
    const resp: SearchResponse = {
      ...emptyResp(),
      tracks: { items: [track], total: 1, limit: 10, offset: 0 }
    };
    (createSearchQuery as ReturnType<typeof vi.fn>).mockReturnValue(mockQuery({ data: resp }));
    render(SearchPage);
    expect(screen.queryByRole('heading', { name: /artists/i })).not.toBeInTheDocument();
    expect(screen.queryByRole('heading', { name: /albums/i })).not.toBeInTheDocument();
    expect(screen.getByRole('heading', { name: /tracks/i })).toBeInTheDocument();
  });

  test('"See all N →" link renders when total > items.length', () => {
    state.pageUrl = new URL('http://localhost/search?q=miles');
    const resp: SearchResponse = {
      ...emptyResp(),
      artists: { items: [artist], total: 47, limit: 10, offset: 0 }
    };
    (createSearchQuery as ReturnType<typeof vi.fn>).mockReturnValue(mockQuery({ data: resp }));
    render(SearchPage);
    const link = screen.getByRole('link', { name: /see all 47/i });
    expect(link).toHaveAttribute('href', '/search/artists?q=miles');
  });

  test('"See all" link omitted when total === items.length', () => {
    state.pageUrl = new URL('http://localhost/search?q=miles');
    const resp: SearchResponse = {
      ...emptyResp(),
      tracks: { items: [track], total: 1, limit: 10, offset: 0 }
    };
    (createSearchQuery as ReturnType<typeof vi.fn>).mockReturnValue(mockQuery({ data: resp }));
    render(SearchPage);
    expect(screen.queryByRole('link', { name: /see all/i })).not.toBeInTheDocument();
  });

  test('all three facets empty renders "No matches"', () => {
    state.pageUrl = new URL('http://localhost/search?q=zzz');
    (createSearchQuery as ReturnType<typeof vi.fn>).mockReturnValue(
      mockQuery({ data: emptyResp() })
    );
    render(SearchPage);
    expect(screen.getByText(/no matches for/i)).toBeInTheDocument();
    expect(screen.getByText(/zzz/)).toBeInTheDocument();
  });

  test('error state renders ApiErrorBanner', () => {
    state.pageUrl = new URL('http://localhost/search?q=miles');
    (createSearchQuery as ReturnType<typeof vi.fn>).mockReturnValue(
      mockQuery({ isError: true, error: { code: 'server_error', message: 'boom' } })
    );
    render(SearchPage);
    expect(screen.getByRole('alert')).toBeInTheDocument();
  });
});