1 files changed, 141 insertions, 0 deletions
diff --git a/spec/frontend/importer_status_spec.js b/spec/frontend/importer_status_spec.js
new file mode 100644
index 00000000000..4ef74a2fe84
--- /dev/null
+++ b/spec/frontend/importer_status_spec.js
@@ -0,0 +1,141 @@
+import MockAdapter from 'axios-mock-adapter';
+import { ImporterStatus } from '~/importer_status';
+import axios from '~/lib/utils/axios_utils';
+
+describe('Importer Status', () => {
+  let instance;
+  let mock;
+
+  beforeEach(() => {
+    mock = new MockAdapter(axios);
+  });
+
+  afterEach(() => {
+    mock.restore();
+  });
+
+  describe('addToImport', () => {
+    const importUrl = '/import_url';
+    const fixtures = `
+      <table>
+        <tr id="repo_123">
+          <td class="import-target"></td>
+          <td class="import-actions job-status">
+            <button name="button" type="submit" class="btn btn-import js-add-to-import">
+            </button>
+          </td>
+        </tr>
+      </table>
+    `;
+
+    beforeEach(() => {
+      setFixtures(fixtures);
+      jest.spyOn(ImporterStatus.prototype, 'initStatusPage').mockImplementation(() => {});
+      jest.spyOn(ImporterStatus.prototype, 'setAutoUpdate').mockImplementation(() => {});
+      instance = new ImporterStatus({
+        jobsUrl: '',
+        importUrl,
+      });
+    });
+
+    it('sets table row to active after post request', done => {
+      mock.onPost(importUrl).reply(200, {
+        id: 1,
+        full_path: '/full_path',
+      });
+
+      instance
+        .addToImport({
+          currentTarget: document.querySelector('.js-add-to-import'),
+        })
+        .then(() => {
+          expect(document.querySelector('tr').classList.contains('table-active')).toEqual(true);
+          done();
+        })
+        .catch(done.fail);
+    });
+
+    it('shows error message after failed POST request', done => {
+      setFixtures(`${fixtures}<div class="flash-container"></div>`);
+
+      mock.onPost(importUrl).reply(422, {
+        errors: 'You forgot your lunch',
+      });
+
+      instance
+        .addToImport({
+          currentTarget: document.querySelector('.js-add-to-import'),
+        })
+        .then(() => {
+          const flashMessage = document.querySelector('.flash-text');
+
+          expect(flashMessage.textContent.trim()).toEqual(
+            'An error occurred while importing project: You forgot your lunch',
+          );
+          done();
+        })
+        .catch(done.fail);
+    });
+  });
+
+  describe('autoUpdate', () => {
+    const jobsUrl = '/jobs_url';
+
+    beforeEach(() => {
+      const div = document.createElement('div');
+      div.innerHTML = `
+        <div id="project_1">
+          <div class="job-status">
+          </div>
+        </div>
+      `;
+
+      document.body.appendChild(div);
+
+      jest.spyOn(ImporterStatus.prototype, 'initStatusPage').mockImplementation(() => {});
+      jest.spyOn(ImporterStatus.prototype, 'setAutoUpdate').mockImplementation(() => {});
+      instance = new ImporterStatus({
+        jobsUrl,
+      });
+    });
+
+    function setupMock(importStatus) {
+      mock.onGet(jobsUrl).reply(200, [
+        {
+          id: 1,
+          import_status: importStatus,
+        },
+      ]);
+    }
+
+    function expectJobStatus(done, status) {
+      instance
+        .autoUpdate()
+        .then(() => {
+          expect(document.querySelector('#project_1').innerText.trim()).toEqual(status);
+          done();
+        })
+        .catch(done.fail);
+    }
+
+    it('sets the job status to done', done => {
+      setupMock('finished');
+      expectJobStatus(done, 'Done');
+    });
+
+    it('sets the job status to scheduled', done => {
+      setupMock('scheduled');
+      expectJobStatus(done, 'Scheduled');
+    });
+
+    it('sets the job status to started', done => {
+      setupMock('started');
+      expectJobStatus(done, 'Started');
+    });
+
+    it('sets the job status to custom status', done => {
+      setupMock('custom status');
+      expectJobStatus(done, 'custom status');
+    });
+  });
+});