Add latest changes from gitlab-org/gitlab@master

2 files changed, 1 insertions, 221 deletions

diff --git a/spec/frontend/analytics/usage_trends/components/app_spec.js b/spec/frontend/analytics/usage_trends/components/app_spec.js
index 8f1dd3c445c..f0306ea72e3 100644
--- a/spec/frontend/analytics/usage_trends/components/app_spec.js
+++ b/spec/frontend/analytics/usage_trends/components/app_spec.js
@@ -1,6 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
 import UsageTrendsApp from '~/analytics/usage_trends/components/app.vue';
-import ProjectsAndGroupsChart from '~/analytics/usage_trends/components/projects_and_groups_chart.vue';
 import UsageCounts from '~/analytics/usage_trends/components/usage_counts.vue';
 import UsageTrendsCountChart from '~/analytics/usage_trends/components/usage_trends_count_chart.vue';
 import UsersChart from '~/analytics/usage_trends/components/users_chart.vue';
@@ -25,7 +24,7 @@ describe('UsageTrendsApp', () => {
     expect(wrapper.find(UsageCounts).exists()).toBe(true);
   });
 
-  ['Pipelines', 'Issues & Merge Requests'].forEach((usage) => {
+  ['Total projects & groups', 'Pipelines', 'Issues & Merge Requests'].forEach((usage) => {
     it(`displays the ${usage} chart`, () => {
       const chartTitles = wrapper
         .findAll(UsageTrendsCountChart)
@@ -38,8 +37,4 @@ describe('UsageTrendsApp', () => {
   it('displays the users chart component', () => {
     expect(wrapper.find(UsersChart).exists()).toBe(true);
   });
-
-  it('displays the projects and groups chart component', () => {
-    expect(wrapper.find(ProjectsAndGroupsChart).exists()).toBe(true);
-  });
 });
diff --git a/spec/frontend/analytics/usage_trends/components/projects_and_groups_chart_spec.js b/spec/frontend/analytics/usage_trends/components/projects_and_groups_chart_spec.js
deleted file mode 100644
index 09215da32e0..00000000000
--- a/spec/frontend/analytics/usage_trends/components/projects_and_groups_chart_spec.js
+++ /dev/null
@@ -1,215 +0,0 @@
-import { GlAlert } from '@gitlab/ui';
-import { GlLineChart } from '@gitlab/ui/dist/charts';
-import { createLocalVue, shallowMount } from '@vue/test-utils';
-import VueApollo from 'vue-apollo';
-import createMockApollo from 'helpers/mock_apollo_helper';
-import ProjectsAndGroupChart from '~/analytics/usage_trends/components/projects_and_groups_chart.vue';
-import groupsQuery from '~/analytics/usage_trends/graphql/queries/groups.query.graphql';
-import projectsQuery from '~/analytics/usage_trends/graphql/queries/projects.query.graphql';
-import ChartSkeletonLoader from '~/vue_shared/components/resizable_chart/skeleton_loader.vue';
-import { mockQueryResponse } from '../apollo_mock_data';
-import { mockCountsData2, roundedSortedCountsMonthlyChartData2 } from '../mock_data';
-
-const localVue = createLocalVue();
-localVue.use(VueApollo);
-
-describe('ProjectsAndGroupChart', () => {
-  let wrapper;
-  let queryResponses = { projects: null, groups: null };
-  const mockAdditionalData = [{ recordedAt: '2020-07-21', count: 5 }];
-
-  const createComponent = ({
-    loadingError = false,
-    projects = [],
-    groups = [],
-    projectsLoading = false,
-    groupsLoading = false,
-    projectsAdditionalData = [],
-    groupsAdditionalData = [],
-  } = {}) => {
-    queryResponses = {
-      projects: mockQueryResponse({
-        key: 'projects',
-        data: projects,
-        loading: projectsLoading,
-        additionalData: projectsAdditionalData,
-      }),
-      groups: mockQueryResponse({
-        key: 'groups',
-        data: groups,
-        loading: groupsLoading,
-        additionalData: groupsAdditionalData,
-      }),
-    };
-
-    return shallowMount(ProjectsAndGroupChart, {
-      props: {
-        startDate: new Date(2020, 9, 26),
-        endDate: new Date(2020, 10, 1),
-        totalDataPoints: mockCountsData2.length,
-      },
-      localVue,
-      apolloProvider: createMockApollo([
-        [projectsQuery, queryResponses.projects],
-        [groupsQuery, queryResponses.groups],
-      ]),
-      data() {
-        return { loadingError };
-      },
-    });
-  };
-
-  afterEach(() => {
-    wrapper.destroy();
-    wrapper = null;
-    queryResponses = {
-      projects: null,
-      groups: null,
-    };
-  });
-
-  const findLoader = () => wrapper.find(ChartSkeletonLoader);
-  const findAlert = () => wrapper.find(GlAlert);
-  const findChart = () => wrapper.find(GlLineChart);
-
-  describe('while loading', () => {
-    beforeEach(() => {
-      wrapper = createComponent({ projectsLoading: true, groupsLoading: true });
-    });
-
-    it('displays the skeleton loader', () => {
-      expect(findLoader().exists()).toBe(true);
-    });
-
-    it('hides the chart', () => {
-      expect(findChart().exists()).toBe(false);
-    });
-  });
-
-  describe('while loading 1 data set', () => {
-    beforeEach(async () => {
-      wrapper = createComponent({
-        projects: mockCountsData2,
-        groupsLoading: true,
-      });
-
-      await wrapper.vm.$nextTick();
-    });
-
-    it('hides the skeleton loader', () => {
-      expect(findLoader().exists()).toBe(false);
-    });
-
-    it('renders the chart', () => {
-      expect(findChart().exists()).toBe(true);
-    });
-  });
-
-  describe('without data', () => {
-    beforeEach(async () => {
-      wrapper = createComponent({ projects: [] });
-      await wrapper.vm.$nextTick();
-    });
-
-    it('renders a no data message', () => {
-      expect(findAlert().text()).toBe('No data available.');
-    });
-
-    it('hides the skeleton loader', () => {
-      expect(findLoader().exists()).toBe(false);
-    });
-
-    it('does not render the chart', () => {
-      expect(findChart().exists()).toBe(false);
-    });
-  });
-
-  describe('with data', () => {
-    beforeEach(async () => {
-      wrapper = createComponent({ projects: mockCountsData2 });
-      await wrapper.vm.$nextTick();
-    });
-
-    it('hides the skeleton loader', () => {
-      expect(findLoader().exists()).toBe(false);
-    });
-
-    it('renders the chart', () => {
-      expect(findChart().exists()).toBe(true);
-    });
-
-    it('passes the data to the line chart', () => {
-      expect(findChart().props('data')).toEqual([
-        { data: roundedSortedCountsMonthlyChartData2, name: 'Total projects' },
-        { data: [], name: 'Total groups' },
-      ]);
-    });
-  });
-
-  describe('with errors', () => {
-    beforeEach(async () => {
-      wrapper = createComponent({ loadingError: true });
-      await wrapper.vm.$nextTick();
-    });
-
-    it('renders an error message', () => {
-      expect(findAlert().text()).toBe('No data available.');
-    });
-
-    it('hides the skeleton loader', () => {
-      expect(findLoader().exists()).toBe(false);
-    });
-
-    it('hides the chart', () => {
-      expect(findChart().exists()).toBe(false);
-    });
-  });
-
-  describe.each`
-    metric        | loadingState                                      | newData
-    ${'projects'} | ${{ projectsAdditionalData: mockAdditionalData }} | ${{ projects: mockCountsData2 }}
-    ${'groups'}   | ${{ groupsAdditionalData: mockAdditionalData }}   | ${{ groups: mockCountsData2 }}
-  `('$metric - fetchMore', ({ metric, loadingState, newData }) => {
-    describe('when the fetchMore query returns data', () => {
-      beforeEach(async () => {
-        wrapper = createComponent({
-          ...loadingState,
-          ...newData,
-        });
-
-        jest.spyOn(wrapper.vm.$apollo.queries[metric], 'fetchMore');
-        await wrapper.vm.$nextTick();
-      });
-
-      it('requests data twice', () => {
-        expect(queryResponses[metric]).toBeCalledTimes(2);
-      });
-
-      it('calls fetchMore', () => {
-        expect(wrapper.vm.$apollo.queries[metric].fetchMore).toHaveBeenCalledTimes(1);
-      });
-    });
-
-    describe('when the fetchMore query throws an error', () => {
-      beforeEach(() => {
-        wrapper = createComponent({
-          ...loadingState,
-          ...newData,
-        });
-
-        jest
-          .spyOn(wrapper.vm.$apollo.queries[metric], 'fetchMore')
-          .mockImplementation(jest.fn().mockRejectedValue());
-        return wrapper.vm.$nextTick();
-      });
-
-      it('calls fetchMore', () => {
-        expect(wrapper.vm.$apollo.queries[metric].fetchMore).toHaveBeenCalledTimes(1);
-      });
-
-      it('renders an error message', () => {
-        expect(findAlert().text()).toBe('No data available.');
-      });
-    });
-  });
-});