diff options
Diffstat (limited to 'spec/frontend/behaviors')
-rw-r--r-- | spec/frontend/behaviors/autosize_spec.js | 32 | ||||
-rw-r--r-- | spec/frontend/behaviors/copy_as_gfm_spec.js | 2 | ||||
-rw-r--r-- | spec/frontend/behaviors/gl_emoji_spec.js | 4 |
3 files changed, 26 insertions, 12 deletions
diff --git a/spec/frontend/behaviors/autosize_spec.js b/spec/frontend/behaviors/autosize_spec.js index 352bd8a0ed0..a9dbee7fd08 100644 --- a/spec/frontend/behaviors/autosize_spec.js +++ b/spec/frontend/behaviors/autosize_spec.js @@ -1,12 +1,20 @@ import '~/behaviors/autosize'; -function load() { - document.dispatchEvent(new Event('DOMContentLoaded')); -} - jest.mock('~/helpers/startup_css_helper', () => { return { - waitForCSSLoaded: jest.fn().mockImplementation((cb) => cb.apply()), + waitForCSSLoaded: jest.fn().mockImplementation((cb) => { + // This is a hack: + // autosize.js will execute and modify the DOM + // whenever waitForCSSLoaded calls its callback function. + // This setTimeout is here because everything within setTimeout will be queued + // as async code until the current call stack is executed. + // If we would not do this, the mock for waitForCSSLoaded would call its callback + // before the fixture in the beforeEach is set and the Test would fail. + // more on this here: https://johnresig.com/blog/how-javascript-timers-work/ + setTimeout(() => { + cb.apply(); + }, 0); + }), }; }); @@ -16,9 +24,15 @@ describe('Autosize behavior', () => { }); it('is applied to the textarea', () => { - load(); - - const textarea = document.querySelector('textarea'); - expect(textarea.classList).toContain('js-autosize-initialized'); + // This is the second part of the Hack: + // Because we are forcing the mock for WaitForCSSLoaded and the very end of our callstack + // to call its callback. This querySelector needs to go to the very end of our callstack + // as well, if we would not have this setTimeout Function here, the querySelector + // would run before the mockImplementation called its callBack Function + // the DOM Manipulation didn't happen yet and the test would fail. + setTimeout(() => { + const textarea = document.querySelector('textarea'); + expect(textarea.classList).toContain('js-autosize-initialized'); + }, 0); }); }); diff --git a/spec/frontend/behaviors/copy_as_gfm_spec.js b/spec/frontend/behaviors/copy_as_gfm_spec.js index 16ea4ba8624..acff990e84a 100644 --- a/spec/frontend/behaviors/copy_as_gfm_spec.js +++ b/spec/frontend/behaviors/copy_as_gfm_spec.js @@ -1,5 +1,5 @@ -import * as commonUtils from '~/lib/utils/common_utils'; import initCopyAsGFM, { CopyAsGFM } from '~/behaviors/markdown/copy_as_gfm'; +import * as commonUtils from '~/lib/utils/common_utils'; describe('CopyAsGFM', () => { describe('CopyAsGFM.pasteGFM', () => { diff --git a/spec/frontend/behaviors/gl_emoji_spec.js b/spec/frontend/behaviors/gl_emoji_spec.js index 6e476d84501..286ed269421 100644 --- a/spec/frontend/behaviors/gl_emoji_spec.js +++ b/spec/frontend/behaviors/gl_emoji_spec.js @@ -1,10 +1,10 @@ import MockAdapter from 'axios-mock-adapter'; import waitForPromises from 'helpers/wait_for_promises'; -import axios from '~/lib/utils/axios_utils'; -import { initEmojiMap, EMOJI_VERSION } from '~/emoji'; import installGlEmojiElement from '~/behaviors/gl_emoji'; +import { initEmojiMap, EMOJI_VERSION } from '~/emoji'; import * as EmojiUnicodeSupport from '~/emoji/support'; +import axios from '~/lib/utils/axios_utils'; jest.mock('~/emoji/support'); |