1 files changed, 22 insertions, 41 deletions

diff --git a/spec/frontend/search/sidebar/components/status_filter_spec.js b/spec/frontend/search/sidebar/components/status_filter_spec.js
index f3152c014b6..2ed199469e6 100644
--- a/spec/frontend/search/sidebar/components/status_filter_spec.js
+++ b/spec/frontend/search/sidebar/components/status_filter_spec.js
@@ -1,39 +1,16 @@
 import { shallowMount } from '@vue/test-utils';
-import Vue from 'vue';
-import Vuex from 'vuex';
-import { MOCK_QUERY } from 'jest/search/mock_data';
 import RadioFilter from '~/search/sidebar/components/radio_filter.vue';
 import StatusFilter from '~/search/sidebar/components/status_filter.vue';
 
-Vue.use(Vuex);
-
 describe('StatusFilter', () => {
   let wrapper;
 
-  const actionSpies = {
-    applyQuery: jest.fn(),
-    resetQuery: jest.fn(),
-  };
-
-  const createComponent = (initialState) => {
-    const store = new Vuex.Store({
-      state: {
-        query: MOCK_QUERY,
-        ...initialState,
-      },
-      actions: actionSpies,
-    });
-
+  const createComponent = (initProps) => {
     wrapper = shallowMount(StatusFilter, {
-      store,
+      ...initProps,
     });
   };
 
-  afterEach(() => {
-    wrapper.destroy();
-    wrapper = null;
-  });
-
   const findRadioFilter = () => wrapper.findComponent(RadioFilter);
 
   describe('template', () => {
@@ -41,24 +18,28 @@ describe('StatusFilter', () => {
       createComponent();
     });
 
-    describe.each`
-      scope               | showFilter
-      ${'issues'}         | ${true}
-      ${'merge_requests'} | ${true}
-      ${'projects'}       | ${false}
-      ${'milestones'}     | ${false}
-      ${'users'}          | ${false}
-      ${'notes'}          | ${false}
-      ${'wiki_blobs'}     | ${false}
-      ${'blobs'}          | ${false}
-    `(`dropdown`, ({ scope, showFilter }) => {
-      beforeEach(() => {
-        createComponent({ query: { scope } });
-      });
+    it('renders the component', () => {
+      expect(findRadioFilter().exists()).toBe(true);
+    });
+  });
 
-      it(`does${showFilter ? '' : ' not'} render when scope is ${scope}`, () => {
-        expect(findRadioFilter().exists()).toBe(showFilter);
+  describe.each`
+    hasFeatureFlagEnabled | paddingClass
+    ${true}               | ${'gl-px-5'}
+    ${false}              | ${'gl-px-0'}
+  `(`RadioFilter`, ({ hasFeatureFlagEnabled, paddingClass }) => {
+    beforeEach(() => {
+      createComponent({
+        provide: {
+          glFeatures: {
+            searchPageVerticalNav: hasFeatureFlagEnabled,
+          },
+        },
       });
     });
+
+    it(`has ${paddingClass} class`, () => {
+      expect(findRadioFilter().classes(paddingClass)).toBe(true);
+    });
   });
 });