Skip to content

Commit

Permalink
Improve test coverage
Browse files Browse the repository at this point in the history
  • Loading branch information
ajuvonen committed May 10, 2024
1 parent b5ec9ed commit d2a65b7
Show file tree
Hide file tree
Showing 14 changed files with 487 additions and 28 deletions.
17 changes: 15 additions & 2 deletions src/components/__tests__/ChartScreenReaderTable.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,24 @@ describe('ChartScreenReaderTable', () => {
props: {
title: 'Amount of trainings',
id: 'my-chart',
labels: ['Running', 'Sprint', 'Swimming'],
data: [1, 2, 3],
columnHeaders: ['Running', 'Sprint', 'Swimming'],
data: [[1, 2, 3]],
},
});
expect(wrapper.html()).toMatchSnapshot();
expect(wrapper.find('table').classes()).toContain('d-sr-only');
});

it('mounts with row headers', () => {
const wrapper = mount(ChartScreenReaderTable, {
props: {
title: 'Amount of trainings',
id: 'my-chart',
columnHeaders: ['Running', 'Sprint', 'Swimming'],
rowHeaders: ['Week 1', 'Week 2', 'Week 3'],
data: [[1, 2, 3], [1, 1, 2], [3, 3, 0]],
},
});
expect(wrapper.html()).toMatchSnapshot();
});
});
14 changes: 14 additions & 0 deletions src/components/__tests__/PrintViewTable.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,4 +15,18 @@ describe('PrintViewTable', () => {
});
expect(wrapper.html()).toMatchSnapshot();
});

it('slot overrides table title', () => {
const wrapper = mount(PrintViewTable, {
props: {
tableTitle: 'My table',
},
slots: {
title: '<h2>My title</h2>',
header: '<tr><th>My header</th></tr>',
body: '<tr><td>Body content</td></tr>',
},
});
expect(wrapper.find('h2').text()).toBe('My title');
});
});
16 changes: 16 additions & 0 deletions src/components/__tests__/StatsView.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import {describe, it, expect, beforeEach} from 'vitest';
import {mount} from '@vue/test-utils';
import {useAppStateStore} from '@/stores/appState';
import StatsView from '@/views/StatsView.vue';

describe('StatsView', () => {
beforeEach(() => {
const appStateStore = useAppStateStore();
appStateStore.disableCharts = true;
});

it('mounts', () => {
const wrapper = mount(StatsView);
expect(wrapper.html()).toMatchSnapshot();
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ exports[`ChartScreenReaderTable > mounts 1`] = `
<caption>Amount of trainings</caption>
<thead>
<tr>
<!--v-if-->
<th>Running</th>
<th>Sprint</th>
<th>Swimming</th>
Expand All @@ -19,3 +20,37 @@ exports[`ChartScreenReaderTable > mounts 1`] = `
</tbody>
</table>"
`;

exports[`ChartScreenReaderTable > mounts with row headers 1`] = `
"<table class="d-sr-only" id="my-chart">
<caption>Amount of trainings</caption>
<thead>
<tr>
<td></td>
<th>Running</th>
<th>Sprint</th>
<th>Swimming</th>
</tr>
</thead>
<tbody>
<tr>
<th>Week 1</th>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<th>Week 2</th>
<td>1</td>
<td>1</td>
<td>2</td>
</tr>
<tr>
<th>Week 3</th>
<td>3</td>
<td>3</td>
<td>0</td>
</tr>
</tbody>
</table>"
`;
113 changes: 113 additions & 0 deletions src/components/__tests__/__snapshots__/StatsView.spec.ts.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`StatsView > mounts 1`] = `
"<div data-v-ff4a98e6="" data-v-a19ac338="" class="v-card v-theme--customLight v-card--density-default v-card--rounded v-card--variant-elevated" style="background-color: rgba(255, 255, 255, 0.75);">
<!---->
<div class="v-card__loader">
<div class="v-progress-linear v-theme--customLight v-locale--is-ltr" style="top: 0px; height: 0px; --v-progress-linear-height: 2px;" role="progressbar" aria-hidden="true" aria-valuemin="0" aria-valuemax="100">
<!---->
<div class="v-progress-linear__background"></div>
<div class="v-progress-linear__buffer" style="width: 0%;"></div>
<transition-stub name="fade-transition" appear="false" persisted="false" css="true">
<div class="v-progress-linear__indeterminate">
<div class="v-progress-linear__indeterminate long"></div>
<div class="v-progress-linear__indeterminate short"></div>
</div>
</transition-stub>
<!---->
</div>
</div>
<!---->
<!---->
<div data-v-ff4a98e6="" class="v-card-title d-print-none">
<h1 data-v-ff4a98e6="" class="text-h4">Statistics</h1>
</div>
<div data-v-ff4a98e6="" class="v-card-text">
<p data-v-ff4a98e6="" class="d-flex align-center d-print-none mb-4"><i data-v-ff4a98e6="" class="v-icon notranslate v-theme--customLight v-icon--size-default" aria-hidden="true"><svg class="v-icon__svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="img" aria-hidden="true">
<path d="M13 9H11V7H13V9M13 17H11V11H13V17M5 3H19C20.1 3 21 3.89 21 5V19C21 19.53 20.79 20.04 20.41 20.41C20.04 20.79 19.53 21 19 21H5C4.47 21 3.96 20.79 3.59 20.41C3.21 20.04 3 19.53 3 19V5C3 3.89 3.89 3 5 3M19 19V5H5V19H19Z"></path>
</svg></i><span data-v-ff4a98e6="" class="ml-4">The statistics are updated automatically as you add and complete trainings.</span></p>
<div data-v-a19ac338="" class="v-row justify-center" wrap="">
<div data-v-a19ac338="" class="v-col stats__chart">
<!--v-if-->
<table class="d-sr-only" id="activity-chart-table">
<caption>Training activities</caption>
<thead>
<tr>
<!--v-if-->
</tr>
</thead>
<tbody>
<tr></tr>
</tbody>
</table>
</div>
<div data-v-a19ac338="" class="v-col stats__chart">
<!--v-if-->
<table class="d-sr-only" id="intensity-chart-table">
<caption>Intensity of trainings</caption>
<thead>
<tr>
<!--v-if-->
</tr>
</thead>
<tbody>
<tr></tr>
</tbody>
</table>
</div>
<div data-v-a19ac338="" class="v-col stats__chart">
<!--v-if-->
<table class="d-sr-only" id="rating-chart-table">
<caption>Ratings</caption>
<thead>
<tr>
<!--v-if-->
</tr>
</thead>
<tbody>
<tr></tr>
</tbody>
</table>
</div>
</div>
<div data-v-a19ac338="" class="v-row">
<div data-v-a19ac338="" class="v-col stats__wide-chart">
<!--v-if-->
<table class="d-sr-only" id="weekly-trainings-chart-table">
<caption>Weekly trainings</caption>
<thead>
<tr>
<td></td>
</tr>
</thead>
<tbody>
<tr>
<th>Total trainings</th>
</tr>
<tr>
<th>Completed trainings</th>
</tr>
</tbody>
</table>
</div>
</div>
<div data-v-a19ac338="" class="v-row">
<div data-v-a19ac338="" class="v-col stats__wide-chart">
<!--v-if-->
<table class="d-sr-only" id="weekly-summary-chart-table">
<caption>Weekly summary</caption>
<thead>
<tr>
<td></td>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
<!--v-if-->
<!---->
<!----><span class="v-card__underlay"></span>
</div>"
`;
Loading

0 comments on commit d2a65b7

Please sign in to comment.