1 files changed, 15 insertions, 14 deletions

diff --git a/spec/frontend/monitoring/components/charts/time_series_spec.js b/spec/frontend/monitoring/components/charts/time_series_spec.js
index f4bca26f659..503dee7b937 100644
--- a/spec/frontend/monitoring/components/charts/time_series_spec.js
+++ b/spec/frontend/monitoring/components/charts/time_series_spec.js
@@ -9,7 +9,6 @@ import { mount, shallowMount } from '@vue/test-utils';
 import timezoneMock from 'timezone-mock';
 import { nextTick } from 'vue';
 import { TEST_HOST } from 'helpers/test_constants';
-import { setTestTimeout } from 'helpers/timeout';
 import { shallowWrapperContainsSlotText } from 'helpers/vue_test_utils_helper';
 import TimeSeries from '~/monitoring/components/charts/time_series.vue';
 import { panelTypes, chartHeight } from '~/monitoring/constants';
@@ -59,17 +58,13 @@ describe('Time series component', () => {
     });
   };
 
-  beforeEach(() => {
-    setTestTimeout(1000);
-  });
-
   afterEach(() => {
     wrapper.destroy();
   });
 
   describe('With a single time series', () => {
     describe('general functions', () => {
-      const findChart = () => wrapper.find({ ref: 'chart' });
+      const findChart = () => wrapper.findComponent({ ref: 'chart' });
 
       beforeEach(async () => {
         createWrapper({}, mount);
@@ -215,7 +210,7 @@ describe('Time series component', () => {
               const name = 'Metric 1';
               const value = '5.556';
               const dataIndex = 0;
-              const seriesLabel = wrapper.find(GlChartSeriesLabel);
+              const seriesLabel = wrapper.findComponent(GlChartSeriesLabel);
 
               expect(seriesLabel.vm.color).toBe('');
 
@@ -225,7 +220,11 @@ describe('Time series component', () => {
               ]);
 
               expect(
-                shallowWrapperContainsSlotText(wrapper.find(GlLineChart), 'tooltip-content', value),
+                shallowWrapperContainsSlotText(
+                  wrapper.findComponent(GlLineChart),
+                  'tooltip-content',
+                  value,
+                ),
               ).toBe(true);
             });
 
@@ -598,7 +597,7 @@ describe('Time series component', () => {
 
       glChartComponents.forEach((dynamicComponent) => {
         describe(`GitLab UI: ${dynamicComponent.chartType}`, () => {
-          const findChartComponent = () => wrapper.find(dynamicComponent.component);
+          const findChartComponent = () => wrapper.findComponent(dynamicComponent.component);
 
           beforeEach(async () => {
             createWrapper(
@@ -656,7 +655,7 @@ describe('Time series component', () => {
               wrapper.vm.tooltip.commitUrl = commitUrl;
 
               await nextTick();
-              const commitLink = wrapper.find(GlLink);
+              const commitLink = wrapper.findComponent(GlLink);
 
               expect(shallowWrapperContainsSlotText(commitLink, 'default', mockSha)).toBe(true);
               expect(commitLink.attributes('href')).toEqual(commitUrl);
@@ -680,7 +679,9 @@ describe('Time series component', () => {
         let lineColors;
 
         beforeEach(() => {
-          lineColors = wrapper.find(GlAreaChart).vm.series.map((item) => item.lineStyle.color);
+          lineColors = wrapper
+            .findComponent(GlAreaChart)
+            .vm.series.map((item) => item.lineStyle.color);
         });
 
         it('should contain different colors for contiguous time series', () => {
@@ -690,7 +691,7 @@ describe('Time series component', () => {
         });
 
         it('should match series color with tooltip label color', () => {
-          const labels = wrapper.findAll(GlChartSeriesLabel);
+          const labels = wrapper.findAllComponents(GlChartSeriesLabel);
 
           lineColors.forEach((color, index) => {
             const labelColor = labels.at(index).props('color');
@@ -700,7 +701,7 @@ describe('Time series component', () => {
 
         it('should match series color with legend color', () => {
           const legendColors = wrapper
-            .find(GlChartLegend)
+            .findComponent(GlChartLegend)
             .props('seriesInfo')
             .map((item) => item.color);
 
@@ -713,7 +714,7 @@ describe('Time series component', () => {
   });
 
   describe('legend layout', () => {
-    const findLegend = () => wrapper.find(GlChartLegend);
+    const findLegend = () => wrapper.findComponent(GlChartLegend);
 
     beforeEach(async () => {
       createWrapper({}, mount);