Add latest changes from gitlab-org/gitlab@13-2-stable-ee

7 files changed, 193 insertions, 66 deletions

diff --git a/spec/frontend/helpers/event_hub_factory_spec.js b/spec/frontend/helpers/event_hub_factory_spec.js
index dcfec6b836a..c4f63ff6049 100644
--- a/spec/frontend/helpers/event_hub_factory_spec.js
+++ b/spec/frontend/helpers/event_hub_factory_spec.js
@@ -1,77 +1,72 @@
 import createEventHub from '~/helpers/event_hub_factory';
 
+const TEST_EVENT = 'foobar';
+const TEST_EVENT_2 = 'testevent';
+
 describe('event bus factory', () => {
   let eventBus;
+  let handler;
+  let otherHandlers;
 
   beforeEach(() => {
     eventBus = createEventHub();
+    handler = jest.fn();
+    otherHandlers = [jest.fn(), jest.fn()];
   });
 
   afterEach(() => {
+    eventBus.dispose();
     eventBus = null;
   });
 
-  describe('underlying module', () => {
-    let mitt;
+  describe('instance', () => {
+    it.each`
+      method
+      ${'$on'}
+      ${'$once'}
+      ${'$off'}
+      ${'$emit'}
+    `('has $method method', ({ method }) => {
+      expect(eventBus[method]).toEqual(expect.any(Function));
+    });
+  });
 
+  describe('$on', () => {
     beforeEach(() => {
-      jest.resetModules();
-      jest.mock('mitt');
-
-      // eslint-disable-next-line global-require
-      mitt = require('mitt');
-      mitt.mockReturnValue(() => ({}));
-
-      const createEventHubActual = jest.requireActual('~/helpers/event_hub_factory').default;
-      eventBus = createEventHubActual();
+      eventBus.$on(TEST_EVENT, handler);
     });
 
-    it('creates an emitter', () => {
-      expect(mitt).toHaveBeenCalled();
+    it('calls handler when event is emitted', () => {
+      eventBus.$emit(TEST_EVENT);
+      expect(handler).toHaveBeenCalledWith();
     });
-  });
 
-  describe('instance', () => {
-    it.each`
-      method
-      ${'on'}
-      ${'once'}
-      ${'off'}
-      ${'emit'}
-    `('binds $$method to $method ', ({ method }) => {
-      expect(typeof eventBus[method]).toBe('function');
-      expect(eventBus[method]).toBe(eventBus[`$${method}`]);
+    it('calls handler with multiple args', () => {
+      eventBus.$emit(TEST_EVENT, 'arg1', 'arg2', 'arg3');
+      expect(handler).toHaveBeenCalledWith('arg1', 'arg2', 'arg3');
     });
-  });
 
-  describe('once', () => {
-    const event = 'foobar';
-    let handler;
+    it('calls handler multiple times', () => {
+      eventBus.$emit(TEST_EVENT, 'arg1', 'arg2', 'arg3');
+      eventBus.$emit(TEST_EVENT, 'arg1', 'arg2', 'arg3');
 
-    beforeEach(() => {
-      jest.spyOn(eventBus, 'on');
-      jest.spyOn(eventBus, 'off');
-      handler = jest.fn();
-      eventBus.once(event, handler);
+      expect(handler).toHaveBeenCalledTimes(2);
     });
+  });
 
-    it('calls on internally', () => {
-      expect(eventBus.on).toHaveBeenCalled();
+  describe('$once', () => {
+    beforeEach(() => {
+      eventBus.$once(TEST_EVENT, handler);
     });
 
     it('calls handler when event is emitted', () => {
-      eventBus.emit(event);
+      eventBus.$emit(TEST_EVENT);
       expect(handler).toHaveBeenCalled();
     });
 
-    it('calls off when event is emitted', () => {
-      eventBus.emit(event);
-      expect(eventBus.off).toHaveBeenCalled();
-    });
-
     it('calls the handler only once when event is emitted multiple times', () => {
-      eventBus.emit(event);
-      eventBus.emit(event);
+      eventBus.$emit(TEST_EVENT);
+      eventBus.$emit(TEST_EVENT);
       expect(handler).toHaveBeenCalledTimes(1);
     });
 
@@ -80,15 +75,70 @@ describe('event bus factory', () => {
         handler = jest.fn().mockImplementation(() => {
           throw new Error();
         });
-        eventBus.once(event, handler);
+        eventBus.$once(TEST_EVENT, handler);
       });
 
       it('calls off when event is emitted', () => {
         expect(() => {
-          eventBus.emit(event);
+          eventBus.$emit(TEST_EVENT);
         }).toThrow();
-        expect(eventBus.off).toHaveBeenCalled();
+        expect(() => {
+          eventBus.$emit(TEST_EVENT);
+        }).not.toThrow();
+
+        expect(handler).toHaveBeenCalledTimes(1);
       });
     });
   });
+
+  describe('$off', () => {
+    beforeEach(() => {
+      otherHandlers.forEach(x => eventBus.$on(TEST_EVENT, x));
+      eventBus.$on(TEST_EVENT, handler);
+    });
+
+    it('can be called on event with no handlers', () => {
+      expect(() => {
+        eventBus.$off(TEST_EVENT_2);
+      }).not.toThrow();
+    });
+
+    it('can be called on event with no handlers, with a handler', () => {
+      expect(() => {
+        eventBus.$off(TEST_EVENT_2, handler);
+      }).not.toThrow();
+    });
+
+    it('with a handler, will no longer call that handler', () => {
+      eventBus.$off(TEST_EVENT, handler);
+
+      eventBus.$emit(TEST_EVENT);
+
+      expect(handler).not.toHaveBeenCalled();
+      expect(otherHandlers.map(x => x.mock.calls.length)).toEqual(otherHandlers.map(() => 1));
+    });
+
+    it('without a handler, will no longer call any handlers', () => {
+      eventBus.$off(TEST_EVENT);
+
+      eventBus.$emit(TEST_EVENT);
+
+      expect(handler).not.toHaveBeenCalled();
+      expect(otherHandlers.map(x => x.mock.calls.length)).toEqual(otherHandlers.map(() => 0));
+    });
+  });
+
+  describe('$emit', () => {
+    beforeEach(() => {
+      otherHandlers.forEach(x => eventBus.$on(TEST_EVENT_2, x));
+      eventBus.$on(TEST_EVENT, handler);
+    });
+
+    it('only calls handlers for given type', () => {
+      eventBus.$emit(TEST_EVENT, 'arg1');
+
+      expect(handler).toHaveBeenCalledWith('arg1');
+      expect(otherHandlers.map(x => x.mock.calls.length)).toEqual(otherHandlers.map(() => 0));
+    });
+  });
 });
diff --git a/spec/frontend/helpers/fake_request_animation_frame.js b/spec/frontend/helpers/fake_request_animation_frame.js
new file mode 100644
index 00000000000..b01ae5b7c5f
--- /dev/null
+++ b/spec/frontend/helpers/fake_request_animation_frame.js
@@ -0,0 +1,13 @@
+// eslint-disable-next-line import/prefer-default-export
+export const useFakeRequestAnimationFrame = () => {
+  let orig;
+
+  beforeEach(() => {
+    orig = global.requestAnimationFrame;
+    global.requestAnimationFrame = cb => cb();
+  });
+
+  afterEach(() => {
+    global.requestAnimationFrame = orig;
+  });
+};
diff --git a/spec/frontend/helpers/init_vue_mr_page_helper.js b/spec/frontend/helpers/init_vue_mr_page_helper.js
new file mode 100644
index 00000000000..c1d608cc5a0
--- /dev/null
+++ b/spec/frontend/helpers/init_vue_mr_page_helper.js
@@ -0,0 +1,46 @@
+import MockAdapter from 'axios-mock-adapter';
+import initMRPage from '~/mr_notes';
+import axios from '~/lib/utils/axios_utils';
+import { userDataMock, notesDataMock, noteableDataMock } from '../notes/mock_data';
+import diffFileMockData from '../diffs/mock_data/diff_file';
+
+export default function initVueMRPage() {
+  const mrTestEl = document.createElement('div');
+  mrTestEl.className = 'js-merge-request-test';
+  document.body.appendChild(mrTestEl);
+
+  const diffsAppEndpoint = '/diffs/app/endpoint';
+  const diffsAppProjectPath = 'testproject';
+  const mrEl = document.createElement('div');
+  mrEl.className = 'merge-request fixture-mr';
+  mrEl.setAttribute('data-mr-action', 'diffs');
+  mrTestEl.appendChild(mrEl);
+
+  const mrDiscussionsEl = document.createElement('div');
+  mrDiscussionsEl.id = 'js-vue-mr-discussions';
+  mrDiscussionsEl.setAttribute('data-current-user-data', JSON.stringify(userDataMock));
+  mrDiscussionsEl.setAttribute('data-noteable-data', JSON.stringify(noteableDataMock));
+  mrDiscussionsEl.setAttribute('data-notes-data', JSON.stringify(notesDataMock));
+  mrDiscussionsEl.setAttribute('data-noteable-type', 'merge-request');
+  mrTestEl.appendChild(mrDiscussionsEl);
+
+  const discussionCounterEl = document.createElement('div');
+  discussionCounterEl.id = 'js-vue-discussion-counter';
+  mrTestEl.appendChild(discussionCounterEl);
+
+  const diffsAppEl = document.createElement('div');
+  diffsAppEl.id = 'js-diffs-app';
+  diffsAppEl.setAttribute('data-endpoint', diffsAppEndpoint);
+  diffsAppEl.setAttribute('data-project-path', diffsAppProjectPath);
+  diffsAppEl.setAttribute('data-current-user-data', JSON.stringify(userDataMock));
+  mrTestEl.appendChild(diffsAppEl);
+
+  const mock = new MockAdapter(axios);
+  mock.onGet(diffsAppEndpoint).reply(200, {
+    branch_name: 'foo',
+    diff_files: [diffFileMockData],
+  });
+
+  initMRPage();
+  return mock;
+}
diff --git a/spec/frontend/helpers/monitor_helper_spec.js b/spec/frontend/helpers/monitor_helper_spec.js
index f7163d496d2..083b6404125 100644
--- a/spec/frontend/helpers/monitor_helper_spec.js
+++ b/spec/frontend/helpers/monitor_helper_spec.js
@@ -33,15 +33,6 @@ describe('monitor helper', () => {
       ]);
     });
 
-    it('excludes NaN values', () => {
-      expect(
-        monitorHelper.makeDataSeries(
-          data({ metric: {}, values: [[1, 1], [2, NaN]] }),
-          defaultConfig,
-        ),
-      ).toEqual([{ ...expectedDataSeries[0], data: [[1, 1]] }]);
-    });
-
     it('updates series name from templates', () => {
       const config = {
         ...defaultConfig,
diff --git a/spec/frontend/helpers/test_constants.js b/spec/frontend/helpers/test_constants.js
index c97d47a6406..69b78f556aa 100644
--- a/spec/frontend/helpers/test_constants.js
+++ b/spec/frontend/helpers/test_constants.js
@@ -1,7 +1,19 @@
-export const FIXTURES_PATH = `/fixtures`;
-export const TEST_HOST = 'http://test.host';
+const FIXTURES_PATH = `/fixtures`;
+const TEST_HOST = 'http://test.host';
 
-export const DUMMY_IMAGE_URL = `${FIXTURES_PATH}/static/images/one_white_pixel.png`;
+const DUMMY_IMAGE_URL = `${FIXTURES_PATH}/static/images/one_white_pixel.png`;
 
-export const GREEN_BOX_IMAGE_URL = `${FIXTURES_PATH}/static/images/green_box.png`;
-export const RED_BOX_IMAGE_URL = `${FIXTURES_PATH}/static/images/red_box.png`;
+const GREEN_BOX_IMAGE_URL = `${FIXTURES_PATH}/static/images/green_box.png`;
+const RED_BOX_IMAGE_URL = `${FIXTURES_PATH}/static/images/red_box.png`;
+
+// NOTE: module.exports is needed so that this file can be used
+// by environment.js
+//
+// eslint-disable-next-line import/no-commonjs
+module.exports = {
+  FIXTURES_PATH,
+  TEST_HOST,
+  DUMMY_IMAGE_URL,
+  GREEN_BOX_IMAGE_URL,
+  RED_BOX_IMAGE_URL,
+};
diff --git a/spec/frontend/helpers/vue_mock_directive.js b/spec/frontend/helpers/vue_mock_directive.js
index 699fe3eab26..28d4708835d 100644
--- a/spec/frontend/helpers/vue_mock_directive.js
+++ b/spec/frontend/helpers/vue_mock_directive.js
@@ -2,13 +2,21 @@ export const getKey = name => `$_gl_jest_${name}`;
 
 export const getBinding = (el, name) => el[getKey(name)];
 
+const writeBindingToElement = (el, { name, value, arg, modifiers }) => {
+  el[getKey(name)] = {
+    value,
+    arg,
+    modifiers,
+  };
+};
+
 export const createMockDirective = () => ({
-  bind(el, { name, value, arg, modifiers }) {
-    el[getKey(name)] = {
-      value,
-      arg,
-      modifiers,
-    };
+  bind(el, binding) {
+    writeBindingToElement(el, binding);
+  },
+
+  update(el, binding) {
+    writeBindingToElement(el, binding);
   },
 
   unbind(el, { name }) {
diff --git a/spec/frontend/helpers/wait_using_real_timer.js b/spec/frontend/helpers/wait_using_real_timer.js
new file mode 100644
index 00000000000..ddf23cd97b4
--- /dev/null
+++ b/spec/frontend/helpers/wait_using_real_timer.js
@@ -0,0 +1,7 @@
+/* useful for timing promises when jest fakeTimers are not reliable enough */
+export default timeout =>
+  new Promise(resolve => {
+    jest.useRealTimers();
+    setTimeout(resolve, timeout);
+    jest.useFakeTimers();
+  });