Files
minstrel/web/src/lib/components/ArtistMenu.test.ts
T

86 lines
3.8 KiB
TypeScript

import { afterEach, describe, expect, test, vi } from 'vitest';
import { render, screen, fireEvent, waitFor } from '@testing-library/svelte';
import { readable } from 'svelte/store';
import type { TrackRef } from '$lib/api/types';
vi.mock('$app/navigation', () => ({ goto: vi.fn() }));
vi.mock('$lib/api/likes', () => ({
createLikedIdsQuery: () =>
readable({ data: { track_ids: [], album_ids: [], artist_ids: [] }, isPending: false, isError: false }),
likeEntity: vi.fn().mockResolvedValue(undefined),
unlikeEntity: vi.fn().mockResolvedValue(undefined)
}));
vi.mock('$lib/api/artists', () => ({
listArtistTracks: vi.fn().mockResolvedValue([])
}));
vi.mock('$lib/api/playlists', () => ({
createPlaylistsQuery: () =>
readable({ data: { owned: [], public: [] }, isPending: false, isError: false }),
appendTracks: vi.fn().mockResolvedValue({ id: 'p1', tracks: [] }),
createPlaylist: vi.fn().mockResolvedValue({ id: 'p1', name: 'New' })
}));
vi.mock('$lib/player/store.svelte', () => ({
enqueueTracks: vi.fn()
}));
import ArtistMenu from './ArtistMenu.svelte';
import { enqueueTracks } from '$lib/player/store.svelte';
import { listArtistTracks } from '$lib/api/artists';
import { likeEntity, unlikeEntity } from '$lib/api/likes';
const TRACKS: TrackRef[] = [
{ id: 't1', title: 'A', album_id: 'al1', album_title: 'X', artist_id: 'a1', artist_name: 'Test', duration_sec: 100, stream_url: '/s/t1' },
{ id: 't2', title: 'B', album_id: 'al1', album_title: 'X', artist_id: 'a1', artist_name: 'Test', duration_sec: 100, stream_url: '/s/t2' }
];
afterEach(() => {
vi.clearAllMocks();
});
describe('ArtistMenu', () => {
test('kebab opens menu with action items', async () => {
render(ArtistMenu, { props: { artistId: 'a1', artistName: 'Test', tracks: TRACKS } });
const kebab = screen.getByRole('button', { name: /artist actions for test/i });
await fireEvent.click(kebab);
expect(await screen.findByText(/Like artist/i)).toBeInTheDocument();
expect(screen.getByText(/Add all to queue/i)).toBeInTheDocument();
expect(screen.getByText(/Add all to playlist/i)).toBeInTheDocument();
});
test('Add all to queue uses cached tracks when provided', async () => {
render(ArtistMenu, { props: { artistId: 'a1', artistName: 'Test', tracks: TRACKS } });
await fireEvent.click(screen.getByRole('button', { name: /artist actions for test/i }));
await fireEvent.click(screen.getByText(/Add all to queue/i));
expect(enqueueTracks).toHaveBeenCalledWith(TRACKS);
expect(listArtistTracks).not.toHaveBeenCalled();
});
test('Add all to queue lazily fetches when no cached tracks', async () => {
(listArtistTracks as unknown as ReturnType<typeof vi.fn>).mockResolvedValueOnce(TRACKS);
render(ArtistMenu, { props: { artistId: 'a1', artistName: 'Test' } });
await fireEvent.click(screen.getByRole('button', { name: /artist actions for test/i }));
await fireEvent.click(screen.getByText(/Add all to queue/i));
await waitFor(() => expect(enqueueTracks).toHaveBeenCalledWith(TRACKS));
expect(listArtistTracks).toHaveBeenCalledWith('a1');
});
test('Like item calls likeEntity', async () => {
render(ArtistMenu, { props: { artistId: 'a1', artistName: 'Test', tracks: TRACKS } });
await fireEvent.click(screen.getByRole('button', { name: /artist actions for test/i }));
await fireEvent.click(screen.getByText(/Like artist/i));
expect(likeEntity).toHaveBeenCalled();
});
test('Escape key closes the menu', async () => {
render(ArtistMenu, { props: { artistId: 'a1', artistName: 'Test', tracks: TRACKS } });
await fireEvent.click(screen.getByRole('button', { name: /artist actions for test/i }));
expect(screen.getByRole('menu')).toBeInTheDocument();
await fireEvent.keyDown(window, { key: 'Escape' });
expect(screen.queryByRole('menu')).not.toBeInTheDocument();
});
});