diff options
Diffstat (limited to 'spec/frontend/jobs')
16 files changed, 205 insertions, 243 deletions
diff --git a/spec/frontend/jobs/components/artifacts_block_spec.js b/spec/frontend/jobs/components/artifacts_block_spec.js index 134463c6763..0c7c0a6c311 100644 --- a/spec/frontend/jobs/components/artifacts_block_spec.js +++ b/spec/frontend/jobs/components/artifacts_block_spec.js @@ -1,7 +1,7 @@ import { mount } from '@vue/test-utils'; import { trimText } from 'helpers/text_helper'; -import { getTimeago } from '~/lib/utils/datetime_utility'; import ArtifactsBlock from '~/jobs/components/artifacts_block.vue'; +import { getTimeago } from '~/lib/utils/datetime_utility'; describe('Artifacts block', () => { let wrapper; diff --git a/spec/frontend/jobs/components/erased_block_spec.js b/spec/frontend/jobs/components/erased_block_spec.js index b3e1d28eb16..057df20ccc2 100644 --- a/spec/frontend/jobs/components/erased_block_spec.js +++ b/spec/frontend/jobs/components/erased_block_spec.js @@ -1,7 +1,7 @@ -import { mount } from '@vue/test-utils'; import { GlLink } from '@gitlab/ui'; -import { getTimeago } from '~/lib/utils/datetime_utility'; +import { mount } from '@vue/test-utils'; import ErasedBlock from '~/jobs/components/erased_block.vue'; +import { getTimeago } from '~/lib/utils/datetime_utility'; describe('Erased block', () => { let wrapper; @@ -10,6 +10,8 @@ describe('Erased block', () => { const timeago = getTimeago(); const formattedDate = timeago.format(erasedAt); + const findLink = () => wrapper.find(GlLink); + const createComponent = (props) => { wrapper = mount(ErasedBlock, { propsData: props, @@ -32,7 +34,7 @@ describe('Erased block', () => { }); it('renders username and link', () => { - expect(wrapper.find(GlLink).attributes('href')).toEqual('gitlab.com/root'); + expect(findLink().attributes('href')).toEqual('gitlab.com/root'); expect(wrapper.text().trim()).toContain('Job has been erased by'); expect(wrapper.text().trim()).toContain('root'); diff --git a/spec/frontend/jobs/components/job_app_spec.js b/spec/frontend/jobs/components/job_app_spec.js index 657687b5e2a..2974e91e46d 100644 --- a/spec/frontend/jobs/components/job_app_spec.js +++ b/spec/frontend/jobs/components/job_app_spec.js @@ -1,18 +1,18 @@ -import Vuex from 'vuex'; -import { mount, createLocalVue } from '@vue/test-utils'; import { GlLoadingIcon } from '@gitlab/ui'; +import { mount, createLocalVue } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; +import Vuex from 'vuex'; import { getJSONFixture } from 'helpers/fixtures'; import { TEST_HOST } from 'helpers/test_constants'; -import axios from '~/lib/utils/axios_utils'; +import EmptyState from '~/jobs/components/empty_state.vue'; +import EnvironmentsBlock from '~/jobs/components/environments_block.vue'; +import ErasedBlock from '~/jobs/components/erased_block.vue'; import JobApp from '~/jobs/components/job_app.vue'; import Sidebar from '~/jobs/components/sidebar.vue'; import StuckBlock from '~/jobs/components/stuck_block.vue'; import UnmetPrerequisitesBlock from '~/jobs/components/unmet_prerequisites_block.vue'; -import EnvironmentsBlock from '~/jobs/components/environments_block.vue'; -import ErasedBlock from '~/jobs/components/erased_block.vue'; -import EmptyState from '~/jobs/components/empty_state.vue'; import createStore from '~/jobs/store'; +import axios from '~/lib/utils/axios_utils'; import job from '../mock_data'; describe('Job App', () => { @@ -34,7 +34,6 @@ describe('Job App', () => { const props = { artifactHelpUrl: 'help/artifact', - runnerHelpUrl: 'help/runner', deploymentHelpUrl: 'help/deployment', runnerSettingsUrl: 'settings/ci-cd/runners', variablesSettingsUrl: 'settings/ci-cd/variables', diff --git a/spec/frontend/jobs/components/job_container_item_spec.js b/spec/frontend/jobs/components/job_container_item_spec.js index af7ce100d83..36038b69e64 100644 --- a/spec/frontend/jobs/components/job_container_item_spec.js +++ b/spec/frontend/jobs/components/job_container_item_spec.js @@ -1,78 +1,80 @@ -import Vue from 'vue'; -import mountComponent from 'helpers/vue_mount_component_helper'; +import { GlIcon, GlLink } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; import JobContainerItem from '~/jobs/components/job_container_item.vue'; +import CiIcon from '~/vue_shared/components/ci_icon.vue'; import job from '../mock_data'; describe('JobContainerItem', () => { + let wrapper; const delayedJobFixture = getJSONFixture('jobs/delayed.json'); - const Component = Vue.extend(JobContainerItem); - let vm; + + const findCiIconComponent = () => wrapper.findComponent(CiIcon); + const findGlIconComponent = () => wrapper.findComponent(GlIcon); + + function createComponent(jobData = {}, props = { isActive: false, retried: false }) { + wrapper = shallowMount(JobContainerItem, { + propsData: { + job: { + ...jobData, + retried: props.retried, + }, + isActive: props.isActive, + }, + }); + } afterEach(() => { - vm.$destroy(); + wrapper.destroy(); + wrapper = null; }); - const sharedTests = () => { + describe('when a job is not active and not retried', () => { + beforeEach(() => { + createComponent(job); + }); + it('displays a status icon', () => { - expect(vm.$el).toHaveSpriteIcon(job.status.icon); + const ciIcon = findCiIconComponent(); + + expect(ciIcon.props('status')).toBe(job.status); }); it('displays the job name', () => { - expect(vm.$el.innerText).toContain(job.name); + expect(wrapper.text()).toContain(job.name); }); it('displays a link to the job', () => { - const link = vm.$el.querySelector('.js-job-link'); + const link = wrapper.findComponent(GlLink); - expect(link.href).toBe(job.status.details_path); + expect(link.attributes('href')).toBe(job.status.details_path); }); - }; - - describe('when a job is not active and not retied', () => { - beforeEach(() => { - vm = mountComponent(Component, { - job, - isActive: false, - }); - }); - - sharedTests(); }); describe('when a job is active', () => { beforeEach(() => { - vm = mountComponent(Component, { - job, - isActive: true, - }); + createComponent(job, { isActive: true }); }); - sharedTests(); + it('displays an arrow sprite icon', () => { + const icon = findGlIconComponent(); - it('displays an arrow', () => { - expect(vm.$el).toHaveSpriteIcon('arrow-right'); + expect(icon.props('name')).toBe('arrow-right'); }); }); describe('when a job is retried', () => { beforeEach(() => { - vm = mountComponent(Component, { - job: { - ...job, - retried: true, - }, - isActive: false, - }); + createComponent(job, { isActive: false, retried: true }); }); - sharedTests(); + it('displays a retry icon', () => { + const icon = findGlIconComponent(); - it('displays an icon', () => { - expect(vm.$el).toHaveSpriteIcon('retry'); + expect(icon.props('name')).toBe('retry'); }); }); - describe('for delayed job', () => { + describe('for a delayed job', () => { beforeEach(() => { const remainingMilliseconds = 1337000; jest @@ -80,22 +82,16 @@ describe('JobContainerItem', () => { .mockImplementation( () => new Date(delayedJobFixture.scheduled_at).getTime() - remainingMilliseconds, ); + + createComponent(delayedJobFixture); }); - it('displays remaining time in tooltip', (done) => { - vm = mountComponent(Component, { - job: delayedJobFixture, - isActive: false, - }); - - Vue.nextTick() - .then(() => { - expect(vm.$el.querySelector('.js-job-link').getAttribute('title')).toEqual( - 'delayed job - delayed manual action (00:22:17)', - ); - }) - .then(done) - .catch(done.fail); + it('displays remaining time in tooltip', async () => { + await wrapper.vm.$nextTick(); + + const link = wrapper.findComponent(GlLink); + + expect(link.attributes('title')).toMatch('delayed job - delayed manual action (00:22:17)'); }); }); }); diff --git a/spec/frontend/jobs/components/job_sidebar_details_container_spec.js b/spec/frontend/jobs/components/job_sidebar_details_container_spec.js index bc0d455c309..2b56bd2d558 100644 --- a/spec/frontend/jobs/components/job_sidebar_details_container_spec.js +++ b/spec/frontend/jobs/components/job_sidebar_details_container_spec.js @@ -1,7 +1,7 @@ import { shallowMount } from '@vue/test-utils'; import { extendedWrapper } from 'helpers/vue_test_utils_helper'; -import SidebarJobDetailsContainer from '~/jobs/components/sidebar_job_details_container.vue'; import DetailRow from '~/jobs/components/sidebar_detail_row.vue'; +import SidebarJobDetailsContainer from '~/jobs/components/sidebar_job_details_container.vue'; import createStore from '~/jobs/store'; import job from '../mock_data'; @@ -116,14 +116,5 @@ describe('Job Sidebar Details Container', () => { expect(findJobTimeout().exists()).toBe(false); }); - - it('should pass the help URL', async () => { - const helpUrl = 'fakeUrl'; - const props = { runnerHelpUrl: helpUrl }; - createWrapper({ props }); - await store.dispatch('receiveJobSuccess', { metadata: { timeout_human_readable } }); - - expect(findJobTimeout().props('helpUrl')).toBe(helpUrl); - }); }); }); diff --git a/spec/frontend/jobs/components/job_sidebar_retry_button_spec.js b/spec/frontend/jobs/components/job_sidebar_retry_button_spec.js index 4bf697ab7cc..8fc5b071e54 100644 --- a/spec/frontend/jobs/components/job_sidebar_retry_button_spec.js +++ b/spec/frontend/jobs/components/job_sidebar_retry_button_spec.js @@ -1,8 +1,8 @@ import { GlButton, GlLink } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; -import job from '../mock_data'; import JobsSidebarRetryButton from '~/jobs/components/job_sidebar_retry_button.vue'; import createStore from '~/jobs/store'; +import job from '../mock_data'; describe('Job Sidebar Retry Button', () => { let store; diff --git a/spec/frontend/jobs/components/log/line_header_spec.js b/spec/frontend/jobs/components/log/line_header_spec.js index bb90949b1f4..9763e2f437b 100644 --- a/spec/frontend/jobs/components/log/line_header_spec.js +++ b/spec/frontend/jobs/components/log/line_header_spec.js @@ -1,7 +1,7 @@ import { mount } from '@vue/test-utils'; +import DurationBadge from '~/jobs/components/log/duration_badge.vue'; import LineHeader from '~/jobs/components/log/line_header.vue'; import LineNumber from '~/jobs/components/log/line_number.vue'; -import DurationBadge from '~/jobs/components/log/duration_badge.vue'; describe('Job Log Header Line', () => { let wrapper; diff --git a/spec/frontend/jobs/components/log/log_spec.js b/spec/frontend/jobs/components/log/log_spec.js index f662ffa1780..b7aff1f3e3b 100644 --- a/spec/frontend/jobs/components/log/log_spec.js +++ b/spec/frontend/jobs/components/log/log_spec.js @@ -1,7 +1,7 @@ import { mount, createLocalVue } from '@vue/test-utils'; import Vuex from 'vuex'; -import { logLinesParser } from '~/jobs/store/utils'; import Log from '~/jobs/components/log/log.vue'; +import { logLinesParser } from '~/jobs/store/utils'; import { jobLog } from './mock_data'; describe('Job Log', () => { diff --git a/spec/frontend/jobs/components/manual_variables_form_spec.js b/spec/frontend/jobs/components/manual_variables_form_spec.js index f6c37407e2b..7172a319876 100644 --- a/spec/frontend/jobs/components/manual_variables_form_spec.js +++ b/spec/frontend/jobs/components/manual_variables_form_spec.js @@ -1,5 +1,5 @@ -import { shallowMount, createLocalVue } from '@vue/test-utils'; import { GlButton } from '@gitlab/ui'; +import { shallowMount, createLocalVue } from '@vue/test-utils'; import Form from '~/jobs/components/manual_variables_form.vue'; const localVue = createLocalVue(); diff --git a/spec/frontend/jobs/components/sidebar_detail_row_spec.js b/spec/frontend/jobs/components/sidebar_detail_row_spec.js index 42d11266dad..bae4d6cf837 100644 --- a/spec/frontend/jobs/components/sidebar_detail_row_spec.js +++ b/spec/frontend/jobs/components/sidebar_detail_row_spec.js @@ -1,61 +1,55 @@ -import Vue from 'vue'; -import sidebarDetailRow from '~/jobs/components/sidebar_detail_row.vue'; +import { GlLink } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import SidebarDetailRow from '~/jobs/components/sidebar_detail_row.vue'; describe('Sidebar detail row', () => { - let SidebarDetailRow; - let vm; + let wrapper; - beforeEach(() => { - SidebarDetailRow = Vue.extend(sidebarDetailRow); - }); + const title = 'this is the title'; + const value = 'this is the value'; + const helpUrl = '/help/ci/runners/README.html'; - afterEach(() => { - vm.$destroy(); - }); + const findHelpLink = () => wrapper.findComponent(GlLink); - it('should render no title', () => { - vm = new SidebarDetailRow({ + const createComponent = (props) => { + wrapper = shallowMount(SidebarDetailRow, { propsData: { - value: 'this is the value', + ...props, }, - }).$mount(); + }); + }; - expect(vm.$el.textContent.replace(/\s+/g, ' ').trim()).toEqual('this is the value'); + afterEach(() => { + wrapper.destroy(); + wrapper = null; }); - beforeEach(() => { - vm = new SidebarDetailRow({ - propsData: { - title: 'this is the title', - value: 'this is the value', - }, - }).$mount(); - }); + describe('with title/value and without helpUrl', () => { + beforeEach(() => { + createComponent({ title, value }); + }); - it('should render provided title and value', () => { - expect(vm.$el.textContent.replace(/\s+/g, ' ').trim()).toEqual( - 'this is the title: this is the value', - ); - }); + it('should render the provided title and value', () => { + expect(wrapper.text()).toBe(`${title}: ${value}`); + }); - describe('when helpUrl not provided', () => { - it('should not render help', () => { - expect(vm.$el.querySelector('.help-button')).toBeNull(); + it('should not render the help link', () => { + expect(findHelpLink().exists()).toBe(false); }); }); describe('when helpUrl provided', () => { beforeEach(() => { - vm = new SidebarDetailRow({ - propsData: { - helpUrl: 'help url', - value: 'foo', - }, - }).$mount(); + createComponent({ + helpUrl, + title, + value, + }); }); - it('should render help', () => { - expect(vm.$el.querySelector('.help-button a').getAttribute('href')).toEqual('help url'); + it('should render the help link', () => { + expect(findHelpLink().exists()).toBe(true); + expect(findHelpLink().attributes('href')).toBe(helpUrl); }); }); }); diff --git a/spec/frontend/jobs/components/sidebar_spec.js b/spec/frontend/jobs/components/sidebar_spec.js index 22d555ffec7..5a2e699137d 100644 --- a/spec/frontend/jobs/components/sidebar_spec.js +++ b/spec/frontend/jobs/components/sidebar_spec.js @@ -1,10 +1,10 @@ import { shallowMount } from '@vue/test-utils'; import { extendedWrapper } from 'helpers/vue_test_utils_helper'; -import Sidebar, { forwardDeploymentFailureModalId } from '~/jobs/components/sidebar.vue'; -import StagesDropdown from '~/jobs/components/stages_dropdown.vue'; -import JobsContainer from '~/jobs/components/jobs_container.vue'; import JobRetryForwardDeploymentModal from '~/jobs/components/job_retry_forward_deployment_modal.vue'; import JobRetryButton from '~/jobs/components/job_sidebar_retry_button.vue'; +import JobsContainer from '~/jobs/components/jobs_container.vue'; +import Sidebar, { forwardDeploymentFailureModalId } from '~/jobs/components/sidebar.vue'; +import StagesDropdown from '~/jobs/components/stages_dropdown.vue'; import createStore from '~/jobs/store'; import job, { jobsInStage } from '../mock_data'; diff --git a/spec/frontend/jobs/components/trigger_block_spec.js b/spec/frontend/jobs/components/trigger_block_spec.js index 16ea276ee4a..e0eb873dc2f 100644 --- a/spec/frontend/jobs/components/trigger_block_spec.js +++ b/spec/frontend/jobs/components/trigger_block_spec.js @@ -1,100 +1,86 @@ -import Vue from 'vue'; -import mountComponent from 'helpers/vue_mount_component_helper'; -import component from '~/jobs/components/trigger_block.vue'; +import { GlButton, GlTable } from '@gitlab/ui'; +import { mount } from '@vue/test-utils'; +import TriggerBlock from '~/jobs/components/trigger_block.vue'; describe('Trigger block', () => { - const Component = Vue.extend(component); - let vm; + let wrapper; + + const findRevealButton = () => wrapper.find(GlButton); + const findVariableTable = () => wrapper.find(GlTable); + const findShortToken = () => wrapper.find('[data-testid="trigger-short-token"]'); + const findVariableValue = (index) => + wrapper.findAll('[data-testid="trigger-build-value"]').at(index); + const findVariableKey = (index) => wrapper.findAll('[data-testid="trigger-build-key"]').at(index); + + const createComponent = (props) => { + wrapper = mount(TriggerBlock, { + propsData: { + ...props, + }, + }); + }; afterEach(() => { - vm.$destroy(); + wrapper.destroy(); + wrapper = null; }); - describe('with short token', () => { + describe('with short token and no variables', () => { it('renders short token', () => { - vm = mountComponent(Component, { + createComponent({ trigger: { short_token: '0a666b2', + variables: [], }, }); - expect(vm.$el.querySelector('.js-short-token').textContent).toContain('0a666b2'); + expect(findShortToken().text()).toContain('0a666b2'); }); }); - describe('without short token', () => { + describe('without variables or short token', () => { + beforeEach(() => { + createComponent({ trigger: { variables: [] } }); + }); + it('does not render short token', () => { - vm = mountComponent(Component, { trigger: {} }); + expect(findShortToken().exists()).toBe(false); + }); - expect(vm.$el.querySelector('.js-short-token')).toBeNull(); + it('does not render variables', () => { + expect(findRevealButton().exists()).toBe(false); + expect(findVariableTable().exists()).toBe(false); }); }); describe('with variables', () => { describe('hide/reveal variables', () => { - it('should toggle variables on click', (done) => { - vm = mountComponent(Component, { + it('should toggle variables on click', async () => { + const hiddenValue = '••••••'; + const gcsVar = { key: 'UPLOAD_TO_GCS', value: 'false', public: false }; + const s3Var = { key: 'UPLOAD_TO_S3', value: 'true', public: false }; + + createComponent({ trigger: { - short_token: 'bd7e', - variables: [ - { key: 'UPLOAD_TO_GCS', value: 'false', public: false }, - { key: 'UPLOAD_TO_S3', value: 'true', public: false }, - ], + variables: [gcsVar, s3Var], }, }); - vm.$el.querySelector('.js-reveal-variables').click(); - - vm.$nextTick() - .then(() => { - expect(vm.$el.querySelector('.js-build-variables')).not.toBeNull(); - expect(vm.$el.querySelector('.js-reveal-variables').textContent.trim()).toEqual( - 'Hide values', - ); - - expect(vm.$el.querySelector('.js-build-variables').textContent).toContain( - 'UPLOAD_TO_GCS', - ); + expect(findRevealButton().text()).toBe('Reveal values'); - expect(vm.$el.querySelector('.js-build-variables').textContent).toContain('false'); - expect(vm.$el.querySelector('.js-build-variables').textContent).toContain( - 'UPLOAD_TO_S3', - ); + expect(findVariableValue(0).text()).toBe(hiddenValue); + expect(findVariableValue(1).text()).toBe(hiddenValue); - expect(vm.$el.querySelector('.js-build-variables').textContent).toContain('true'); + expect(findVariableKey(0).text()).toBe(gcsVar.key); + expect(findVariableKey(1).text()).toBe(s3Var.key); - vm.$el.querySelector('.js-reveal-variables').click(); - }) - .then(vm.$nextTick) - .then(() => { - expect(vm.$el.querySelector('.js-reveal-variables').textContent.trim()).toEqual( - 'Reveal values', - ); + await findRevealButton().trigger('click'); - expect(vm.$el.querySelector('.js-build-variables').textContent).toContain( - 'UPLOAD_TO_GCS', - ); + expect(findRevealButton().text()).toBe('Hide values'); - expect(vm.$el.querySelector('.js-build-value').textContent).toContain('••••••'); - - expect(vm.$el.querySelector('.js-build-variables').textContent).toContain( - 'UPLOAD_TO_S3', - ); - - expect(vm.$el.querySelector('.js-build-value').textContent).toContain('••••••'); - }) - .then(done) - .catch(done.fail); + expect(findVariableValue(0).text()).toBe(gcsVar.value); + expect(findVariableValue(1).text()).toBe(s3Var.value); }); }); }); - - describe('without variables', () => { - it('does not render variables', () => { - vm = mountComponent(Component, { trigger: {} }); - - expect(vm.$el.querySelector('.js-reveal-variables')).toBeNull(); - expect(vm.$el.querySelector('.js-build-variables')).toBeNull(); - }); - }); }); diff --git a/spec/frontend/jobs/components/unmet_prerequisites_block_spec.js b/spec/frontend/jobs/components/unmet_prerequisites_block_spec.js index 9092d3f8163..aeb85694e60 100644 --- a/spec/frontend/jobs/components/unmet_prerequisites_block_spec.js +++ b/spec/frontend/jobs/components/unmet_prerequisites_block_spec.js @@ -1,5 +1,5 @@ -import { shallowMount } from '@vue/test-utils'; import { GlAlert, GlLink } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; import UnmetPrerequisitesBlock from '~/jobs/components/unmet_prerequisites_block.vue'; describe('Unmet Prerequisites Block Job component', () => { diff --git a/spec/frontend/jobs/mixins/delayed_job_mixin_spec.js b/spec/frontend/jobs/mixins/delayed_job_mixin_spec.js index 2175610b7a6..838323df755 100644 --- a/spec/frontend/jobs/mixins/delayed_job_mixin_spec.js +++ b/spec/frontend/jobs/mixins/delayed_job_mixin_spec.js @@ -1,46 +1,42 @@ -import Vue from 'vue'; -import mountComponent from 'helpers/vue_mount_component_helper'; +import { shallowMount } from '@vue/test-utils'; import delayedJobMixin from '~/jobs/mixins/delayed_job_mixin'; describe('DelayedJobMixin', () => { + let wrapper; const delayedJobFixture = getJSONFixture('jobs/delayed.json'); - const dummyComponent = Vue.extend({ - mixins: [delayedJobMixin], + const dummyComponent = { props: { job: { type: Object, required: true, }, }, - render(createElement) { - return createElement('div', this.remainingTime); - }, - }); - - let vm; + mixins: [delayedJobMixin], + template: '<div>{{remainingTime}}</div>', + }; afterEach(() => { - vm.$destroy(); - jest.clearAllTimers(); + wrapper.destroy(); + wrapper = null; }); describe('if job is empty object', () => { beforeEach(() => { - vm = mountComponent(dummyComponent, { - job: {}, + wrapper = shallowMount(dummyComponent, { + propsData: { + job: {}, + }, }); }); it('sets remaining time to 00:00:00', () => { - expect(vm.$el.innerText).toBe('00:00:00'); + expect(wrapper.text()).toBe('00:00:00'); }); - describe('after mounting', () => { - beforeEach(() => vm.$nextTick()); + it('does not update remaining time after mounting', async () => { + await wrapper.vm.$nextTick(); - it('does not update remaining time', () => { - expect(vm.$el.innerText).toBe('00:00:00'); - }); + expect(wrapper.text()).toBe('00:00:00'); }); }); @@ -48,33 +44,32 @@ describe('DelayedJobMixin', () => { describe('if job is delayed job', () => { let remainingTimeInMilliseconds = 42000; - beforeEach(() => { + beforeEach(async () => { jest .spyOn(Date, 'now') .mockImplementation( () => new Date(delayedJobFixture.scheduled_at).getTime() - remainingTimeInMilliseconds, ); - vm = mountComponent(dummyComponent, { - job: delayedJobFixture, + wrapper = shallowMount(dummyComponent, { + propsData: { + job: delayedJobFixture, + }, }); - }); - describe('after mounting', () => { - beforeEach(() => vm.$nextTick()); + await wrapper.vm.$nextTick(); + }); - it('sets remaining time', () => { - expect(vm.$el.innerText).toBe('00:00:42'); - }); + it('sets remaining time', () => { + expect(wrapper.text()).toBe('00:00:42'); + }); - it('updates remaining time', () => { - remainingTimeInMilliseconds = 41000; - jest.advanceTimersByTime(1000); + it('updates remaining time', async () => { + remainingTimeInMilliseconds = 41000; + jest.advanceTimersByTime(1000); - return vm.$nextTick().then(() => { - expect(vm.$el.innerText).toBe('00:00:41'); - }); - }); + await wrapper.vm.$nextTick(); + expect(wrapper.text()).toBe('00:00:41'); }); }); }); @@ -96,33 +91,32 @@ describe('DelayedJobMixin', () => { describe('if job is delayed job', () => { let remainingTimeInMilliseconds = 42000; - beforeEach(() => { + beforeEach(async () => { jest .spyOn(Date, 'now') .mockImplementation( () => mockGraphQlJob.scheduledAt.getTime() - remainingTimeInMilliseconds, ); - vm = mountComponent(dummyComponent, { - job: mockGraphQlJob, + wrapper = shallowMount(dummyComponent, { + propsData: { + job: mockGraphQlJob, + }, }); - }); - describe('after mounting', () => { - beforeEach(() => vm.$nextTick()); + await wrapper.vm.$nextTick(); + }); - it('sets remaining time', () => { - expect(vm.$el.innerText).toBe('00:00:42'); - }); + it('sets remaining time', () => { + expect(wrapper.text()).toBe('00:00:42'); + }); - it('updates remaining time', () => { - remainingTimeInMilliseconds = 41000; - jest.advanceTimersByTime(1000); + it('updates remaining time', async () => { + remainingTimeInMilliseconds = 41000; + jest.advanceTimersByTime(1000); - return vm.$nextTick().then(() => { - expect(vm.$el.innerText).toBe('00:00:41'); - }); - }); + await wrapper.vm.$nextTick(); + expect(wrapper.text()).toBe('00:00:41'); }); }); }); diff --git a/spec/frontend/jobs/store/actions_spec.js b/spec/frontend/jobs/store/actions_spec.js index 2d757ce76bf..a29bd15099f 100644 --- a/spec/frontend/jobs/store/actions_spec.js +++ b/spec/frontend/jobs/store/actions_spec.js @@ -1,7 +1,6 @@ import MockAdapter from 'axios-mock-adapter'; -import testAction from 'helpers/vuex_action_helper'; import { TEST_HOST } from 'helpers/test_constants'; -import axios from '~/lib/utils/axios_utils'; +import testAction from 'helpers/vuex_action_helper'; import { setJobEndpoint, setTraceOptions, @@ -28,8 +27,9 @@ import { showSidebar, toggleSidebar, } from '~/jobs/store/actions'; -import state from '~/jobs/store/state'; import * as types from '~/jobs/store/mutation_types'; +import state from '~/jobs/store/state'; +import axios from '~/lib/utils/axios_utils'; describe('Job State actions', () => { let mockedState; diff --git a/spec/frontend/jobs/store/mutations_spec.js b/spec/frontend/jobs/store/mutations_spec.js index 608abc8f7c4..1c7e45dfb3d 100644 --- a/spec/frontend/jobs/store/mutations_spec.js +++ b/spec/frontend/jobs/store/mutations_spec.js @@ -1,6 +1,6 @@ -import state from '~/jobs/store/state'; -import mutations from '~/jobs/store/mutations'; import * as types from '~/jobs/store/mutation_types'; +import mutations from '~/jobs/store/mutations'; +import state from '~/jobs/store/state'; describe('Jobs Store Mutations', () => { let stateCopy; |