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

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