summaryrefslogtreecommitdiff
path: root/spec/frontend/lib/utils/dom_utils_spec.js
blob: 10b4a10a8ffcae667270702b94fac25ee9492dae (plain)
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
import { addClassIfElementExists, canScrollUp, canScrollDown } from '~/lib/utils/dom_utils';

const TEST_MARGIN = 5;

describe('DOM Utils', () => {
  describe('addClassIfElementExists', () => {
    const className = 'biology';
    const fixture = `
      <div class="parent">
        <div class="child"></div>
      </div>
    `;

    let parentElement;

    beforeEach(() => {
      setFixtures(fixture);
      parentElement = document.querySelector('.parent');
    });

    it('adds class if element exists', () => {
      const childElement = parentElement.querySelector('.child');

      expect(childElement).not.toBe(null);

      addClassIfElementExists(childElement, className);

      expect(childElement.classList).toContainEqual(className);
    });

    it('does not throw if element does not exist', () => {
      const childElement = parentElement.querySelector('.other-child');

      expect(childElement).toBe(null);

      addClassIfElementExists(childElement, className);
    });
  });

  describe('canScrollUp', () => {
    [1, 100].forEach(scrollTop => {
      it(`is true if scrollTop is > 0 (${scrollTop})`, () => {
        expect(
          canScrollUp({
            scrollTop,
          }),
        ).toBe(true);
      });
    });

    [0, -10].forEach(scrollTop => {
      it(`is false if scrollTop is <= 0 (${scrollTop})`, () => {
        expect(
          canScrollUp({
            scrollTop,
          }),
        ).toBe(false);
      });
    });

    it('is true if scrollTop is > margin', () => {
      expect(
        canScrollUp(
          {
            scrollTop: TEST_MARGIN + 1,
          },
          TEST_MARGIN,
        ),
      ).toBe(true);
    });

    it('is false if scrollTop is <= margin', () => {
      expect(
        canScrollUp(
          {
            scrollTop: TEST_MARGIN,
          },
          TEST_MARGIN,
        ),
      ).toBe(false);
    });
  });

  describe('canScrollDown', () => {
    let element;

    beforeEach(() => {
      element = {
        scrollTop: 7,
        offsetHeight: 22,
        scrollHeight: 30,
      };
    });

    it('is true if element can be scrolled down', () => {
      expect(canScrollDown(element)).toBe(true);
    });

    it('is false if element cannot be scrolled down', () => {
      element.scrollHeight -= 1;

      expect(canScrollDown(element)).toBe(false);
    });

    it('is true if element can be scrolled down, with margin given', () => {
      element.scrollHeight += TEST_MARGIN;

      expect(canScrollDown(element, TEST_MARGIN)).toBe(true);
    });

    it('is false if element cannot be scrolled down, with margin given', () => {
      expect(canScrollDown(element, TEST_MARGIN)).toBe(false);
    });
  });
});