running-tools

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

SingleOutputTable.spec.js (4250B)

      1 import { test, expect } from 'vitest';
      2 import { shallowMount } from '@vue/test-utils';
      3 import SingleOutputTable from '@/components/SingleOutputTable.vue';
      4 
      5 test('results should be correct and sorted by sort key', () => {
      6   // Initialize component
      7   const results = [
      8     { key: 'key1', value: 'value1', pace: 'pace1', result: 'key', sort: 2 },
      9     { key: 'key2', value: 'value2', pace: 'pace2', result: 'key', sort: 1 },
     10     { key: 'key3', value: 'value3', pace: 'pace3', result: 'key', sort: 3 },
     11   ];
     12   const wrapper = shallowMount(SingleOutputTable, {
     13     propsData: {
     14       calculateResult: (row) => results[row.id],
     15       targets: [
     16         { id: 0 },
     17         { id: 1 },
     18         { id: 2 },
     19       ],
     20     },
     21   });
     22 
     23   // Assert results are correctly rendered
     24   const rows = wrapper.findAll('tbody tr');
     25   expect(rows[0].findAll('td')[0].element.textContent).to.equal('key2');
     26   expect(rows[0].findAll('td')[1].element.textContent).to.equal('value2');
     27   expect(rows[0].findAll('td').length).to.equal(2);
     28   expect(rows[1].findAll('td')[0].element.textContent).to.equal('key1');
     29   expect(rows[1].findAll('td')[1].element.textContent).to.equal('value1');
     30   expect(rows[1].findAll('td').length).to.equal(2);
     31   expect(rows[2].findAll('td')[0].element.textContent).to.equal('key3');
     32   expect(rows[2].findAll('td')[1].element.textContent).to.equal('value3');
     33   expect(rows[2].findAll('td').length).to.equal(2);
     34   expect(rows.length).to.equal(3);
     35 });
     36 
     37 test('results should have correct classes', () => {
     38   // Initialize component
     39   const results = [
     40     { key: 'key1', value: 'value1', pace: 'pace1', result: 'value', sort: 1 },
     41     { key: 'key2', value: 'value2', pace: 'pace2', result: 'key', sort: 2 },
     42     { key: 'key3', value: 'value3', pace: 'pace3', result: 'value', sort: 3 },
     43   ];
     44   const wrapper = shallowMount(SingleOutputTable, {
     45     propsData: {
     46       calculateResult: (row) => results[row.id],
     47       targets: [
     48         { id: 0 },
     49         { id: 1 },
     50         { id: 2 },
     51       ],
     52     },
     53   });
     54 
     55   // Assert results are correctly rendered
     56   const rows = wrapper.findAll('tbody tr');
     57   expect(rows[0].findAll('td')[0].element.classList).toHaveLength(0);
     58   expect(rows[0].findAll('td')[1].element.classList).to.contain(['result']);
     59   expect(rows[0].findAll('td').length).to.equal(2);
     60   expect(rows[1].findAll('td')[0].element.classList).to.contain(['result']);
     61   expect(rows[1].findAll('td')[1].element.classList).toHaveLength(0);
     62   expect(rows[1].findAll('td').length).to.equal(2);
     63   expect(rows[2].findAll('td')[0].element.classList).toHaveLength(0);
     64   expect(rows[2].findAll('td')[1].element.classList).contain(['result']);
     65   expect(rows[2].findAll('td').length).to.equal(2);
     66   expect(rows.length).to.equal(3);
     67 });
     68 
     69 test('should show correct paces when showPace is true', () => {
     70   // Initialize component
     71   const results = [
     72     { key: 'key1', value: 'value1', pace: 'pace1', result: 'key', sort: 1 },
     73     { key: 'key2', value: 'value2', pace: 'pace2', result: 'key', sort: 2 },
     74     { key: 'key3', value: 'value3', pace: 'pace3', result: 'key', sort: 3 },
     75   ];
     76   const wrapper = shallowMount(SingleOutputTable, {
     77     propsData: {
     78       calculateResult: (row) => results[row.id],
     79       targets: [
     80         { id: 0 },
     81         { id: 1 },
     82         { id: 2 },
     83       ],
     84       showPace: true,
     85     },
     86   });
     87 
     88   // Assert results are correctly rendered
     89   const rows = wrapper.findAll('tbody tr');
     90   expect(rows[0].findAll('td')[0].element.textContent).to.equal('key1');
     91   expect(rows[0].findAll('td')[1].element.textContent).to.equal('value1');
     92   expect(rows[0].findAll('td')[2].element.textContent).to.equal('pace1');
     93   expect(rows[0].findAll('td').length).to.equal(3);
     94   expect(rows[1].findAll('td')[0].element.textContent).to.equal('key2');
     95   expect(rows[1].findAll('td')[1].element.textContent).to.equal('value2');
     96   expect(rows[1].findAll('td')[2].element.textContent).to.equal('pace2');
     97   expect(rows[1].findAll('td').length).to.equal(3);
     98   expect(rows[2].findAll('td')[0].element.textContent).to.equal('key3');
     99   expect(rows[2].findAll('td')[1].element.textContent).to.equal('value3');
    100   expect(rows[2].findAll('td')[2].element.textContent).to.equal('pace3');
    101   expect(rows[2].findAll('td').length).to.equal(3);
    102   expect(rows.length).to.equal(3);
    103 });