Add test for coverage chart

Update spec to check that the chart is rendered.

Also updated gitlab.pot and created a changelog.

ee/app/assets/javascripts/analytics/repository_analytics/components/test_coverage_summary.vue

@@ -139,7 +139,7 @@ export default {
         <h5>{{ $options.text.graphCardHeader }}</h5>
       </template>
 
-      <chart-skeleton-loader v-if="isLoading" />
+      <chart-skeleton-loader v-if="isLoading" data-testid="group-coverage-chart-loading" />
 
       <gl-area-chart
         v-else
@@ -147,6 +147,7 @@ export default {
         :option="chartOptions"
         :include-legend-avg-max="false"
         :format-tooltip-text="formatTooltipText"
+        data-testid="group-coverage-chart"
       >
         <template #tooltip-title>
           {{ tooltipTitle }}

ee/app/assets/javascripts/analytics/repository_analytics/graphql/queries/get_group_test_coverage.query.graphql

 query getGroupTestCoverage($groupFullPath: ID!, $startDate: Date!) {
   group(fullPath: $groupFullPath) {
-    fullPath
     codeCoverageActivities(startDate: $startDate) {
       nodes {
         projectCount

ee/changelogs/unreleased/215140-graph-the-average-code-coverage-of-all-of-a-group-s-projects.yml

+---
+title: Graph group average code coverage
+merge_request: 53319
+author:
+type: added

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

@@ -15,6 +15,8 @@ describe('Test coverage table component', () => {
   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 findGroupCoverageChart = () => wrapper.find('[data-testid="group-coverage-chart"]');
+  const findChartLoadingState = () => wrapper.find('[data-testid="group-coverage-chart-loading"]');
   const findLoadingState = () => wrapper.find(GlSkeletonLoading);
 
   const createComponent = ({ data = {} } = {}, withApollo = false) => {
@@ -71,6 +73,7 @@ describe('Test coverage table component', () => {
       createComponent({ data: { isLoading: true } });
 
       expect(findLoadingState().exists()).toBe(true);
+      expect(findChartLoadingState().exists()).toBe(true);
     });
   });
 
@@ -92,6 +95,25 @@ describe('Test coverage table component', () => {
       expect(findAverageCoverage().text()).toBe(`${averageCoverage} %`);
       expect(findTotalCoverages().text()).toBe(coverageCount);
     });
+
+    it('renders area chart', () => {
+      createComponent({
+        data: {
+          groupCoverageChartData: [
+            {
+              name: 'test',
+              data: [
+                ['Jan 10', 77.9],
+                ['Jan 11', 78.7],
+                ['Jan 12', 79.6],
+              ],
+            },
+          ],
+        },
+      });
+
+      expect(findGroupCoverageChart().exists()).toBe(true);
+    });
   });
 
   describe('when group has no coverage', () => {

locale/gitlab.pot

@@ -24816,6 +24816,12 @@ msgstr ""
 msgid "RepositoriesAnalytics|Average Coverage by Job"
 msgstr ""
 
+msgid "RepositoriesAnalytics|Average coverage"
+msgstr ""
+
+msgid "RepositoriesAnalytics|Average test coverage last 30 days"
+msgstr ""
+
 msgid "RepositoriesAnalytics|Coverage"
 msgstr ""