spec/frontend/behaviors/markdown/highlight_current_user_spec.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
import highlightCurrentUser from '~/behaviors/markdown/highlight_current_user';

describe('highlightCurrentUser', () => {
  let rootElement;
  let elements;

  beforeEach(() => {
    setHTMLFixture(`
      <div id="dummy-root-element">
        <div data-user="1">@first</div>
        <div data-user="2">@second</div>
      </div>
    `);
    rootElement = document.getElementById('dummy-root-element');
    elements = rootElement.querySelectorAll('[data-user]');
  });

  afterEach(() => {
    resetHTMLFixture();
  });

  describe('without current user', () => {
    beforeEach(() => {
      window.gon = window.gon || {};
      window.gon.current_user_id = null;
    });

    afterEach(() => {
      delete window.gon.current_user_id;
    });

    it('does not highlight the user', () => {
      const initialHtml = rootElement.outerHTML;

      highlightCurrentUser(elements);

      expect(rootElement.outerHTML).toBe(initialHtml);
    });
  });

  describe('with current user', () => {
    beforeEach(() => {
      window.gon = window.gon || {};
      window.gon.current_user_id = 2;
    });

    afterEach(() => {
      delete window.gon.current_user_id;
    });

    it('highlights current user', () => {
      highlightCurrentUser(elements);

      expect(elements.length).toBe(2);
      expect(elements[0]).not.toHaveClass('current-user');
      expect(elements[1]).toHaveClass('current-user');
    });
  });
});