koel/resources/assets/js/components/screens/QueueScreen.spec.ts

61 lines
1.9 KiB
TypeScript
Raw Normal View History

2022-07-13 09:30:33 +00:00
import { expect, it } from 'vitest'
import factory from '@/__tests__/factory'
import UnitTestCase from '@/__tests__/UnitTestCase'
import { commonStore, queueStore } from '@/stores'
import { screen, waitFor } from '@testing-library/vue'
2022-07-13 09:30:33 +00:00
import { playbackService } from '@/services'
import Component from './QueueScreen.vue'
2022-07-13 09:30:33 +00:00
new class extends UnitTestCase {
protected test () {
it('renders the queue', () => {
this.renderComponent(factory('song', 3))
2022-07-13 09:30:33 +00:00
expect(screen.queryByTestId('song-list')).toBeTruthy()
expect(screen.queryByTestId('screen-empty-state')).toBeNull()
2022-07-13 09:30:33 +00:00
})
it('renders an empty state if no songs queued', () => {
this.renderComponent([])
2022-07-13 09:30:33 +00:00
expect(screen.queryByTestId('song-list')).toBeNull()
expect(screen.queryByTestId('screen-empty-state')).toBeTruthy()
2022-07-13 09:30:33 +00:00
})
it('has an option to plays some random songs if the library is not empty', async () => {
commonStore.state.song_count = 300
const fetchRandomMock = this.mock(queueStore, 'fetchRandom')
const playMock = this.mock(playbackService, 'playFirstInQueue')
this.renderComponent([])
await this.user.click(screen.getByText('playing some random songs'))
2022-07-13 09:30:33 +00:00
await waitFor(() => {
expect(fetchRandomMock).toHaveBeenCalled()
expect(playMock).toHaveBeenCalled()
})
})
it('shuffles all', async () => {
const songs = factory('song', 3)
this.renderComponent(songs)
2022-07-13 09:30:33 +00:00
const playMock = this.mock(playbackService, 'queueAndPlay')
await this.user.click(screen.getByTitle('Shuffle all. Press Alt/⌥ to change mode.'))
2022-07-13 09:30:33 +00:00
await waitFor(() => expect(playMock).toHaveBeenCalledWith(songs, true))
})
}
2024-04-23 21:01:27 +00:00
private renderComponent (playables: Playable[]) {
queueStore.state.playables = playables
2024-04-23 21:01:27 +00:00
this.render(Component, {
2024-04-23 21:01:27 +00:00
global: {
stubs: {
SongList: this.stub('song-list'),
},
},
2024-04-23 21:01:27 +00:00
})
}
2022-07-13 09:30:33 +00:00
}