running-tools

A collection of tools for runners and their coaches
git clone https://git.ashermorgan.net/running-tools/
Log | Files | Refs | README

DoubleOutputTable.spec.js (3961B)

      1 import { test, expect } from 'vitest';
      2 import { shallowMount } from '@vue/test-utils';
      3 import DoubleOutputTable from '@/components/DoubleOutputTable.vue';
      4 
      5 test('should correctly render table body rows and headers', () => {
      6   // Initialize component
      7   const results = [
      8     { key: 'key1', value: 'value1', pace: 'pace1', result: 'value', sort: 2 },
      9     { key: 'key2', value: 'value2', pace: 'pace2', result: 'value', sort: 1 },
     10     { key: 'key3', value: 'value3', pace: 'pace3', result: 'value', sort: 3 },
     11 
     12     { key: 'key4', value: 'value4', pace: 'pace4', result: 'key', sort: 2 },
     13     { key: 'key5', value: 'value5', pace: 'pace5', result: 'key', sort: 1 },
     14     { key: 'key6', value: 'value6', pace: 'pace6', result: 'key', sort: 3 },
     15 
     16     { key: 'key7', value: 'value7', pace: 'pace7', result: 'value', sort: 2 },
     17     { key: 'key8', value: 'value8', pace: 'pace8', result: 'value', sort: 1 },
     18     { key: 'key9', value: 'value9', pace: 'pace9', result: 'value', sort: 3 },
     19   ];
     20   const wrapper = shallowMount(DoubleOutputTable, {
     21     propsData: {
     22       calculateResult: (col, row) => {
     23         expect(col.distanceUnit).to.equal('miles');
     24         expect(col.distanceValue).to.equal(2);
     25         return results[row.id + 3*(col.time - 600)];
     26       },
     27       targets: [
     28         { id: 0 },
     29         { id: 1 },
     30         { id: 2 },
     31       ],
     32       inputTimes: [ 600, 601, 602 ],
     33       inputDistance: {
     34         distanceUnit: 'miles',
     35         distanceValue: 2,
     36       },
     37       label: 'foo',
     38     },
     39   });
     40 
     41   // Assert headers are correctly generated from first row of results
     42   const headers = wrapper.findAll('th');
     43   expect(headers[0].element.textContent).to.equal('foo');
     44   expect(headers[1].element.textContent).to.equal('key1');
     45   expect(headers[2].element.textContent).to.equal('key2');
     46   expect(headers[3].element.textContent).to.equal('key3');
     47   expect(headers.length).to.equal(4);
     48 
     49   // Assert results are correctly rendered
     50   const rows = wrapper.findAll('tbody tr');
     51   expect(rows[0].findAll('td')[0].element.textContent).to.equal('10:00');
     52   expect(rows[0].findAll('td')[1].element.textContent).to.equal('value1');
     53   expect(rows[0].findAll('td')[2].element.textContent).to.equal('value2');
     54   expect(rows[0].findAll('td')[3].element.textContent).to.equal('value3');
     55   expect(rows[0].findAll('td').length).to.equal(4);
     56   expect(rows[1].findAll('td')[0].element.textContent).to.equal('10:01');
     57   expect(rows[1].findAll('td')[1].element.textContent).to.equal('key4');
     58   expect(rows[1].findAll('td')[2].element.textContent).to.equal('key5');
     59   expect(rows[1].findAll('td')[3].element.textContent).to.equal('key6');
     60   expect(rows[1].findAll('td').length).to.equal(4);
     61   expect(rows[2].findAll('td')[0].element.textContent).to.equal('10:02');
     62   expect(rows[2].findAll('td')[1].element.textContent).to.equal('value7');
     63   expect(rows[2].findAll('td')[2].element.textContent).to.equal('value8');
     64   expect(rows[2].findAll('td')[3].element.textContent).to.equal('value9');
     65   expect(rows[2].findAll('td').length).to.equal(4);
     66   expect(rows.length).to.equal(3);
     67 });
     68 
     69 test('Should display message when inputs are empty', () => {
     70   // Initialize component
     71   const wrapper = shallowMount(DoubleOutputTable, {
     72     propsData: {
     73       calculateResult: () => ({ key: 'a', value: 'b', result: 'value', sort: 0 }),
     74       targets: [
     75         { id: 0 },
     76         { id: 1 },
     77         { id: 2 },
     78       ],
     79       inputTimes: [],
     80       inputDistance: {
     81         distanceUnit: 'miles',
     82         distanceValue: 2,
     83       },
     84       label: 'foo',
     85     },
     86   });
     87 
     88   // Assert headers are correctly generated
     89   const headers = wrapper.findAll('th');
     90   expect(headers[0].element.textContent).to.equal('foo');
     91   expect(headers.length).to.equal(1);
     92 
     93   // Assert results are correctly rendered
     94   const rows = wrapper.findAll('tbody tr');
     95   expect(rows[0].findAll('td')[0].text()).to.equal('No inputs were specified.');
     96   expect(rows[0].findAll('td').length).to.equal(1);
     97   expect(rows.length).to.equal(1);
     98 });