1 files changed, 23 insertions, 9 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);
   });
 });