diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-18 00:09:39 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-18 00:09:39 +0300 |
commit | 63b9a1e5bd6f67dd375e00c44eedf6a526f6653d (patch) | |
tree | 224c640358c560f6b827a3a7efff6df2d774bb70 /spec/frontend | |
parent | 708ee0bcb2c20cc73db53c092a26f916139d15d4 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend')
-rw-r--r-- | spec/frontend/behaviors/autosize_spec.js | 18 | ||||
-rw-r--r-- | spec/frontend/helpers/startup_css_helper_spec.js | 122 |
2 files changed, 43 insertions, 97 deletions
diff --git a/spec/frontend/behaviors/autosize_spec.js b/spec/frontend/behaviors/autosize_spec.js index 59abae479d4..3444c7b4075 100644 --- a/spec/frontend/behaviors/autosize_spec.js +++ b/spec/frontend/behaviors/autosize_spec.js @@ -1,20 +1,24 @@ -import $ from 'jquery'; import '~/behaviors/autosize'; function load() { - $(document).trigger('load'); + document.dispatchEvent(new Event('DOMContentLoaded')); } +jest.mock('~/helpers/startup_css_helper', () => { + return { + waitForCSSLoaded: jest.fn().mockImplementation(cb => cb.apply()), + }; +}); + describe('Autosize behavior', () => { beforeEach(() => { - setFixtures('<textarea class="js-autosize" style="resize: vertical"></textarea>'); + setFixtures('<textarea class="js-autosize"></textarea>'); }); - it('does not overwrite the resize property', () => { + it('is applied to the textarea', () => { load(); - expect($('textarea')).toHaveCss({ - resize: 'vertical', - }); + const textarea = document.querySelector('textarea'); + expect(textarea.classList).toContain('js-autosize-initialized'); }); }); diff --git a/spec/frontend/helpers/startup_css_helper_spec.js b/spec/frontend/helpers/startup_css_helper_spec.js index 9eff6efd21a..7b83f0aefca 100644 --- a/spec/frontend/helpers/startup_css_helper_spec.js +++ b/spec/frontend/helpers/startup_css_helper_spec.js @@ -1,123 +1,65 @@ -import { - handleLoadedEvents, - waitForCSSLoaded, -} from '../../../app/assets/javascripts/helpers/startup_css_helper'; - -describe('handleLoadedEvents', () => { - let mock; - beforeEach(() => { - mock = jest.fn(); - }); - - it('should not call the callback on wrong conditions', () => { - const resolverToCall = handleLoadedEvents(mock); - resolverToCall({ type: 'UnrelatedEvent' }); - resolverToCall({ type: 'UnrelatedEvent' }); - resolverToCall({ type: 'UnrelatedEvent' }); - resolverToCall({ type: 'UnrelatedEvent' }); - resolverToCall({ type: 'CSSLoaded' }); - resolverToCall(); - expect(mock).not.toHaveBeenCalled(); - }); - - it('should call the callback when all the events have been triggered', () => { - const resolverToCall = handleLoadedEvents(mock); - resolverToCall(); - resolverToCall({ type: 'DOMContentLoaded' }); - resolverToCall({ type: 'CSSLoaded' }); - resolverToCall(); - expect(mock).toHaveBeenCalledTimes(1); - }); -}); +import { waitForCSSLoaded } from '../../../app/assets/javascripts/helpers/startup_css_helper'; describe('waitForCSSLoaded', () => { - let mock; + let mockedCallback; + beforeEach(() => { - mock = jest.fn(); + mockedCallback = jest.fn(); }); - describe('with startup css disabled', () => { - beforeEach(() => { - gon.features = { - startupCss: false, - }; + describe('Promise-like api', () => { + it('can be used with a callback', async () => { + await waitForCSSLoaded(mockedCallback); + expect(mockedCallback).toHaveBeenCalledTimes(1); }); - it('should call CssLoaded when the conditions are met', async () => { - const docAddListener = jest.spyOn(document, 'addEventListener'); - const docRemoveListener = jest.spyOn(document, 'removeEventListener'); - const docDispatch = jest.spyOn(document, 'dispatchEvent'); - const events = waitForCSSLoaded(mock); + it('can be used as a promise', async () => { + await waitForCSSLoaded().then(mockedCallback); + expect(mockedCallback).toHaveBeenCalledTimes(1); + }); + }); - expect(docAddListener).toHaveBeenCalledTimes(3); - expect(docDispatch.mock.calls[0][0].type).toBe('CSSStartupLinkLoaded'); + describe('with startup css disabled', () => { + gon.features = { + startupCss: false, + }; - document.dispatchEvent(new CustomEvent('DOMContentLoaded')); + it('should invoke the action right away', async () => { + const events = waitForCSSLoaded(mockedCallback); await events; - expect(docDispatch).toHaveBeenCalledTimes(3); - expect(docDispatch.mock.calls[2][0].type).toBe('CSSLoaded'); - expect(docRemoveListener).toHaveBeenCalledTimes(1); - expect(mock).toHaveBeenCalledTimes(1); + expect(mockedCallback).toHaveBeenCalledTimes(1); }); }); describe('with startup css enabled', () => { - let docAddListener; - let docRemoveListener; - let docDispatch; - - beforeEach(() => { - docAddListener = jest.spyOn(document, 'addEventListener'); - docRemoveListener = jest.spyOn(document, 'removeEventListener'); - docDispatch = jest.spyOn(document, 'dispatchEvent'); - gon.features = { - startupCss: true, - }; - }); + gon.features = { + startupCss: true, + }; - it('should call CssLoaded if the assets are cached', async () => { - const events = waitForCSSLoaded(mock); - const fixtures = ` + it('should dispatch CSSLoaded when the assets are cached or already loaded', async () => { + setFixtures(` <link href="one.css" data-startupcss="loaded"> <link href="two.css" data-startupcss="loaded"> - `; - setFixtures(fixtures); + `); + await waitForCSSLoaded(mockedCallback); - expect(docAddListener).toHaveBeenCalledTimes(3); - expect(docDispatch.mock.calls[0][0].type).toBe('CSSStartupLinkLoaded'); - - document.dispatchEvent(new CustomEvent('DOMContentLoaded')); - await events; - - expect(docDispatch).toHaveBeenCalledTimes(3); - expect(docDispatch.mock.calls[2][0].type).toBe('CSSLoaded'); - expect(docRemoveListener).toHaveBeenCalledTimes(1); - expect(mock).toHaveBeenCalledTimes(1); + expect(mockedCallback).toHaveBeenCalledTimes(1); }); it('should wait to call CssLoaded until the assets are loaded', async () => { - const events = waitForCSSLoaded(mock); - const fixtures = ` + setFixtures(` <link href="one.css" data-startupcss="loading"> <link href="two.css" data-startupcss="loading"> - `; - setFixtures(fixtures); - - expect(docAddListener).toHaveBeenCalledTimes(3); - expect(docDispatch.mock.calls[0][0].type).toBe('CSSStartupLinkLoaded'); - + `); + const events = waitForCSSLoaded(mockedCallback); document .querySelectorAll('[data-startupcss="loading"]') .forEach(elem => elem.setAttribute('data-startupcss', 'loaded')); - document.dispatchEvent(new CustomEvent('DOMContentLoaded')); document.dispatchEvent(new CustomEvent('CSSStartupLinkLoaded')); await events; - expect(docDispatch).toHaveBeenCalledTimes(4); - expect(docDispatch.mock.calls[3][0].type).toBe('CSSLoaded'); - expect(docRemoveListener).toHaveBeenCalledTimes(1); - expect(mock).toHaveBeenCalledTimes(1); + expect(mockedCallback).toHaveBeenCalledTimes(1); }); }); }); |