Add group coverage summary spec

ee/spec/frontend/analytics/repository_analytics/components/test_coverage_summary_spec.js

+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
+import VueApollo from 'vue-apollo';
+import { mount, createLocalVue } from '@vue/test-utils';
+import { useFakeDate } from 'helpers/fake_date';
+import createMockApollo from 'jest/helpers/mock_apollo_helper';
+import waitForPromises from 'jest/helpers/wait_for_promises';
+import TestCoverageSummary from 'ee/analytics/repository_analytics/components/test_coverage_summary.vue';
+import getGroupTestCoverage from 'ee/analytics/repository_analytics/graphql/queries/get_group_test_coverage.query.graphql';
+
+const localVue = createLocalVue();
+
+describe('Test coverage table component', () => {
+  useFakeDate();
+  let wrapper;
+  let fakeApollo;
+
+  const findProjectsWithTests = () => wrapper.find('.js-metric-card-item:nth-child(1) h3');
+  const findAverageCoverage = () => wrapper.find('.js-metric-card-item:nth-child(2) h3');
+  const findTotalCoverages = () => wrapper.find('.js-metric-card-item:nth-child(3) h3');
+  const findLoadingState = () => wrapper.find(GlSkeletonLoading);
+
+  const createComponent = ({ data = {} } = {}) => {
+    wrapper = mount(TestCoverageSummary, {
+      localVue,
+      data() {
+        return {
+          projectCount: null,
+          averageCoverage: null,
+          coverageCount: null,
+          hasError: false,
+          isLoading: false,
+          ...data,
+        };
+      },
+      mocks: {
+        $apollo: {
+          queries: {
+            group: {
+              query: jest.fn().mockResolvedValue(),
+            },
+          },
+        },
+      },
+    });
+  };
+
+  const createComponentWithApollo = ({ data = {} } = {}) => {
+    localVue.use(VueApollo);
+    fakeApollo = createMockApollo([[getGroupTestCoverage, jest.fn().mockResolvedValue()]]);
+
+    wrapper = mount(TestCoverageSummary, {
+      localVue,
+      data() {
+        return {
+          projectCount: null,
+          averageCoverage: null,
+          coverageCount: null,
+          hasError: false,
+          isLoading: false,
+          ...data,
+        };
+      },
+      apolloProvider: fakeApollo,
+    });
+  };
+
+  afterEach(() => {
+    wrapper.destroy();
+    wrapper = null;
+  });
+
+  describe('when group code coverage is empty', () => {
+    it('renders empty metrics', () => {
+      createComponent();
+
+      expect(findProjectsWithTests().text()).toBe('-');
+      expect(findAverageCoverage().text()).toBe('-');
+      expect(findTotalCoverages().text()).toBe('-');
+    });
+  });
+
+  describe('when query is loading', () => {
+    it('renders loading state', () => {
+      createComponent({ data: { isLoading: true } });
+
+      expect(findLoadingState().exists()).toBe(true);
+    });
+  });
+
+  describe('when group code coverage is available', () => {
+    it('renders coverage metrics', () => {
+      const projectCount = '5';
+      const averageCoverage = '74.35';
+      const coverageCount = '5';
+
+      createComponent({
+        data: {
+          projectCount,
+          averageCoverage,
+          coverageCount,
+        },
+      });
+
+      expect(findProjectsWithTests().text()).toBe(projectCount);
+      expect(findAverageCoverage().text()).toBe(`${averageCoverage} %`);
+      expect(findTotalCoverages().text()).toBe(coverageCount);
+    });
+  });
+
+  describe('when group has no coverage', () => {
+    it('renders empty metrics', async () => {
+      createComponentWithApollo({
+        data: {},
+        queryData: {
+          data: {
+            group: {
+              codeCoverageActivities: {
+                nodes: [],
+              },
+            },
+          },
+        },
+      });
+      jest.runOnlyPendingTimers();
+      await waitForPromises();
+
+      expect(findProjectsWithTests().text()).toBe('-');
+      expect(findAverageCoverage().text()).toBe('-');
+      expect(findTotalCoverages().text()).toBe('-');
+    });
+  });
+});