1 files changed, 35 insertions, 4 deletions

diff --git a/spec/frontend/ci/ci_variable_list/components/ci_variable_settings_spec.js b/spec/frontend/ci/ci_variable_list/components/ci_variable_settings_spec.js
index 79dd638e2bd..04145c2c6aa 100644
--- a/spec/frontend/ci/ci_variable_list/components/ci_variable_settings_spec.js
+++ b/spec/frontend/ci/ci_variable_list/components/ci_variable_settings_spec.js
@@ -23,7 +23,6 @@ describe('Ci variable table', () => {
     environments: mapEnvironmentNames(mockEnvs),
     hideEnvironmentScope: false,
     isLoading: false,
-    hasEnvScopeQuery: false,
     maxVariableLimit: 5,
     pageInfo: { after: '' },
     variables: mockVariablesWithScopes(projectString),
@@ -70,7 +69,6 @@ describe('Ci variable table', () => {
         areEnvironmentsLoading: defaultProps.areEnvironmentsLoading,
         areScopedVariablesAvailable: defaultProps.areScopedVariablesAvailable,
         environments: defaultProps.environments,
-        hasEnvScopeQuery: defaultProps.hasEnvScopeQuery,
         hideEnvironmentScope: defaultProps.hideEnvironmentScope,
         variables: defaultProps.variables,
         mode: ADD_VARIABLE_ACTION,
@@ -142,7 +140,7 @@ describe('Ci variable table', () => {
     });
   });
 
-  describe('variable events', () => {
+  describe('variable events for modal', () => {
     beforeEach(() => {
       createComponent();
     });
@@ -161,6 +159,25 @@ describe('Ci variable table', () => {
     });
   });
 
+  describe('variable events for drawer', () => {
+    beforeEach(() => {
+      createComponent({ featureFlags: { ciVariableDrawer: true } });
+    });
+
+    it.each`
+      eventName
+      ${'add-variable'}
+      ${'update-variable'}
+      ${'delete-variable'}
+    `('bubbles up the $eventName event', async ({ eventName }) => {
+      await findCiVariableTable().vm.$emit('set-selected-variable');
+
+      await findCiVariableDrawer().vm.$emit(eventName, newVariable);
+
+      expect(wrapper.emitted(eventName)).toEqual([[newVariable]]);
+    });
+  });
+
   describe('pages events', () => {
     beforeEach(() => {
       createComponent();
@@ -178,7 +195,7 @@ describe('Ci variable table', () => {
     });
   });
 
-  describe('environment events', () => {
+  describe('environment events for modal', () => {
     beforeEach(() => {
       createComponent();
     });
@@ -191,4 +208,18 @@ describe('Ci variable table', () => {
       expect(wrapper.emitted('search-environment-scope')).toEqual([['staging']]);
     });
   });
+
+  describe('environment events for drawer', () => {
+    beforeEach(() => {
+      createComponent({ featureFlags: { ciVariableDrawer: true } });
+    });
+
+    it('bubbles up the search event', async () => {
+      await findCiVariableTable().vm.$emit('set-selected-variable');
+
+      await findCiVariableDrawer().vm.$emit('search-environment-scope', 'staging');
+
+      expect(wrapper.emitted('search-environment-scope')).toEqual([['staging']]);
+    });
+  });
 });