1 files changed, 37 insertions, 11 deletions
diff --git a/spec/javascripts/monitoring/dashboard_spec.js b/spec/javascripts/monitoring/dashboard_spec.js
index b1778029a77..454777fa912 100644
--- a/spec/javascripts/monitoring/dashboard_spec.js
+++ b/spec/javascripts/monitoring/dashboard_spec.js
@@ -33,6 +33,11 @@ describe('Dashboard', () => {
       <div class="layout-page"></div>
     `);
 
+    window.gon = {
+      ...window.gon,
+      ee: false,
+    };
+
     mock = new MockAdapter(axios);
     DashboardComponent = Vue.extend(Dashboard);
   });
@@ -98,7 +103,7 @@ describe('Dashboard', () => {
       });
     });
 
-    it('renders the dropdown with a number of environments', done => {
+    it('renders the environments dropdown with a number of environments', done => {
       const component = new DashboardComponent({
         el: document.querySelector('.prometheus-graphs'),
         propsData: { ...propsData, hasMetrics: true, showPanels: false },
@@ -107,14 +112,16 @@ describe('Dashboard', () => {
       component.store.storeEnvironmentsData(environmentData);
 
       setTimeout(() => {
-        const dropdownMenuEnvironments = component.$el.querySelectorAll('.dropdown-menu ul li a');
+        const dropdownMenuEnvironments = component.$el.querySelectorAll(
+          '.js-environments-dropdown .dropdown-item',
+        );
 
         expect(dropdownMenuEnvironments.length).toEqual(component.store.environmentsData.length);
         done();
       });
     });
 
-    it('hides the dropdown list when there is no environments', done => {
+    it('hides the environments dropdown list when there is no environments', done => {
       const component = new DashboardComponent({
         el: document.querySelector('.prometheus-graphs'),
         propsData: { ...propsData, hasMetrics: true, showPanels: false },
@@ -123,14 +130,16 @@ describe('Dashboard', () => {
       component.store.storeEnvironmentsData([]);
 
       setTimeout(() => {
-        const dropdownMenuEnvironments = component.$el.querySelectorAll('.dropdown-menu ul');
+        const dropdownMenuEnvironments = component.$el.querySelectorAll(
+          '.js-environments-dropdown .dropdown-item',
+        );
 
         expect(dropdownMenuEnvironments.length).toEqual(0);
         done();
       });
     });
 
-    it('renders the dropdown with a single is-active element', done => {
+    it('renders the environments dropdown with a single is-active element', done => {
       const component = new DashboardComponent({
         el: document.querySelector('.prometheus-graphs'),
         propsData: { ...propsData, hasMetrics: true, showPanels: false },
@@ -139,14 +148,31 @@ describe('Dashboard', () => {
       component.store.storeEnvironmentsData(environmentData);
 
       setTimeout(() => {
-        const dropdownIsActiveElement = component.$el.querySelectorAll(
-          '.dropdown-menu ul li a.is-active',
+        const dropdownItems = component.$el.querySelectorAll(
+          '.js-environments-dropdown .dropdown-item[active="true"]',
         );
 
-        expect(dropdownIsActiveElement.length).toEqual(1);
-        expect(dropdownIsActiveElement[0].textContent.trim()).toEqual(
-          component.currentEnvironmentName,
-        );
+        expect(dropdownItems.length).toEqual(1);
+        expect(dropdownItems[0].textContent.trim()).toEqual(component.currentEnvironmentName);
+        done();
+      });
+    });
+
+    it('hides the dropdown', done => {
+      const component = new DashboardComponent({
+        el: document.querySelector('.prometheus-graphs'),
+        propsData: {
+          ...propsData,
+          hasMetrics: true,
+          showPanels: false,
+          environmentsEndpoint: '',
+        },
+      });
+
+      Vue.nextTick(() => {
+        const dropdownIsActiveElement = component.$el.querySelectorAll('.environments');
+
+        expect(dropdownIsActiveElement.length).toEqual(0);
         done();
       });
     });