Merge branch 'ee-10026-folder-ee' into 'master'

EE: Removes EE differences for folder_view

See merge request gitlab-org/gitlab-ee!9981

app/assets/javascripts/environments/folder/environments_folder_view.vue

 <script>
+import folderMixin from 'ee_else_ce/environments/mixins/environments_folder_view_mixin';
 import environmentsMixin from '../mixins/environments_mixin';
 import CIPaginationMixin from '../../vue_shared/mixins/ci_pagination_api_mixin';
 import StopEnvironmentModal from '../components/stop_environment_modal.vue';
@@ -8,7 +9,7 @@ export default {
     StopEnvironmentModal,
   },
 
-  mixins: [environmentsMixin, CIPaginationMixin],
+  mixins: [environmentsMixin, CIPaginationMixin, folderMixin],
 
   props: {
     endpoint: {
@@ -27,28 +28,6 @@ export default {
       type: Boolean,
       required: true,
     },
-    // ee-only start
-    canaryDeploymentFeatureId: {
-      type: String,
-      required: true,
-    },
-    showCanaryDeploymentCallout: {
-      type: Boolean,
-      required: true,
-    },
-    userCalloutsPath: {
-      type: String,
-      required: true,
-    },
-    lockPromotionSvgPath: {
-      type: String,
-      required: true,
-    },
-    helpCanaryDeploymentsPath: {
-      type: String,
-      required: true,
-    },
-    // ee-only end
   },
   methods: {
     successCallback(resp) {
@@ -63,7 +42,8 @@ export default {
 
     <div v-if="!isLoading" class="top-area">
       <h4 class="js-folder-name environments-folder-name">
-        {{ s__('Environments|Environments') }} / <b>{{ folderName }}</b>
+        {{ s__('Environments|Environments') }} /
+        <b>{{ folderName }}</b>
       </h4>
 
       <tabs :tabs="tabs" scope="environments" @onChangeTab="onChangeTab" />

app/assets/javascripts/environments/mixins/environments_folder_view_mixin.js

+export default {
+  props: {
+    canaryDeploymentFeatureId: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    showCanaryDeploymentCallout: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    userCalloutsPath: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    lockPromotionSvgPath: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    helpCanaryDeploymentsPath: {
+      type: String,
+      required: false,
+      default: '',
+    },
+  },
+};

ee/app/assets/javascripts/environments/mixins/environments_folder_view_mixin.js

+export default {
+  props: {
+    canaryDeploymentFeatureId: {
+      type: String,
+      required: true,
+    },
+    showCanaryDeploymentCallout: {
+      type: Boolean,
+      required: true,
+    },
+    userCalloutsPath: {
+      type: String,
+      required: true,
+    },
+    lockPromotionSvgPath: {
+      type: String,
+      required: true,
+    },
+    helpCanaryDeploymentsPath: {
+      type: String,
+      required: true,
+    },
+  },
+};

ee/spec/javascripts/environments/environments_folder_view_spec.js

+import Vue from 'vue';
+import MockAdapter from 'axios-mock-adapter';
+import axios from '~/lib/utils/axios_utils';
+import environmentsFolderViewComponent from '~/environments/folder/environments_folder_view.vue';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
+import { environmentsList } from 'spec/environments/mock_data';
+
+describe('Environments Folder View', () => {
+  let Component;
+  let component;
+  let mock;
+
+  const mockData = {
+    endpoint: 'environments.json',
+    folderName: 'review',
+    canReadEnvironment: true,
+    cssContainerClass: 'container',
+    canaryDeploymentFeatureId: 'canary_deployment',
+    showCanaryDeploymentCallout: true,
+    userCalloutsPath: '/callouts',
+    lockPromotionSvgPath: '/assets/illustrations/lock-promotion.svg',
+    helpCanaryDeploymentsPath: 'help/canary-deployments',
+  };
+
+  beforeEach(() => {
+    mock = new MockAdapter(axios);
+
+    Component = Vue.extend(environmentsFolderViewComponent);
+  });
+
+  afterEach(() => {
+    mock.restore();
+
+    component.$destroy();
+  });
+
+  describe('successful request', () => {
+    beforeEach(() => {
+      mock.onGet(mockData.endpoint).reply(
+        200,
+        {
+          environments: environmentsList,
+          stopped_count: 1,
+          available_count: 0,
+        },
+        {
+          'X-nExt-pAge': '2',
+          'x-page': '1',
+          'X-Per-Page': '2',
+          'X-Prev-Page': '',
+          'X-TOTAL': '20',
+          'X-Total-Pages': '10',
+        },
+      );
+
+      component = mountComponent(Component, mockData);
+    });
+
+    describe('deploy boards', () => {
+      it('should render arrow to open deploy boards', done => {
+        setTimeout(() => {
+          expect(component.$el.querySelector('.folder-icon.ic-chevron-right')).not.toBeNull();
+          done();
+        }, 0);
+      });
+    });
+  });
+});

spec/javascripts/environments/folder/environments_folder_view_spec.js

@@ -3,6 +3,7 @@ import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
 import environmentsFolderViewComponent from '~/environments/folder/environments_folder_view.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
+import { removeBreakLine, removeWhitespace } from 'spec/helpers/vue_component_helper';
 import { environmentsList } from '../mock_data';
 
 describe('Environments Folder View', () => {
@@ -15,13 +16,11 @@ describe('Environments Folder View', () => {
     folderName: 'review',
     canReadEnvironment: true,
     cssContainerClass: 'container',
-    // ee-only start
     canaryDeploymentFeatureId: 'canary_deployment',
     showCanaryDeploymentCallout: true,
     userCalloutsPath: '/callouts',
     lockPromotionSvgPath: '/assets/illustrations/lock-promotion.svg',
     helpCanaryDeploymentsPath: 'help/canary-deployments',
-    // ee-only end
   };
 
   beforeEach(() => {
@@ -96,9 +95,11 @@ describe('Environments Folder View', () => {
 
     it('should render parent folder name', done => {
       setTimeout(() => {
-        expect(component.$el.querySelector('.js-folder-name').textContent.trim()).toContain(
-          'Environments / review',
-        );
+        expect(
+          removeBreakLine(
+            removeWhitespace(component.$el.querySelector('.js-folder-name').textContent.trim()),
+          ),
+        ).toContain('Environments / review');
         done();
       }, 0);
     });
@@ -134,15 +135,6 @@ describe('Environments Folder View', () => {
         });
       });
     });
-
-    describe('deploy boards', () => {
-      it('should render arrow to open deploy boards', done => {
-        setTimeout(() => {
-          expect(component.$el.querySelector('.folder-icon.ic-chevron-right')).not.toBeNull();
-          done();
-        }, 0);
-      });
-    });
   });
 
   describe('unsuccessfull request', () => {