git.r.bdr.sh - rbdr/forum/blob - src/components/forum_list/forum_list.test.js

   1 import '@testing-library/jest-dom/extend-expect';
   2
   3 import { render } from '@testing-library/svelte';
   4 import '$/config/i18n';
   5
   6 import { addMessages } from 'svelte-i18n';
   7
   8 import ForumList from './forum_list.svelte';
   9
  10 const internals = {
  11   results: null
  12 };
  13
  14 describe('Forum List component', () => {
  15
  16   beforeAll(() => {
  17
  18     addMessages('en', {
  19       'test_forums.yes': 'Absolutely yes',
  20       'test_forums.no': 'No, not at all',
  21       'test_forums.maybe': 'OK, maybe...'
  22     });
  23   });
  24
  25   beforeEach(() => {
  26
  27     internals.results = render(ForumList, { props: {
  28       forums: [
  29         {
  30           id: 'yes',
  31           glyph: '☆',
  32           label: 'test_forums.yes',
  33           position: 2
  34         },
  35         {
  36           id: 'no',
  37           glyph: '◯',
  38           label: 'test_forums.no',
  39           position: 0
  40         },
  41         {
  42           id: 'maybe',
  43           glyph: '⏀',
  44           label: 'test_forums.maybe',
  45           position: 1
  46         }
  47       ]
  48     } });
  49   });
  50
  51   test('It should display each forum according to their position', () => {
  52
  53     expect(internals.results.container)
  54       .toHaveTextContent(/^◯.+⏀.+☆.+$/);
  55   });
  56
  57   test('It should translate forum labels', () => {
  58
  59     expect(internals.results.getByText('Absolutely yes')).toBeVisible();
  60     expect(internals.results.getByText('No, not at all')).toBeVisible();
  61     expect(internals.results.getByText('OK, maybe...')).toBeVisible();
  62   });
  63
  64   test('It should display forum glyphs', () => {
  65
  66     expect(internals.results.getByText('☆')).toBeVisible();
  67     expect(internals.results.getByText('◯')).toBeVisible();
  68     expect(internals.results.getByText('⏀')).toBeVisible();
  69   });
  70
  71   test('Label should be a permalink to the forum', () => {
  72
  73     expect(internals.results.getByText('Absolutely yes').closest('a'))
  74       .toHaveAttribute('href', '/f/yes');
  75     expect(internals.results.getByText('No, not at all').closest('a'))
  76       .toHaveAttribute('href', '/f/no');
  77     expect(internals.results.getByText('OK, maybe...').closest('a'))
  78       .toHaveAttribute('href', '/f/maybe');
  79   });
  80
  81   test('Glyph should be a permalink to the forum', () => {
  82
  83     expect(internals.results.getByText('☆').closest('a'))
  84       .toHaveAttribute('href', '/f/yes');
  85     expect(internals.results.getByText('◯').closest('a'))
  86       .toHaveAttribute('href', '/f/no');
  87     expect(internals.results.getByText('⏀').closest('a'))
  88       .toHaveAttribute('href', '/f/maybe');
  89   });
  90 });