Add latest changes from gitlab-org/gitlab@master

2 files changed, 155 insertions, 2 deletions

diff --git a/spec/frontend/ide/init_gitlab_web_ide_spec.js b/spec/frontend/ide/init_gitlab_web_ide_spec.js
index ae4d8d6d947..3b5b1ede28c 100644
--- a/spec/frontend/ide/init_gitlab_web_ide_spec.js
+++ b/spec/frontend/ide/init_gitlab_web_ide_spec.js
@@ -1,8 +1,13 @@
 import { start } from '@gitlab/web-ide';
 import { initGitlabWebIDE } from '~/ide/init_gitlab_web_ide';
+import { confirmAction } from '~/lib/utils/confirm_via_gl_modal/confirm_action';
+import { createAndSubmitForm } from '~/lib/utils/create_and_submit_form';
 import { TEST_HOST } from 'helpers/test_constants';
+import waitForPromises from 'helpers/wait_for_promises';
 
 jest.mock('@gitlab/web-ide');
+jest.mock('~/lib/utils/confirm_via_gl_modal/confirm_action');
+jest.mock('~/lib/utils/create_and_submit_form');
 
 const ROOT_ELEMENT_ID = 'ide';
 const TEST_NONCE = 'test123nonce';
@@ -10,8 +15,16 @@ const TEST_PROJECT_PATH = 'group1/project1';
 const TEST_BRANCH_NAME = '12345-foo-patch';
 const TEST_GITLAB_URL = 'https://test-gitlab/';
 const TEST_GITLAB_WEB_IDE_PUBLIC_PATH = 'test/webpack/assets/gitlab-web-ide/public/path';
+const TEST_IDE_REMOTE_PATH = '/-/ide/remote/:remote_host/:remote_path';
+const TEST_START_REMOTE_PARAMS = {
+  remoteHost: 'dev.example.gitlab.com/test',
+  remotePath: '/test/projects/f oo',
+  connectionToken: '123abc',
+};
 
 describe('ide/init_gitlab_web_ide', () => {
+  let resolveConfirm;
+
   const createRootElement = () => {
     const el = document.createElement('div');
 
@@ -21,19 +34,32 @@ describe('ide/init_gitlab_web_ide', () => {
     el.dataset.projectPath = TEST_PROJECT_PATH;
     el.dataset.cspNonce = TEST_NONCE;
     el.dataset.branchName = TEST_BRANCH_NAME;
+    el.dataset.ideRemotePath = TEST_IDE_REMOTE_PATH;
 
     document.body.append(el);
   };
   const findRootElement = () => document.getElementById(ROOT_ELEMENT_ID);
-  const act = () => initGitlabWebIDE(findRootElement());
+  const createSubject = () => initGitlabWebIDE(findRootElement());
+  const triggerHandleStartRemote = (startRemoteParams) => {
+    const [, config] = start.mock.calls[0];
+
+    config.handleStartRemote(startRemoteParams);
+  };
 
   beforeEach(() => {
     process.env.GITLAB_WEB_IDE_PUBLIC_PATH = TEST_GITLAB_WEB_IDE_PUBLIC_PATH;
     window.gon.gitlab_url = TEST_GITLAB_URL;
 
+    confirmAction.mockImplementation(
+      () =>
+        new Promise((resolve) => {
+          resolveConfirm = resolve;
+        }),
+    );
+
     createRootElement();
 
-    act();
+    createSubject();
   });
 
   afterEach(() => {
@@ -48,6 +74,7 @@ describe('ide/init_gitlab_web_ide', () => {
       ref: TEST_BRANCH_NAME,
       gitlabUrl: TEST_GITLAB_URL,
       nonce: TEST_NONCE,
+      handleStartRemote: expect.any(Function),
     });
   });
 
@@ -59,4 +86,39 @@ describe('ide/init_gitlab_web_ide', () => {
       '<div id="ide" class="gl--flex-center gl-relative gl-h-full"></div>',
     );
   });
+
+  describe('when handleStartRemote is triggered', () => {
+    beforeEach(() => {
+      triggerHandleStartRemote(TEST_START_REMOTE_PARAMS);
+    });
+
+    it('promts for confirm', () => {
+      expect(confirmAction).toHaveBeenCalledWith(expect.any(String), {
+        primaryBtnText: expect.any(String),
+        cancelBtnText: expect.any(String),
+      });
+    });
+
+    it('does not submit, when not confirmed', async () => {
+      resolveConfirm(false);
+
+      await waitForPromises();
+
+      expect(createAndSubmitForm).not.toHaveBeenCalled();
+    });
+
+    it('submits, when confirmed', async () => {
+      resolveConfirm(true);
+
+      await waitForPromises();
+
+      expect(createAndSubmitForm).toHaveBeenCalledWith({
+        url: '/-/ide/remote/dev.example.gitlab.com%2Ftest/test/projects/f%20oo',
+        data: {
+          connection_token: TEST_START_REMOTE_PARAMS.connectionToken,
+          return_url: window.location.href,
+        },
+      });
+    });
+  });
 });
diff --git a/spec/frontend/ide/remote/index_spec.js b/spec/frontend/ide/remote/index_spec.js
new file mode 100644
index 00000000000..0f23b0a4e45
--- /dev/null
+++ b/spec/frontend/ide/remote/index_spec.js
@@ -0,0 +1,91 @@
+import { startRemote } from '@gitlab/web-ide';
+import { getBaseConfig, setupRootElement } from '~/ide/lib/gitlab_web_ide';
+import { mountRemoteIDE } from '~/ide/remote';
+import { TEST_HOST } from 'helpers/test_constants';
+import { useMockLocationHelper } from 'helpers/mock_window_location_helper';
+
+jest.mock('@gitlab/web-ide');
+jest.mock('~/ide/lib/gitlab_web_ide');
+
+const TEST_DATA = {
+  remoteHost: 'example.com:3443',
+  remotePath: 'test/path/gitlab',
+  cspNonce: 'just7some8noncense',
+  connectionToken: 'connectAtoken',
+  returnUrl: 'https://example.com/return',
+};
+
+const TEST_BASE_CONFIG = {
+  gitlabUrl: '/test/gitlab',
+};
+
+const TEST_RETURN_URL_SAME_ORIGIN = `${TEST_HOST}/foo/example`;
+
+describe('~/ide/remote/index', () => {
+  useMockLocationHelper();
+  const originalHref = window.location.href;
+
+  let el;
+  let rootEl;
+
+  beforeEach(() => {
+    el = document.createElement('div');
+    Object.entries(TEST_DATA).forEach(([key, value]) => {
+      el.dataset[key] = value;
+    });
+
+    // Stub setupRootElement so we can assert on return element
+    rootEl = document.createElement('div');
+    setupRootElement.mockReturnValue(rootEl);
+
+    // Stub getBaseConfig so we can assert
+    getBaseConfig.mockReturnValue(TEST_BASE_CONFIG);
+  });
+
+  describe('default', () => {
+    beforeEach(() => {
+      mountRemoteIDE(el);
+    });
+
+    it('calls startRemote', () => {
+      expect(startRemote).toHaveBeenCalledWith(rootEl, {
+        ...TEST_BASE_CONFIG,
+        nonce: TEST_DATA.cspNonce,
+        connectionToken: TEST_DATA.connectionToken,
+        remoteAuthority: `/${TEST_DATA.remoteHost}`,
+        hostPath: `/${TEST_DATA.remotePath}`,
+        handleError: expect.any(Function),
+        handleClose: expect.any(Function),
+      });
+    });
+  });
+
+  describe.each`
+    returnUrl                      | fnName           | reloadExpectation | hrefExpectation
+    ${TEST_DATA.returnUrl}         | ${'handleError'} | ${1}              | ${originalHref}
+    ${TEST_DATA.returnUrl}         | ${'handleClose'} | ${1}              | ${originalHref}
+    ${TEST_RETURN_URL_SAME_ORIGIN} | ${'handleClose'} | ${0}              | ${TEST_RETURN_URL_SAME_ORIGIN}
+    ${TEST_RETURN_URL_SAME_ORIGIN} | ${'handleError'} | ${0}              | ${TEST_RETURN_URL_SAME_ORIGIN}
+    ${''}                          | ${'handleClose'} | ${1}              | ${originalHref}
+  `(
+    'with returnUrl=$returnUrl and fn=$fnName',
+    ({ returnUrl, fnName, reloadExpectation, hrefExpectation }) => {
+      beforeEach(() => {
+        el.dataset.returnUrl = returnUrl;
+
+        mountRemoteIDE(el);
+      });
+
+      it('changes location', () => {
+        expect(window.location.reload).not.toHaveBeenCalled();
+
+        const [, config] = startRemote.mock.calls[0];
+
+        config[fnName]();
+
+        expect(window.location.reload).toHaveBeenCalledTimes(reloadExpectation);
+        expect(window.location.href).toBe(hrefExpectation);
+      });
+    },
+  );
+});