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

   1 /**
   2  * @jest-environment jsdom
   3  */
   4
   5 import '@testing-library/jest-dom/extend-expect';
   6
   7 import { addMessages } from 'svelte-i18n';
   8
   9 import { cleanup, render } from '@testing-library/svelte';
  10 import '$lib/i18n';
  11
  12 import Topic from './topic.svelte';
  13
  14 const internals = {
  15         results: null,
  16         basicTopic: {
  17                 id: 'b1a4f8d1-4d16-4872-b391-fda6a0e9012d',
  18                 title: 'I sure am a test topic',
  19                 ttl: 160 * 1000,
  20                 updated_at: Date.now(),
  21                 forum: {
  22                         id: 'diversion',
  23                         glyph: '⏃',
  24                         label: 'test_forums.diversion'
  25                 },
  26                 tags: [
  27                         {
  28                                 id: 'fish',
  29                                 weight: 40
  30                         },
  31                         {
  32                                 id: 'statue',
  33                                 weight: 5
  34                         }
  35                 ],
  36                 posts: [
  37                         {
  38                                 id: '413a74db-9473-4bac-8698-da9452c05854',
  39                                 text: 'This is the first post',
  40                                 created_at: Date.UTC(1999, 7, 1, 8, 8, 2, 111).valueOf(),
  41                                 author: {
  42                                         handle: 'past_user',
  43                                         id: 'c76d3e51-76ac-4e84-a1b2-2eee9abd68b3'
  44                                 }
  45                         },
  46                         {
  47                                 id: '821ff177-5250-406f-9431-1a8097b35430',
  48                                 text: 'This response came later',
  49                                 created_at: Date.UTC(2038, 1, 2, 3, 4, 6, 789).valueOf(),
  50                                 author: {
  51                                         handle: 'future_user',
  52                                         id: 'cb9307cb-77e9-4c55-bbe7-dbbf88737358'
  53                                 }
  54                         }
  55                 ]
  56         },
  57         topicWithoutForum: {
  58                 id: '9715e9ee-0d63-4b50-b613-826ef2791728',
  59                 title: 'This topic, no forums',
  60                 ttl: 160 * 1000,
  61                 updated_at: Date.now(),
  62                 tags: [
  63                         {
  64                                 id: 'cauliflower',
  65                                 weight: 33
  66                         }
  67                 ],
  68                 posts: []
  69         }
  70 };
  71
  72 describe('Topic component', () => {
  73         beforeAll(() => {
  74                 addMessages('en', {
  75                         'test_forums.diversion': 'Diversion'
  76                 });
  77         });
  78
  79         beforeEach(() => {
  80                 internals.results = render(Topic, {
  81                         props: {
  82                                 topic: internals.basicTopic
  83                         }
  84                 });
  85         });
  86
  87         test('Should show the topic title', () => {
  88                 expect(internals.results.getByText('I sure am a test topic')).toBeVisible();
  89         });
  90         test('Should display remaining time in readable format', () => {
  91                 expect(internals.results.getByText(/2 minutes remaining/)).toBeVisible();
  92         });
  93         test('Remaining time should be a permalink to the topic', () => {
  94                 expect(internals.results.getByText(/2 minutes remaining/).closest('a')).toHaveAttribute(
  95                         'href',
  96                         '/t/b1a4f8d1-4d16-4872-b391-fda6a0e9012d'
  97                 );
  98         });
  99
 100         test('Should show text for all posts', () => {
 101                 expect(internals.results.getByText('This is the first post')).toBeVisible();
 102                 expect(internals.results.getByText('This response came later')).toBeVisible();
 103         });
 104
 105         test('Should send index and count to posts', () => {
 106                 expect(internals.results.getByTitle('Post 1 of 2 by past_user')).toBeVisible();
 107                 expect(internals.results.getByTitle('Post 2 of 2 by future_user')).toBeVisible();
 108         });
 109
 110         describe('Forum link', () => {
 111                 test('Should show forum if the post has one', () => {
 112                         expect(internals.results.getByText(/^\s*⏃\s*Diversion\s*$/)).toBeVisible();
 113                 });
 114
 115                 test('Forum text should be a permalink to the forum', () => {
 116                         expect(internals.results.getByText(/^\s*⏃\s*Diversion\s*$/).closest('a')).toHaveAttribute(
 117                                 'href',
 118                                 '/f/diversion'
 119                         );
 120                 });
 121
 122                 test("Should not show forum if the post doesn't have one", () => {
 123                         cleanup();
 124                         internals.results = render(Topic, {
 125                                 props: {
 126                                         topic: internals.topicWithoutForum
 127                                 }
 128                         });
 129
 130                         expect(internals.results.queryByText(/^\s*⏃\s*Diversion\s*$/)).toBe(null);
 131                 });
 132         });
 133
 134         describe('Tag listing', () => {
 135                 test('Should show topic tags', () => {
 136                         expect(internals.results.getByText('fish')).toBeVisible();
 137                         expect(internals.results.getByText('fish')).toHaveTextContent('fish(40)');
 138                         expect(internals.results.getByText('statue')).toBeVisible();
 139                         expect(internals.results.getByText('statue')).toHaveTextContent('statue(5)');
 140                 });
 141
 142                 test('Tag text should be a permalink to the tag', () => {
 143                         expect(internals.results.getByText('fish').closest('a')).toHaveAttribute('href', '/g/fish');
 144                         expect(internals.results.getByText('statue').closest('a')).toHaveAttribute(
 145                                 'href',
 146                                 '/g/statue'
 147                         );
 148                 });
 149         });
 150 });