mirror of
https://github.com/IT4Change/boilerplate-frontend.git
synced 2025-12-13 07:35:53 +00:00
snapshot tests
This commit is contained in:
parent
2b0c8603a0
commit
c92f7dbe35
GPG Key ID:
DA6B843E748679C9
16
src/components/PageShell.test.ts
Normal file
16
src/components/PageShell.test.ts
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { describe, it, expect } from 'vitest'
|
||||||
|
|
||||||
|
import PageShell from './PageShell.vue'
|
||||||
|
|
||||||
|
describe('PageShell', () => {
|
||||||
|
const wrapper = mount(PageShell, {
|
||||||
|
slots: {
|
||||||
|
default: 'Page Content',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
@ -1,20 +0,0 @@
|
|||||||
import { mount } from '@vue/test-utils'
|
|
||||||
import { describe, it, expect } from 'vitest'
|
|
||||||
|
|
||||||
import TopMenu from '#components/menu/TopMenu.vue'
|
|
||||||
|
|
||||||
import PageShell from './PageShell.vue'
|
|
||||||
|
|
||||||
describe('PageShell', () => {
|
|
||||||
const wrapper = mount(PageShell, {
|
|
||||||
slots: {
|
|
||||||
default: 'Page Content',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
it('renders page content', () => {
|
|
||||||
expect(wrapper.find('.v-application').exists()).toBeTruthy()
|
|
||||||
expect(wrapper.find('.v-application').findComponent(TopMenu)).toBeTruthy()
|
|
||||||
expect(wrapper.html()).toContain('Page Content')
|
|
||||||
})
|
|
||||||
})
|
|
||||||
@ -20,7 +20,7 @@ describe('VikeBtn', () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
it('renders', () => {
|
it('renders', () => {
|
||||||
expect(wrapper.find('.v-btn').exists()).toBeTruthy()
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
|
||||||
it('icon is hidden', () => {
|
it('icon is hidden', () => {
|
||||||
|
|||||||
272
src/components/__snapshots__/PageShell.test.ts.snap
Normal file
272
src/components/__snapshots__/PageShell.test.ts.snap
Normal file
@ -0,0 +1,272 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`PageShell > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-application__wrap"
|
||||||
|
>
|
||||||
|
|
||||||
|
<header
|
||||||
|
class="v-toolbar v-toolbar--flat v-toolbar--density-default v-theme--light v-locale--is-ltr v-app-bar"
|
||||||
|
style="top: 0px; z-index: 1004; transform: translateY(0%); position: fixed; left: 0px; width: calc(100% - 0px - 0px);"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-toolbar__content"
|
||||||
|
style="height: 64px;"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-row"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-avatar v-theme--light v-avatar--density-default v-avatar--variant-flat ma-2 pa-1"
|
||||||
|
style="background-color: #333; color: #fff; caret-color: #fff; width: 48px; height: 48px;"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label=""
|
||||||
|
class="v-responsive v-img v-img--booting"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-responsive__sizer"
|
||||||
|
/>
|
||||||
|
|
||||||
|
|
||||||
|
<transition-stub
|
||||||
|
appear="true"
|
||||||
|
css="true"
|
||||||
|
name="fade-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
alt=""
|
||||||
|
class="v-img__img v-img__img--cover"
|
||||||
|
src="/src/assets/it4c-logo2-clean-bg_alpha-128x128.png"
|
||||||
|
style="display: none;"
|
||||||
|
/>
|
||||||
|
</transition-stub>
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="fade-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-avatar__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="v-col d-flex align-center justify-center grow"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$t('menu.home')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/app"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$t('menu.app')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/about"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$t('menu.about')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-input v-input--horizontal v-input--center-affix v-input--density-default v-locale--is-ltr v-input--dirty v-switch d-flex justify-end mr-5"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-input__control"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-selection-control v-selection-control--dirty v-selection-control--density-default"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-selection-control__wrapper text-success"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-switch__track bg-success"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-selection-control__input"
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
<input
|
||||||
|
aria-describedby="switch-4-messages"
|
||||||
|
aria-disabled="false"
|
||||||
|
id="switch-4"
|
||||||
|
type="checkbox"
|
||||||
|
value="true"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="v-switch__thumb bg-success"
|
||||||
|
>
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="scale-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<label
|
||||||
|
class="v-label v-label--clickable"
|
||||||
|
for="switch-4"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
$t('language.german')
|
||||||
|
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-input__details"
|
||||||
|
>
|
||||||
|
<transition-group-stub
|
||||||
|
appear="false"
|
||||||
|
aria-live="polite"
|
||||||
|
class="v-messages"
|
||||||
|
css="true"
|
||||||
|
id="switch-4-messages"
|
||||||
|
name="slide-y-transition"
|
||||||
|
persisted="false"
|
||||||
|
role="alert"
|
||||||
|
tag="div"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-group-stub>
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="expand-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
|
||||||
|
</header>
|
||||||
|
|
||||||
|
Page Content
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
31
src/components/__snapshots__/VikeBtn.test.ts.snap
Normal file
31
src/components/__snapshots__/VikeBtn.test.ts.snap
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`VikeBtn > renders 1`] = `
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/some-path"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
`;
|
||||||
19
src/components/menu/LogoAvatar.test.ts
Normal file
19
src/components/menu/LogoAvatar.test.ts
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { beforeEach, expect, describe, it } from 'vitest'
|
||||||
|
|
||||||
|
import LogoAvatar from './LogoAvatar.vue'
|
||||||
|
|
||||||
|
describe('LogoAvatar', () => {
|
||||||
|
const Wrapper = () => {
|
||||||
|
return mount(LogoAvatar)
|
||||||
|
}
|
||||||
|
let wrapper: ReturnType<typeof Wrapper>
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
wrapper = Wrapper()
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
18
src/components/menu/TopMenu.test.ts
Normal file
18
src/components/menu/TopMenu.test.ts
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { describe, it, expect } from 'vitest'
|
||||||
|
import { h } from 'vue'
|
||||||
|
import { VApp } from 'vuetify/components'
|
||||||
|
|
||||||
|
import TopMenu from './TopMenu.vue'
|
||||||
|
|
||||||
|
describe('FooterMenu', () => {
|
||||||
|
const wrapper = mount(VApp, {
|
||||||
|
slots: {
|
||||||
|
default: h(TopMenu),
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
@ -1,34 +0,0 @@
|
|||||||
import { mount } from '@vue/test-utils'
|
|
||||||
import { describe, it, expect } from 'vitest'
|
|
||||||
import { h } from 'vue'
|
|
||||||
import { VApp } from 'vuetify/components'
|
|
||||||
|
|
||||||
import VikeBtn from '#components/VikeBtn.vue'
|
|
||||||
|
|
||||||
import LogoAvatar from './LogoAvatar.vue'
|
|
||||||
import TopMenu from './TopMenu.vue'
|
|
||||||
|
|
||||||
describe('FooterMenu', () => {
|
|
||||||
const wrapper = mount(VApp, {
|
|
||||||
slots: {
|
|
||||||
default: h(TopMenu),
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
it('renders three columns', () => {
|
|
||||||
expect(wrapper.find('.v-row').exists()).toBeTruthy()
|
|
||||||
expect(wrapper.findAll('.v-row > div')).toHaveLength(3)
|
|
||||||
})
|
|
||||||
|
|
||||||
it('first column contains logo', () => {
|
|
||||||
expect(wrapper.findAll('.v-row > div')[0].findComponent(LogoAvatar)).toBeTruthy()
|
|
||||||
})
|
|
||||||
|
|
||||||
it('second column contains 3 children -> AnchorLink', () => {
|
|
||||||
expect(wrapper.findAll('.v-row > div')[1].findAllComponents(VikeBtn)).toHaveLength(3)
|
|
||||||
})
|
|
||||||
|
|
||||||
it('third column is placeholdre', () => {
|
|
||||||
expect(wrapper.findAll('.v-row > div')[2].findAll('div')).toHaveLength(0)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
52
src/components/menu/__snapshots__/LogoAvatar.test.ts.snap
Normal file
52
src/components/menu/__snapshots__/LogoAvatar.test.ts.snap
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`LogoAvatar > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-avatar v-theme--light v-avatar--density-default v-avatar--variant-flat ma-2 pa-1"
|
||||||
|
style="background-color: #333; color: #fff; caret-color: #fff; width: 48px; height: 48px;"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label=""
|
||||||
|
class="v-responsive v-img v-img--booting"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-responsive__sizer"
|
||||||
|
/>
|
||||||
|
|
||||||
|
|
||||||
|
<transition-stub
|
||||||
|
appear="true"
|
||||||
|
css="true"
|
||||||
|
name="fade-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
alt=""
|
||||||
|
class="v-img__img v-img__img--cover"
|
||||||
|
src="/src/assets/it4c-logo2-clean-bg_alpha-128x128.png"
|
||||||
|
style="display: none;"
|
||||||
|
/>
|
||||||
|
</transition-stub>
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="fade-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-avatar__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
269
src/components/menu/__snapshots__/TopMenu.test.ts.snap
Normal file
269
src/components/menu/__snapshots__/TopMenu.test.ts.snap
Normal file
@ -0,0 +1,269 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`FooterMenu > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-application__wrap"
|
||||||
|
>
|
||||||
|
|
||||||
|
<header
|
||||||
|
class="v-toolbar v-toolbar--flat v-toolbar--density-default v-theme--light v-locale--is-ltr v-app-bar"
|
||||||
|
style="top: 0px; z-index: 1004; transform: translateY(0%); position: fixed; left: 0px; width: calc(100% - 0px - 0px);"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-toolbar__content"
|
||||||
|
style="height: 64px;"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-row"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-avatar v-theme--light v-avatar--density-default v-avatar--variant-flat ma-2 pa-1"
|
||||||
|
style="background-color: #333; color: #fff; caret-color: #fff; width: 48px; height: 48px;"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
aria-label=""
|
||||||
|
class="v-responsive v-img v-img--booting"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-responsive__sizer"
|
||||||
|
/>
|
||||||
|
|
||||||
|
|
||||||
|
<transition-stub
|
||||||
|
appear="true"
|
||||||
|
css="true"
|
||||||
|
name="fade-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
alt=""
|
||||||
|
class="v-img__img v-img__img--cover"
|
||||||
|
src="/src/assets/it4c-logo2-clean-bg_alpha-128x128.png"
|
||||||
|
style="display: none;"
|
||||||
|
/>
|
||||||
|
</transition-stub>
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="fade-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-avatar__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="v-col d-flex align-center justify-center grow"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$t('menu.home')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/app"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$t('menu.app')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="v-btn v-theme--light v-btn--density-default v-btn--size-default v-btn--variant-flat"
|
||||||
|
href="/about"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-btn__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-btn__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<span
|
||||||
|
class="v-btn__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$t('menu.about')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-input v-input--horizontal v-input--center-affix v-input--density-default v-locale--is-ltr v-input--dirty v-switch d-flex justify-end mr-5"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-input__control"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-selection-control v-selection-control--dirty v-selection-control--density-default"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-selection-control__wrapper text-success"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-switch__track bg-success"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-selection-control__input"
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
<input
|
||||||
|
aria-describedby="switch-4-messages"
|
||||||
|
aria-disabled="false"
|
||||||
|
id="switch-4"
|
||||||
|
type="checkbox"
|
||||||
|
value="true"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="v-switch__thumb bg-success"
|
||||||
|
>
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="scale-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<label
|
||||||
|
class="v-label v-label--clickable"
|
||||||
|
for="switch-4"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
|
||||||
|
$t('language.german')
|
||||||
|
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-input__details"
|
||||||
|
>
|
||||||
|
<transition-group-stub
|
||||||
|
appear="false"
|
||||||
|
aria-live="polite"
|
||||||
|
class="v-messages"
|
||||||
|
css="true"
|
||||||
|
id="switch-4-messages"
|
||||||
|
name="slide-y-transition"
|
||||||
|
persisted="false"
|
||||||
|
role="alert"
|
||||||
|
tag="div"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-group-stub>
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<transition-stub
|
||||||
|
appear="false"
|
||||||
|
css="true"
|
||||||
|
name="expand-transition"
|
||||||
|
persisted="false"
|
||||||
|
>
|
||||||
|
<!---->
|
||||||
|
</transition-stub>
|
||||||
|
|
||||||
|
</header>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
25
src/layouts/DefaultLayout.test.ts
Normal file
25
src/layouts/DefaultLayout.test.ts
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { beforeEach, expect, describe, it } from 'vitest'
|
||||||
|
import { Component, h } from 'vue'
|
||||||
|
import { VApp } from 'vuetify/components'
|
||||||
|
|
||||||
|
import DefaultLayout from './DefaultLayout.vue'
|
||||||
|
|
||||||
|
describe('LogoAvatar', () => {
|
||||||
|
const Wrapper = () => {
|
||||||
|
return mount(VApp, {
|
||||||
|
slots: {
|
||||||
|
default: h(DefaultLayout as Component),
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}
|
||||||
|
let wrapper: ReturnType<typeof Wrapper>
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
wrapper = Wrapper()
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
40
src/layouts/__snapshots__/DefaultLayout.test.ts.snap
Normal file
40
src/layouts/__snapshots__/DefaultLayout.test.ts.snap
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`LogoAvatar > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-application__wrap"
|
||||||
|
>
|
||||||
|
|
||||||
|
<main
|
||||||
|
class="v-main bg-grey-lighten-3"
|
||||||
|
style="--v-layout-left: 0px; --v-layout-right: 0px; --v-layout-top: 0px; --v-layout-bottom: 0px; transition: none !important;"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-container v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-row"
|
||||||
|
>
|
||||||
|
<!--v-if-->
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-sheet v-theme--light v-sheet--rounded pa-3"
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
18
src/pages/about/Page.test.ts
Normal file
18
src/pages/about/Page.test.ts
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { describe, it, expect } from 'vitest'
|
||||||
|
import { Component, h } from 'vue'
|
||||||
|
import { VApp } from 'vuetify/components'
|
||||||
|
|
||||||
|
import AboutPage from './+Page.vue'
|
||||||
|
|
||||||
|
describe('DataPrivacyPage', () => {
|
||||||
|
const wrapper = mount(VApp, {
|
||||||
|
slots: {
|
||||||
|
default: h(AboutPage as Component),
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
68
src/pages/about/__snapshots__/Page.test.ts.snap
Normal file
68
src/pages/about/__snapshots__/Page.test.ts.snap
Normal file
@ -0,0 +1,68 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`DataPrivacyPage > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-application__wrap"
|
||||||
|
>
|
||||||
|
|
||||||
|
<main
|
||||||
|
class="v-main bg-grey-lighten-3"
|
||||||
|
style="--v-layout-left: 0px; --v-layout-right: 0px; --v-layout-top: 0px; --v-layout-bottom: 0px;"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-container v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-row"
|
||||||
|
>
|
||||||
|
<!--v-if-->
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-sheet v-theme--light v-sheet--rounded pa-3"
|
||||||
|
>
|
||||||
|
|
||||||
|
<h1>
|
||||||
|
$t('about.h1')
|
||||||
|
</h1>
|
||||||
|
<p>
|
||||||
|
Um mehr über diese Kochplatte zu erfahren kannst du dir den Quellcode auf
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="https://github.com/IT4Change/boilerplate-frontend/"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
$t('about.link1')
|
||||||
|
</a>
|
||||||
|
|
||||||
|
anschauen.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Du willst mehr erfahren? Besuche uns auf
|
||||||
|
|
||||||
|
<a
|
||||||
|
href="https://it4c.dev"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
$t('about.link2')
|
||||||
|
</a>
|
||||||
|
|
||||||
|
.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
18
src/pages/app/Page.test.ts
Normal file
18
src/pages/app/Page.test.ts
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { describe, it, expect } from 'vitest'
|
||||||
|
import { Component, h } from 'vue'
|
||||||
|
import { VApp } from 'vuetify/components'
|
||||||
|
|
||||||
|
import AppPage from './+Page.vue'
|
||||||
|
|
||||||
|
describe('DataPrivacyPage', () => {
|
||||||
|
const wrapper = mount(VApp, {
|
||||||
|
slots: {
|
||||||
|
default: h(AppPage as Component),
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
161
src/pages/app/__snapshots__/Page.test.ts.snap
Normal file
161
src/pages/app/__snapshots__/Page.test.ts.snap
Normal file
@ -0,0 +1,161 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`DataPrivacyPage > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-application__wrap"
|
||||||
|
>
|
||||||
|
|
||||||
|
<main
|
||||||
|
class="v-main bg-grey-lighten-3"
|
||||||
|
style="--v-layout-left: 0px; --v-layout-right: 0px; --v-layout-top: 0px; --v-layout-bottom: 0px;"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-container v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-row"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-col v-col-2"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-sheet v-theme--light v-sheet--rounded"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-list v-theme--light v-list--density-default v-list--one-line v-list--rounded"
|
||||||
|
role="listbox"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
|
||||||
|
<a
|
||||||
|
class="v-list-item v-list-item--active v-list-item--link v-theme--light v-list-item--density-default v-list-item--one-line v-list-item--variant-text"
|
||||||
|
href="/app"
|
||||||
|
tabindex="-2"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-list-item__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-list-item__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-list-item__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-list-item-title"
|
||||||
|
>
|
||||||
|
$t('app.value.menu')
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="v-list-item v-list-item--link v-theme--light v-list-item--density-default v-list-item--one-line v-list-item--variant-text"
|
||||||
|
href="/app/inc"
|
||||||
|
tabindex="-2"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-list-item__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-list-item__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-list-item__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-list-item-title"
|
||||||
|
>
|
||||||
|
$t('app.inc.menu')
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
<hr
|
||||||
|
aria-orientation="horizontal"
|
||||||
|
class="v-divider v-theme--light my-2"
|
||||||
|
role="separator"
|
||||||
|
/>
|
||||||
|
<a
|
||||||
|
class="v-list-item v-list-item--link v-theme--light v-list-item--density-default v-list-item--one-line v-list-item--variant-text"
|
||||||
|
href="/app/reset"
|
||||||
|
tabindex="-2"
|
||||||
|
>
|
||||||
|
|
||||||
|
<span
|
||||||
|
class="v-list-item__overlay"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
class="v-list-item__underlay"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<div
|
||||||
|
class="v-list-item__content"
|
||||||
|
data-no-activator=""
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-list-item-title"
|
||||||
|
>
|
||||||
|
$t('app.reset.menu')
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
<!---->
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-sheet v-theme--light v-sheet--rounded pa-3"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h1>
|
||||||
|
$t('app.value.h1')
|
||||||
|
</h1>
|
||||||
|
<p>
|
||||||
|
Der aktuelle Wert des Zählers lautet:
|
||||||
|
|
||||||
|
|
||||||
|
<b>
|
||||||
|
0
|
||||||
|
</b>
|
||||||
|
|
||||||
|
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
18
src/pages/index/Page.test.ts
Normal file
18
src/pages/index/Page.test.ts
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { describe, it, expect } from 'vitest'
|
||||||
|
import { Component, h } from 'vue'
|
||||||
|
import { VApp } from 'vuetify/components'
|
||||||
|
|
||||||
|
import IndexPage from './+Page.vue'
|
||||||
|
|
||||||
|
describe('DataPrivacyPage', () => {
|
||||||
|
const wrapper = mount(VApp, {
|
||||||
|
slots: {
|
||||||
|
default: h(IndexPage as Component),
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.element).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
})
|
||||||
69
src/pages/index/__snapshots__/Page.test.ts.snap
Normal file
69
src/pages/index/__snapshots__/Page.test.ts.snap
Normal file
@ -0,0 +1,69 @@
|
|||||||
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||||
|
|
||||||
|
exports[`DataPrivacyPage > renders 1`] = `
|
||||||
|
<div
|
||||||
|
class="v-application v-theme--light v-layout v-layout--full-height v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-application__wrap"
|
||||||
|
>
|
||||||
|
|
||||||
|
<main
|
||||||
|
class="v-main bg-grey-lighten-3"
|
||||||
|
style="--v-layout-left: 0px; --v-layout-right: 0px; --v-layout-top: 0px; --v-layout-bottom: 0px;"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="v-container v-locale--is-ltr"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-row"
|
||||||
|
>
|
||||||
|
<!--v-if-->
|
||||||
|
<div
|
||||||
|
class="v-col"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="v-sheet v-theme--light v-sheet--rounded pa-3"
|
||||||
|
>
|
||||||
|
|
||||||
|
<h1>
|
||||||
|
$t('home.h1')
|
||||||
|
</h1>
|
||||||
|
<p>
|
||||||
|
$t('home.text1')
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
$t('home.text2')
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
$t('home.text3')
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
$t('home.text4')
|
||||||
|
<i
|
||||||
|
aria-hidden="true"
|
||||||
|
class="mdi-heart mdi v-icon notranslate v-theme--light v-icon--size-default text-red"
|
||||||
|
/>
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
$t('home.greet1')
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
$t('home.greet2')
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
Loading…
x
Reference in New Issue
Block a user