Make propsData an arg so we can use createComponent for CI minutes tests

ee/spec/frontend/subscriptions/buy_addons_shared/app_spec.js

@@ -29,14 +29,25 @@ import { mockStoragePlans } from 'ee_jest/subscriptions/mock_data';
 const localVue = createLocalVue();
 localVue.use(VueApollo);
 
-describe('Buy Storage App', () => {
+describe('Buy Addons Shared App', () => {
   let wrapper;
 
-  function createComponent(apolloProvider) {
+  function createComponent(apolloProvider, propsData) {
     wrapper = shallowMountExtended(App, {
       localVue,
       apolloProvider,
-      propsData: {
+      propsData,
+      stubs: {
+        Checkout,
+        AddonPurchaseDetails,
+        OrderSummary,
+        SummaryDetails,
+      },
+    });
+    return waitForPromises();
+  }
+
+  const STORAGE_ADDON_PROPS = {
     config: {
       alertText: '',
       formula: I18N_DETAILS_FORMULA,
@@ -53,17 +64,7 @@ describe('Buy Storage App', () => {
       tooltipNote: I18N_STORAGE_TOOLTIP_NOTE,
     },
     tags: [planTags.STORAGE_PLAN],
-      },
-      stubs: {
-        Checkout,
-        AddonPurchaseDetails,
-        OrderSummary,
-        SummaryDetails,
-      },
-    });
-    return waitForPromises();
-  }
-
+  };
   const getStoragePlan = () => pick(mockStoragePlans[0], ['id', 'code', 'pricePerYear', 'name']);
   const findCheckout = () => wrapper.findComponent(Checkout);
   const findOrderSummary = () => wrapper.findComponent(OrderSummary);
@@ -77,12 +78,13 @@ describe('Buy Storage App', () => {
     wrapper.destroy();
   });
 
+  describe('Storage', () => {
     describe('when data is received', () => {
       beforeEach(() => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: { plans: mockStoragePlans } }),
         });
-      return createComponent(mockApollo);
+        return createComponent(mockApollo, STORAGE_ADDON_PROPS);
       });
 
       it('should display the root element', () => {
@@ -109,7 +111,7 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: null }),
         });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findRootElement().exists()).toBe(false);
         expect(wrapper.findComponent(GlEmptyState).exists()).toBe(true);
@@ -119,7 +121,7 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: { plans: null } }),
         });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findRootElement().exists()).toBe(false);
         expect(wrapper.findComponent(GlEmptyState).exists()).toBe(true);
@@ -129,7 +131,7 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: { plans: {} } }),
         });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findRootElement().exists()).toBe(false);
         expect(wrapper.findComponent(GlEmptyState).exists()).toBe(true);
@@ -141,7 +143,7 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockRejectedValue(new Error('An error happened!')),
         });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findRootElement().exists()).toBe(false);
         expect(wrapper.findComponent(GlEmptyState).exists()).toBe(true);
@@ -153,7 +155,7 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: { plans: mockStoragePlans } }),
         });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findQuantityText().text()).toMatchInterpolatedText(
           'x 10 GB per pack = 10 GB of storage',
@@ -167,7 +169,7 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: { plans: mockStoragePlans } }),
         }, { quantity: 2 });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findQuantityText().text()).toMatchInterpolatedText(
           'x 10 GB per pack = 20 GB of storage',
@@ -180,9 +182,10 @@ describe('Buy Storage App', () => {
         const mockApollo = createMockApolloProvider({
           plansQueryMock: jest.fn().mockResolvedValue({ data: { plans: mockStoragePlans } }),
         }, { quantity: -1 });
-      await createComponent(mockApollo);
+        await createComponent(mockApollo, STORAGE_ADDON_PROPS);
 
         expect(findQuantityText().text()).toMatchInterpolatedText('x 10 GB per pack');
       });
     });
+  });
 });