1 files changed, 32 insertions, 2 deletions

diff --git a/spec/frontend/usage_quotas/storage/components/project_storage_app_spec.js b/spec/frontend/usage_quotas/storage/components/project_storage_app_spec.js
index 0ae01083a09..babefe1dd19 100644
--- a/spec/frontend/usage_quotas/storage/components/project_storage_app_spec.js
+++ b/spec/frontend/usage_quotas/storage/components/project_storage_app_spec.js
@@ -16,7 +16,8 @@ import {
   NAMESPACE_STORAGE_TYPES,
   TOTAL_USAGE_DEFAULT_TEXT,
 } from '~/usage_quotas/storage/constants';
-import getProjectStorageStatistics from '~/usage_quotas/storage/queries/project_storage.query.graphql';
+import getCostFactoredProjectStorageStatistics from 'ee_else_ce/usage_quotas/storage/queries/cost_factored_project_storage.query.graphql';
+import getProjectStorageStatistics from 'ee_else_ce/usage_quotas/storage/queries/project_storage.query.graphql';
 import { numberToHumanSize } from '~/lib/utils/number_utils';
 import {
   mockGetProjectStorageStatisticsGraphQLResponse,
@@ -38,7 +39,10 @@ describe('ProjectStorageApp', () => {
       response = jest.fn().mockResolvedValue(mockedValue);
     }
 
-    const requestHandlers = [[getProjectStorageStatistics, response]];
+    const requestHandlers = [
+      [getProjectStorageStatistics, response],
+      [getCostFactoredProjectStorageStatistics, response],
+    ];
 
     return createMockApollo(requestHandlers);
   };
@@ -187,4 +191,30 @@ describe('ProjectStorageApp', () => {
       ]);
     });
   });
+
+  describe('when displayCostFactoredStorageSizeOnProjectPages feature flag is enabled', () => {
+    let mockApollo;
+    beforeEach(async () => {
+      mockApollo = createMockApolloProvider({
+        mockedValue: mockGetProjectStorageStatisticsGraphQLResponse,
+      });
+      createComponent({
+        mockApollo,
+        provide: {
+          glFeatures: {
+            displayCostFactoredStorageSizeOnProjectPages: true,
+          },
+        },
+      });
+      await waitForPromises();
+    });
+
+    it('renders correct total usage', () => {
+      const expectedValue = numberToHumanSize(
+        mockGetProjectStorageStatisticsGraphQLResponse.data.project.statistics.storageSize,
+        1,
+      );
+      expect(findUsagePercentage().text()).toBe(expectedValue);
+    });
+  });
 });