Welcome to mirror list, hosted at ThFree Co, Russian Federation.

startup_css_helper_spec.js « helpers « frontend « spec - gitlab.com/gitlab-org/gitlab-foss.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
blob: 05161437c2257f3089c6e8fe8a3238adf7515e93 (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
import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
import { waitForCSSLoaded } from '~/helpers/startup_css_helper';

describe('waitForCSSLoaded', () => {
  let mockedCallback;

  beforeEach(() => {
    mockedCallback = jest.fn();
  });

  describe('Promise-like api', () => {
    it('can be used with a callback', async () => {
      await waitForCSSLoaded(mockedCallback);
      expect(mockedCallback).toHaveBeenCalledTimes(1);
    });

    it('can be used as a promise', async () => {
      await waitForCSSLoaded().then(mockedCallback);
      expect(mockedCallback).toHaveBeenCalledTimes(1);
    });
  });

  describe('when gon features is not provided', () => {
    let originalGon;

    beforeEach(() => {
      originalGon = window.gon;
      window.gon = null;
    });

    afterEach(() => {
      window.gon = originalGon;
    });

    it('should invoke the action right away', async () => {
      const events = waitForCSSLoaded(mockedCallback);
      await events;

      expect(mockedCallback).toHaveBeenCalledTimes(1);
    });
  });

  describe('with startup css enabled', () => {
    it('should dispatch CSSLoaded when the assets are cached or already loaded', async () => {
      setHTMLFixture(`
        <link href="one.css" data-startupcss="loaded">
        <link href="two.css" data-startupcss="loaded">
      `);
      await waitForCSSLoaded(mockedCallback);

      expect(mockedCallback).toHaveBeenCalledTimes(1);

      resetHTMLFixture();
    });

    it('should wait to call CssLoaded until the assets are loaded', async () => {
      setHTMLFixture(`
        <link href="one.css" data-startupcss="loading">
        <link href="two.css" data-startupcss="loading">
      `);
      const events = waitForCSSLoaded(mockedCallback);
      document.querySelectorAll('[data-startupcss="loading"]').forEach((elem) => {
        // eslint-disable-next-line no-param-reassign
        elem.dataset.startupcss = 'loaded';
      });
      document.dispatchEvent(new CustomEvent('CSSStartupLinkLoaded'));
      await events;

      expect(mockedCallback).toHaveBeenCalledTimes(1);

      resetHTMLFixture();
    });
  });
});