Add latest changes from gitlab-org/gitlab@master

5 files changed, 168 insertions, 10 deletions

diff --git a/spec/frontend/clusters/clusters_bundle_spec.js b/spec/frontend/clusters/clusters_bundle_spec.js
index 317d3f3012b..199e11401a9 100644
--- a/spec/frontend/clusters/clusters_bundle_spec.js
+++ b/spec/frontend/clusters/clusters_bundle_spec.js
@@ -286,16 +286,21 @@ describe('Clusters', () => {
   });
 
   describe('installApplication', () => {
-    it.each(APPLICATIONS)('tries to install %s', applicationId => {
-      jest.spyOn(cluster.service, 'installApplication').mockResolvedValueOnce();
+    it.each(APPLICATIONS)('tries to install %s', (applicationId, done) => {
+      jest.spyOn(cluster.service, 'installApplication').mockResolvedValue();
 
       cluster.store.state.applications[applicationId].status = INSTALLABLE;
 
-      cluster.installApplication({ id: applicationId });
-
-      expect(cluster.store.state.applications[applicationId].status).toEqual(INSTALLING);
-      expect(cluster.store.state.applications[applicationId].requestReason).toEqual(null);
-      expect(cluster.service.installApplication).toHaveBeenCalledWith(applicationId, undefined);
+      // eslint-disable-next-line promise/valid-params
+      cluster
+        .installApplication({ id: applicationId })
+        .then(() => {
+          expect(cluster.store.state.applications[applicationId].status).toEqual(INSTALLING);
+          expect(cluster.store.state.applications[applicationId].requestReason).toEqual(null);
+          expect(cluster.service.installApplication).toHaveBeenCalledWith(applicationId, undefined);
+          done();
+        })
+        .catch();
     });
 
     it('sets error request status when the request fails', () => {
diff --git a/spec/frontend/clusters/components/applications_spec.js b/spec/frontend/clusters/components/applications_spec.js
index a9435cef774..49bda9539fd 100644
--- a/spec/frontend/clusters/components/applications_spec.js
+++ b/spec/frontend/clusters/components/applications_spec.js
@@ -6,6 +6,7 @@ import { APPLICATIONS_MOCK_STATE } from '../services/mock_data';
 import eventHub from '~/clusters/event_hub';
 import { shallowMount } from '@vue/test-utils';
 import KnativeDomainEditor from '~/clusters/components/knative_domain_editor.vue';
+import CrossplaneProviderStack from '~/clusters/components/crossplane_provider_stack.vue';
 
 describe('Applications', () => {
   let vm;
@@ -16,6 +17,7 @@ describe('Applications', () => {
 
     gon.features = gon.features || {};
     gon.features.enableClusterApplicationElasticStack = true;
+    gon.features.enableClusterApplicationCrossplane = true;
   });
 
   afterEach(() => {
@@ -42,6 +44,10 @@ describe('Applications', () => {
       expect(vm.$el.querySelector('.js-cluster-application-row-cert_manager')).not.toBeNull();
     });
 
+    it('renders a row for Crossplane', () => {
+      expect(vm.$el.querySelector('.js-cluster-application-row-crossplane')).not.toBeNull();
+    });
+
     it('renders a row for Prometheus', () => {
       expect(vm.$el.querySelector('.js-cluster-application-row-prometheus')).not.toBeNull();
     });
@@ -83,6 +89,10 @@ describe('Applications', () => {
       expect(vm.$el.querySelector('.js-cluster-application-row-cert_manager')).not.toBeNull();
     });
 
+    it('renders a row for Crossplane', () => {
+      expect(vm.$el.querySelector('.js-cluster-application-row-crossplane')).not.toBeNull();
+    });
+
     it('renders a row for Prometheus', () => {
       expect(vm.$el.querySelector('.js-cluster-application-row-prometheus')).not.toBeNull();
     });
@@ -124,6 +134,10 @@ describe('Applications', () => {
       expect(vm.$el.querySelector('.js-cluster-application-row-cert_manager')).not.toBeNull();
     });
 
+    it('renders a row for Crossplane', () => {
+      expect(vm.$el.querySelector('.js-cluster-application-row-crossplane')).not.toBeNull();
+    });
+
     it('renders a row for Prometheus', () => {
       expect(vm.$el.querySelector('.js-cluster-application-row-prometheus')).not.toBeNull();
     });
@@ -179,6 +193,7 @@ describe('Applications', () => {
               },
               helm: { title: 'Helm Tiller' },
               cert_manager: { title: 'Cert-Manager' },
+              crossplane: { title: 'Crossplane', stack: '' },
               runner: { title: 'GitLab Runner' },
               prometheus: { title: 'Prometheus' },
               jupyter: { title: 'JupyterHub', hostname: '' },
@@ -390,6 +405,32 @@ describe('Applications', () => {
     });
   });
 
+  describe('Crossplane application', () => {
+    const propsData = {
+      applications: {
+        ...APPLICATIONS_MOCK_STATE,
+        crossplane: {
+          title: 'Crossplane',
+          stack: {
+            code: '',
+          },
+        },
+      },
+    };
+
+    let wrapper;
+    beforeEach(() => {
+      wrapper = shallowMount(Applications, { propsData });
+    });
+    afterEach(() => {
+      wrapper.destroy();
+    });
+    it('renders the correct Component', () => {
+      const crossplane = wrapper.find(CrossplaneProviderStack);
+      expect(crossplane.exists()).toBe(true);
+    });
+  });
+
   describe('Elastic Stack application', () => {
     describe('with ingress installed with ip & elastic stack installable', () => {
       it('renders hostname active input', () => {
diff --git a/spec/frontend/clusters/services/crossplane_provider_stack_spec.js b/spec/frontend/clusters/services/crossplane_provider_stack_spec.js
new file mode 100644
index 00000000000..0d234822d7b
--- /dev/null
+++ b/spec/frontend/clusters/services/crossplane_provider_stack_spec.js
@@ -0,0 +1,78 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlDropdownItem } from '@gitlab/ui';
+import CrossplaneProviderStack from '~/clusters/components/crossplane_provider_stack.vue';
+
+describe('CrossplaneProviderStack component', () => {
+  let wrapper;
+
+  const defaultProps = {
+    stacks: [
+      {
+        name: 'Google Cloud Platform',
+        code: 'gcp',
+      },
+      {
+        name: 'Amazon Web Services',
+        code: 'aws',
+      },
+    ],
+  };
+
+  function createComponent(props = {}) {
+    const propsData = {
+      ...defaultProps,
+      ...props,
+    };
+
+    wrapper = shallowMount(CrossplaneProviderStack, {
+      propsData,
+    });
+  }
+
+  beforeEach(() => {
+    const crossplane = {
+      title: 'crossplane',
+      stack: '',
+    };
+    createComponent({ crossplane });
+  });
+
+  const findDropdownElements = () => wrapper.findAll(GlDropdownItem);
+  const findFirstDropdownElement = () => findDropdownElements().at(0);
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  it('renders all of the available stacks in the dropdown', () => {
+    const dropdownElements = findDropdownElements();
+
+    expect(dropdownElements.length).toBe(defaultProps.stacks.length);
+
+    defaultProps.stacks.forEach((stack, index) =>
+      expect(dropdownElements.at(index).text()).toEqual(stack.name),
+    );
+  });
+
+  it('displays the correct label for the first dropdown item if a stack is selected', () => {
+    const crossplane = {
+      title: 'crossplane',
+      stack: 'gcp',
+    };
+    createComponent({ crossplane });
+    expect(wrapper.vm.dropdownText).toBe('Google Cloud Platform');
+  });
+
+  it('emits the "set" event with the selected stack value', () => {
+    const crossplane = {
+      title: 'crossplane',
+      stack: 'gcp',
+    };
+    createComponent({ crossplane });
+    findFirstDropdownElement().vm.$emit('click');
+    expect(wrapper.emitted().set[0][0].code).toEqual('gcp');
+  });
+  it('it renders the correct dropdown text when no stack is selected', () => {
+    expect(wrapper.vm.dropdownText).toBe('Select Stack');
+  });
+});
diff --git a/spec/frontend/clusters/services/mock_data.js b/spec/frontend/clusters/services/mock_data.js
index e6feb89eecb..016f5a259b5 100644
--- a/spec/frontend/clusters/services/mock_data.js
+++ b/spec/frontend/clusters/services/mock_data.js
@@ -53,8 +53,14 @@ const CLUSTERS_MOCK_DATA = {
             can_uninstall: false,
           },
           {
+            name: 'crossplane',
+            status: APPLICATION_STATUS.ERROR,
+            status_reason: 'Cannot connect',
+            can_uninstall: false,
+          },
+          {
             name: 'elastic_stack',
-            status: APPLICATION_STATUS.INSTALLING,
+            status: APPLICATION_STATUS.ERROR,
             status_reason: 'Cannot connect',
             can_uninstall: false,
           },
@@ -105,6 +111,12 @@ const CLUSTERS_MOCK_DATA = {
             email: 'test@example.com',
           },
           {
+            name: 'crossplane',
+            status: APPLICATION_STATUS.ERROR,
+            status_reason: 'Cannot connect',
+            stack: 'gcp',
+          },
+          {
             name: 'elastic_stack',
             status: APPLICATION_STATUS.ERROR,
             status_reason: 'Cannot connect',
@@ -116,6 +128,7 @@ const CLUSTERS_MOCK_DATA = {
   POST: {
     '/gitlab-org/gitlab-shell/clusters/1/applications/helm': {},
     '/gitlab-org/gitlab-shell/clusters/1/applications/ingress': {},
+    '/gitlab-org/gitlab-shell/clusters/1/applications/crossplane': {},
     '/gitlab-org/gitlab-shell/clusters/1/applications/cert_manager': {},
     '/gitlab-org/gitlab-shell/clusters/1/applications/runner': {},
     '/gitlab-org/gitlab-shell/clusters/1/applications/prometheus': {},
@@ -138,6 +151,7 @@ const DEFAULT_APPLICATION_STATE = {
 const APPLICATIONS_MOCK_STATE = {
   helm: { title: 'Helm Tiller', status: 'installable' },
   ingress: { title: 'Ingress', status: 'installable' },
+  crossplane: { title: 'Crossplane', status: 'installable', stack: '' },
   cert_manager: { title: 'Cert-Manager', status: 'installable' },
   runner: { title: 'GitLab Runner' },
   prometheus: { title: 'Prometheus' },
diff --git a/spec/frontend/clusters/stores/clusters_store_spec.js b/spec/frontend/clusters/stores/clusters_store_spec.js
index 0e18a05f6c2..71d4daceb75 100644
--- a/spec/frontend/clusters/stores/clusters_store_spec.js
+++ b/spec/frontend/clusters/stores/clusters_store_spec.js
@@ -71,6 +71,7 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
           },
           ingress: {
             title: 'Ingress',
@@ -84,6 +85,7 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
           },
           runner: {
             title: 'GitLab Runner',
@@ -100,6 +102,7 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
           },
           prometheus: {
             title: 'Prometheus',
@@ -111,6 +114,7 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
           },
           jupyter: {
             title: 'JupyterHub',
@@ -123,6 +127,7 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
           },
           knative: {
             title: 'Knative',
@@ -140,6 +145,7 @@ describe('Clusters Store', () => {
             uninstallFailed: false,
             updateSuccessful: false,
             updateFailed: false,
+            validationError: null,
           },
           cert_manager: {
             title: 'Cert-Manager',
@@ -152,11 +158,12 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
           },
           elastic_stack: {
             title: 'Elastic Stack',
-            status: mockResponseData.applications[7].status,
-            installFailed: false,
+            status: APPLICATION_STATUS.INSTALLABLE,
+            installFailed: true,
             statusReason: mockResponseData.applications[7].status_reason,
             requestReason: null,
             kibana_hostname: '',
@@ -164,6 +171,19 @@ describe('Clusters Store', () => {
             uninstallable: false,
             uninstallSuccessful: false,
             uninstallFailed: false,
+            validationError: null,
+          },
+          crossplane: {
+            title: 'Crossplane',
+            status: APPLICATION_STATUS.INSTALLABLE,
+            installFailed: true,
+            statusReason: mockResponseData.applications[8].status_reason,
+            requestReason: null,
+            installed: false,
+            uninstallable: false,
+            uninstallSuccessful: false,
+            uninstallFailed: false,
+            validationError: null,
           },
         },
         environments: [],