feat(test): add ScreenHeader component tests

This commit is contained in:
Phan An 2022-05-12 11:03:40 +02:00
parent 69ce0f5f9d
commit 4e20d7bf21
No known key found for this signature in database
GPG key ID: A81E4477F0BB6FDC
4 changed files with 30 additions and 3 deletions

View file

@ -18,8 +18,7 @@ new class extends ComponentTestCase {
}
protected test () {
// skipping due to some weird EADDRINUSE error
it.skip('fetches and displays the album thumbnail', async () => {
it('fetches and displays the album thumbnail', async () => {
const mock = this.mock(albumStore, 'getThumbnail')
mock.mockResolvedValue('https://localhost/thumb.jpg')

View file

@ -0,0 +1,17 @@
import { expect, it } from 'vitest'
import ComponentTestCase from '@/__tests__/ComponentTestCase'
import ScreenHeader from './ScreenHeader.vue'
new class extends ComponentTestCase {
protected test () {
it('renders', () => {
expect(this.render(ScreenHeader, {
slots: {
default: 'This Header',
meta: '<p>Some meta</p>',
controls: '<nav>Some controls</nav>'
}
}).html()).toMatchSnapshot()
})
}
}

View file

@ -2,4 +2,4 @@
exports[`displays nothing if fetching fails 1`] = `"<div style=\\"background-image: none;\\" data-testid=\\"album-art-overlay\\" data-v-75d06710=\\"\\"></div>"`;
exports[`fetches and displays the album thumbnail 1`] = `"<div style=\\"background-image: none;\\" data-testid=\\"album-art-overlay\\" data-v-75d06710=\\"\\"></div>"`;
exports[`fetches and displays the album thumbnail 1`] = `"<div style=\\"background-image: url(https://localhost/thumb.jpg);\\" data-testid=\\"album-art-overlay\\" data-v-75d06710=\\"\\"></div>"`;

View file

@ -0,0 +1,11 @@
// Vitest Snapshot v1
exports[`renders 1`] = `
"<header class=\\"screen-header\\" data-v-661f8f0d=\\"\\">
<div class=\\"thumbnail-wrapper\\" data-v-661f8f0d=\\"\\"></div>
<div class=\\"heading-wrapper\\" data-v-661f8f0d=\\"\\">
<h1 data-v-661f8f0d=\\"\\">This Header</h1><span class=\\"meta text-secondary\\" data-v-661f8f0d=\\"\\"><p>Some meta</p></span>
</div>
<nav>Some controls</nav>
</header>"
`;