diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-19 01:45:44 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-19 01:45:44 +0000 |
commit | 85dc423f7090da0a52c73eb66faf22ddb20efff9 (patch) | |
tree | 9160f299afd8c80c038f08e1545be119f5e3f1e1 /spec/frontend/vue_mr_widget/components | |
parent | 15c2c8c66dbe422588e5411eee7e68f1fa440bb8 (diff) | |
download | gitlab-ce-85dc423f7090da0a52c73eb66faf22ddb20efff9.tar.gz |
Add latest changes from gitlab-org/gitlab@13-4-stable-ee
Diffstat (limited to 'spec/frontend/vue_mr_widget/components')
11 files changed, 174 insertions, 216 deletions
diff --git a/spec/frontend/vue_mr_widget/components/mock_data.js b/spec/frontend/vue_mr_widget/components/mock_data.js index 39c7d75cda5..73e254f2b1a 100644 --- a/spec/frontend/vue_mr_widget/components/mock_data.js +++ b/spec/frontend/vue_mr_widget/components/mock_data.js @@ -1,4 +1,3 @@ -// eslint-disable-next-line import/prefer-default-export export const artifactsList = [ { text: 'result.txt', diff --git a/spec/frontend/vue_mr_widget/components/mr_widget_container_spec.js b/spec/frontend/vue_mr_widget/components/mr_widget_container_spec.js index 60f970e0018..4e3e918f7fb 100644 --- a/spec/frontend/vue_mr_widget/components/mr_widget_container_spec.js +++ b/spec/frontend/vue_mr_widget/components/mr_widget_container_spec.js @@ -20,8 +20,8 @@ describe('MrWidgetContainer', () => { it('has layout', () => { factory(); - expect(wrapper.is('.mr-widget-heading')).toBe(true); - expect(wrapper.contains('.mr-widget-content')).toBe(true); + expect(wrapper.classes()).toContain('mr-widget-heading'); + expect(wrapper.find('.mr-widget-content').exists()).toBe(true); }); it('accepts default slot', () => { @@ -31,7 +31,7 @@ describe('MrWidgetContainer', () => { }, }); - expect(wrapper.contains('.mr-widget-content .test-body')).toBe(true); + expect(wrapper.find('.mr-widget-content .test-body').exists()).toBe(true); }); it('accepts footer slot', () => { @@ -42,7 +42,7 @@ describe('MrWidgetContainer', () => { }, }); - expect(wrapper.contains('.mr-widget-content .test-body')).toBe(true); - expect(wrapper.contains('.test-footer')).toBe(true); + expect(wrapper.find('.mr-widget-content .test-body').exists()).toBe(true); + expect(wrapper.find('.test-footer').exists()).toBe(true); }); }); diff --git a/spec/frontend/vue_mr_widget/components/mr_widget_expandable_section_spec.js b/spec/frontend/vue_mr_widget/components/mr_widget_expandable_section_spec.js index 69a50899d4d..3e111cd308a 100644 --- a/spec/frontend/vue_mr_widget/components/mr_widget_expandable_section_spec.js +++ b/spec/frontend/vue_mr_widget/components/mr_widget_expandable_section_spec.js @@ -18,7 +18,7 @@ describe('MrWidgetExpanableSection', () => { }); it('renders Icon', () => { - expect(wrapper.contains(GlIcon)).toBe(true); + expect(wrapper.find(GlIcon).exists()).toBe(true); }); it('renders header slot', () => { diff --git a/spec/frontend/vue_mr_widget/components/mr_widget_header_spec.js b/spec/frontend/vue_mr_widget/components/mr_widget_header_spec.js index 21058005d29..caea9a757ae 100644 --- a/spec/frontend/vue_mr_widget/components/mr_widget_header_spec.js +++ b/spec/frontend/vue_mr_widget/components/mr_widget_header_spec.js @@ -25,10 +25,14 @@ describe('MRWidgetHeader', () => { const downloadEmailPatchesEl = vm.$el.querySelector('.js-download-email-patches'); const downloadPlainDiffEl = vm.$el.querySelector('.js-download-plain-diff'); - expect(downloadEmailPatchesEl.textContent.trim()).toEqual('Email patches'); - expect(downloadEmailPatchesEl.getAttribute('href')).toEqual('/mr/email-patches'); - expect(downloadPlainDiffEl.textContent.trim()).toEqual('Plain diff'); - expect(downloadPlainDiffEl.getAttribute('href')).toEqual('/mr/plainDiffPath'); + expect(downloadEmailPatchesEl.innerText.trim()).toEqual('Email patches'); + expect(downloadEmailPatchesEl.querySelector('a').getAttribute('href')).toEqual( + '/mr/email-patches', + ); + expect(downloadPlainDiffEl.innerText.trim()).toEqual('Plain diff'); + expect(downloadPlainDiffEl.querySelector('a').getAttribute('href')).toEqual( + '/mr/plainDiffPath', + ); }; describe('computed', () => { diff --git a/spec/frontend/vue_mr_widget/components/mr_widget_icon_spec.js b/spec/frontend/vue_mr_widget/components/mr_widget_icon_spec.js index cee0b9b0118..ea8b33495ab 100644 --- a/spec/frontend/vue_mr_widget/components/mr_widget_icon_spec.js +++ b/spec/frontend/vue_mr_widget/components/mr_widget_icon_spec.js @@ -1,6 +1,6 @@ import { shallowMount } from '@vue/test-utils'; +import { GlIcon } from '@gitlab/ui'; import MrWidgetIcon from '~/vue_merge_request_widget/components/mr_widget_icon.vue'; -import Icon from '~/vue_shared/components/icon.vue'; const TEST_ICON = 'commit'; @@ -21,6 +21,6 @@ describe('MrWidgetIcon', () => { it('renders icon and container', () => { expect(wrapper.is('.circle-icon-container')).toBe(true); - expect(wrapper.find(Icon).props('name')).toEqual(TEST_ICON); + expect(wrapper.find(GlIcon).props('name')).toEqual(TEST_ICON); }); }); diff --git a/spec/frontend/vue_mr_widget/components/mr_widget_pipeline_spec.js b/spec/frontend/vue_mr_widget/components/mr_widget_pipeline_spec.js index 6486826c3ec..7ecd8629607 100644 --- a/spec/frontend/vue_mr_widget/components/mr_widget_pipeline_spec.js +++ b/spec/frontend/vue_mr_widget/components/mr_widget_pipeline_spec.js @@ -29,6 +29,8 @@ describe('MRWidgetPipeline', () => { const findAllPipelineStages = () => wrapper.findAll(PipelineStage); const findPipelineCoverage = () => wrapper.find('[data-testid="pipeline-coverage"]'); const findPipelineCoverageDelta = () => wrapper.find('[data-testid="pipeline-coverage-delta"]'); + const findPipelineCoverageTooltipText = () => + wrapper.find('[data-testid="pipeline-coverage-tooltip"]').text(); const findMonitoringPipelineMessage = () => wrapper.find('[data-testid="monitoring-pipeline-message"]'); const findLoadingIcon = () => wrapper.find(GlLoadingIcon); @@ -49,257 +51,208 @@ describe('MRWidgetPipeline', () => { } }); - describe('computed', () => { - describe('hasPipeline', () => { - beforeEach(() => { - createWrapper(); - }); - - it('should return true when there is a pipeline', () => { - expect(wrapper.vm.hasPipeline).toBe(true); - }); + it('should render CI error if there is a pipeline, but no status', () => { + createWrapper({ ciStatus: null }, mount); + expect(findCIErrorMessage().text()).toBe(ciErrorMessage); + }); - it('should return false when there is no pipeline', async () => { - wrapper.setProps({ pipeline: {} }); + it('should render a loading state when no pipeline is found', () => { + createWrapper({ pipeline: {} }, mount); - await wrapper.vm.$nextTick(); + expect(findMonitoringPipelineMessage().text()).toBe(monitoringMessage); + expect(findLoadingIcon().exists()).toBe(true); + }); - expect(wrapper.vm.hasPipeline).toBe(false); + describe('with a pipeline', () => { + beforeEach(() => { + createWrapper({ + pipelineCoverageDelta: mockData.pipelineCoverageDelta, + buildsWithCoverage: mockData.buildsWithCoverage, }); }); - describe('hasCIError', () => { - beforeEach(() => { - createWrapper(); - }); + it('should render pipeline ID', () => { + expect( + findPipelineID() + .text() + .trim(), + ).toBe(`#${mockData.pipeline.id}`); + }); - it('should return false when there is no CI error', () => { - expect(wrapper.vm.hasCIError).toBe(false); - }); + it('should render pipeline status and commit id', () => { + expect(findPipelineInfoContainer().text()).toMatch(mockData.pipeline.details.status.label); - it('should return true when there is a pipeline, but no ci status', async () => { - wrapper.setProps({ ciStatus: null }); + expect( + findCommitLink() + .text() + .trim(), + ).toBe(mockData.pipeline.commit.short_id); - await wrapper.vm.$nextTick(); + expect(findCommitLink().attributes('href')).toBe(mockData.pipeline.commit.commit_path); + }); - expect(wrapper.vm.hasCIError).toBe(true); - }); + it('should render pipeline graph', () => { + expect(findPipelineGraph().exists()).toBe(true); + expect(findAllPipelineStages().length).toBe(mockData.pipeline.details.stages.length); }); - describe('coverageDeltaClass', () => { - beforeEach(() => { - createWrapper({ pipelineCoverageDelta: '0' }); + describe('should render pipeline coverage information', () => { + it('should render coverage percentage', () => { + expect(findPipelineCoverage().text()).toMatch(`Coverage ${mockData.pipeline.coverage}%`); }); - it('should return no class if there is no coverage change', async () => { - expect(wrapper.vm.coverageDeltaClass).toBe(''); + it('should render coverage delta', () => { + expect(findPipelineCoverageDelta().exists()).toBe(true); + expect(findPipelineCoverageDelta().text()).toBe(`(${mockData.pipelineCoverageDelta}%)`); }); - it('should return text-success if the coverage increased', async () => { - wrapper.setProps({ pipelineCoverageDelta: '10' }); - - await wrapper.vm.$nextTick(); + it('coverage delta should have no special style if there is no coverage change', () => { + createWrapper({ pipelineCoverageDelta: '0' }); + expect(findPipelineCoverageDelta().classes()).toEqual([]); + }); - expect(wrapper.vm.coverageDeltaClass).toBe('text-success'); + it('coverage delta should have text-success style if coverage increased', () => { + createWrapper({ pipelineCoverageDelta: '10' }); + expect(findPipelineCoverageDelta().classes()).toEqual(['text-success']); }); - it('should return text-danger if the coverage decreased', async () => { - wrapper.setProps({ pipelineCoverageDelta: '-12' }); + it('coverage delta should have text-danger style if coverage increased', () => { + createWrapper({ pipelineCoverageDelta: '-10' }); + expect(findPipelineCoverageDelta().classes()).toEqual(['text-danger']); + }); - await wrapper.vm.$nextTick(); + it('should render tooltip for jobs contributing to code coverage', () => { + const tooltipText = findPipelineCoverageTooltipText(); + const expectedDescription = `Coverage value for this pipeline was calculated by averaging the resulting coverage values of ${mockData.buildsWithCoverage.length} jobs.`; - expect(wrapper.vm.coverageDeltaClass).toBe('text-danger'); + expect(tooltipText).toContain(expectedDescription); }); + + it.each(mockData.buildsWithCoverage)( + 'should have name and coverage for build %s listed in tooltip', + build => { + const tooltipText = findPipelineCoverageTooltipText(); + + expect(tooltipText).toContain(`${build.name} (${build.coverage}%)`); + }, + ); }); }); - describe('rendered output', () => { + describe('without commit path', () => { beforeEach(() => { - createWrapper({ ciStatus: null }, mount); - }); + const mockCopy = JSON.parse(JSON.stringify(mockData)); + delete mockCopy.pipeline.commit; - it('should render CI error if there is a pipeline, but no status', async () => { - expect(findCIErrorMessage().text()).toBe(ciErrorMessage); + createWrapper({}); }); - it('should render a loading state when no pipeline is found', async () => { - wrapper.setProps({ - pipeline: {}, - hasCi: false, - pipelineMustSucceed: true, - }); - - await wrapper.vm.$nextTick(); - - expect(findMonitoringPipelineMessage().text()).toBe(monitoringMessage); - expect(findLoadingIcon().exists()).toBe(true); + it('should render pipeline ID', () => { + expect( + findPipelineID() + .text() + .trim(), + ).toBe(`#${mockData.pipeline.id}`); }); - describe('with a pipeline', () => { - beforeEach(() => { - createWrapper( - { - pipelineCoverageDelta: mockData.pipelineCoverageDelta, - }, - mount, - ); - }); - - it('should render pipeline ID', () => { - expect( - findPipelineID() - .text() - .trim(), - ).toBe(`#${mockData.pipeline.id}`); - }); - - it('should render pipeline status and commit id', () => { - expect(findPipelineInfoContainer().text()).toMatch(mockData.pipeline.details.status.label); - - expect( - findCommitLink() - .text() - .trim(), - ).toBe(mockData.pipeline.commit.short_id); - - expect(findCommitLink().attributes('href')).toBe(mockData.pipeline.commit.commit_path); - }); - - it('should render pipeline graph', () => { - expect(findPipelineGraph().exists()).toBe(true); - expect(findAllPipelineStages().length).toBe(mockData.pipeline.details.stages.length); - }); - - it('should render coverage information', () => { - expect(findPipelineCoverage().text()).toMatch(`Coverage ${mockData.pipeline.coverage}%`); - }); + it('should render pipeline status', () => { + expect(findPipelineInfoContainer().text()).toMatch(mockData.pipeline.details.status.label); + }); - it('should render pipeline coverage delta information', () => { - expect(findPipelineCoverageDelta().exists()).toBe(true); - expect(findPipelineCoverageDelta().text()).toBe(`(${mockData.pipelineCoverageDelta}%)`); - }); + it('should render pipeline graph', () => { + expect(findPipelineGraph().exists()).toBe(true); + expect(findAllPipelineStages().length).toBe(mockData.pipeline.details.stages.length); }); - describe('without commit path', () => { - beforeEach(() => { - const mockCopy = JSON.parse(JSON.stringify(mockData)); - delete mockCopy.pipeline.commit; + it('should render coverage information', () => { + expect(findPipelineCoverage().text()).toMatch(`Coverage ${mockData.pipeline.coverage}%`); + }); + }); - createWrapper({}, mount); - }); + describe('without coverage', () => { + beforeEach(() => { + const mockCopy = JSON.parse(JSON.stringify(mockData)); + delete mockCopy.pipeline.coverage; - it('should render pipeline ID', () => { - expect( - findPipelineID() - .text() - .trim(), - ).toBe(`#${mockData.pipeline.id}`); - }); + createWrapper({ pipeline: mockCopy.pipeline }); + }); - it('should render pipeline status', () => { - expect(findPipelineInfoContainer().text()).toMatch(mockData.pipeline.details.status.label); - }); + it('should not render a coverage component', () => { + expect(findPipelineCoverage().exists()).toBe(false); + }); + }); - it('should render pipeline graph', () => { - expect(findPipelineGraph().exists()).toBe(true); - expect(findAllPipelineStages().length).toBe(mockData.pipeline.details.stages.length); - }); + describe('without a pipeline graph', () => { + beforeEach(() => { + const mockCopy = JSON.parse(JSON.stringify(mockData)); + delete mockCopy.pipeline.details.stages; - it('should render coverage information', () => { - expect(findPipelineCoverage().text()).toMatch(`Coverage ${mockData.pipeline.coverage}%`); + createWrapper({ + pipeline: mockCopy.pipeline, }); }); - describe('without coverage', () => { - beforeEach(() => { - const mockCopy = JSON.parse(JSON.stringify(mockData)); - delete mockCopy.pipeline.coverage; - - createWrapper( - { - pipeline: mockCopy.pipeline, - }, - mount, - ); - }); - - it('should not render a coverage component', () => { - expect(findPipelineCoverage().exists()).toBe(false); - }); + it('should not render a pipeline graph', () => { + expect(findPipelineGraph().exists()).toBe(false); }); + }); - describe('without a pipeline graph', () => { - beforeEach(() => { - const mockCopy = JSON.parse(JSON.stringify(mockData)); - delete mockCopy.pipeline.details.stages; + describe('for each type of pipeline', () => { + let pipeline; - createWrapper({ - pipeline: mockCopy.pipeline, - }); - }); + beforeEach(() => { + ({ pipeline } = JSON.parse(JSON.stringify(mockData))); - it('should not render a pipeline graph', () => { - expect(findPipelineGraph().exists()).toBe(false); - }); + pipeline.details.name = 'Pipeline'; + pipeline.merge_request_event_type = undefined; + pipeline.ref.tag = false; + pipeline.ref.branch = false; }); - describe('for each type of pipeline', () => { - let pipeline; - - beforeEach(() => { - ({ pipeline } = JSON.parse(JSON.stringify(mockData))); - - pipeline.details.name = 'Pipeline'; - pipeline.merge_request_event_type = undefined; - pipeline.ref.tag = false; - pipeline.ref.branch = false; + const factory = () => { + createWrapper({ + pipeline, + sourceBranchLink: mockData.source_branch_link, }); + }; - const factory = () => { - createWrapper({ - pipeline, - sourceBranchLink: mockData.source_branch_link, - }); - }; - - describe('for a branch pipeline', () => { - it('renders a pipeline widget that reads "Pipeline <ID> <status> for <SHA> on <branch>"', () => { - pipeline.ref.branch = true; + describe('for a branch pipeline', () => { + it('renders a pipeline widget that reads "Pipeline <ID> <status> for <SHA> on <branch>"', () => { + pipeline.ref.branch = true; - factory(); + factory(); - const expected = `Pipeline #${pipeline.id} ${pipeline.details.status.label} for ${pipeline.commit.short_id} on ${mockData.source_branch_link}`; - const actual = trimText(findPipelineInfoContainer().text()); + const expected = `Pipeline #${pipeline.id} ${pipeline.details.status.label} for ${pipeline.commit.short_id} on ${mockData.source_branch_link}`; + const actual = trimText(findPipelineInfoContainer().text()); - expect(actual).toBe(expected); - }); + expect(actual).toBe(expected); }); + }); - describe('for a tag pipeline', () => { - it('renders a pipeline widget that reads "Pipeline <ID> <status> for <SHA> on <branch>"', () => { - pipeline.ref.tag = true; + describe('for a tag pipeline', () => { + it('renders a pipeline widget that reads "Pipeline <ID> <status> for <SHA> on <branch>"', () => { + pipeline.ref.tag = true; - factory(); + factory(); - const expected = `Pipeline #${pipeline.id} ${pipeline.details.status.label} for ${pipeline.commit.short_id}`; - const actual = trimText(findPipelineInfoContainer().text()); + const expected = `Pipeline #${pipeline.id} ${pipeline.details.status.label} for ${pipeline.commit.short_id}`; + const actual = trimText(findPipelineInfoContainer().text()); - expect(actual).toBe(expected); - }); + expect(actual).toBe(expected); }); + }); - describe('for a detached merge request pipeline', () => { - it('renders a pipeline widget that reads "Detached merge request pipeline <ID> <status> for <SHA>"', () => { - pipeline.details.name = 'Detached merge request pipeline'; - pipeline.merge_request_event_type = 'detached'; + describe('for a detached merge request pipeline', () => { + it('renders a pipeline widget that reads "Detached merge request pipeline <ID> <status> for <SHA>"', () => { + pipeline.details.name = 'Detached merge request pipeline'; + pipeline.merge_request_event_type = 'detached'; - factory(); + factory(); - const expected = `Detached merge request pipeline #${pipeline.id} ${pipeline.details.status.label} for ${pipeline.commit.short_id}`; - const actual = trimText(findPipelineInfoContainer().text()); + const expected = `Detached merge request pipeline #${pipeline.id} ${pipeline.details.status.label} for ${pipeline.commit.short_id}`; + const actual = trimText(findPipelineInfoContainer().text()); - expect(actual).toBe(expected); - }); + expect(actual).toBe(expected); }); }); }); diff --git a/spec/frontend/vue_mr_widget/components/review_app_link_spec.js b/spec/frontend/vue_mr_widget/components/review_app_link_spec.js index 7b063653a93..7d47621c64a 100644 --- a/spec/frontend/vue_mr_widget/components/review_app_link_spec.js +++ b/spec/frontend/vue_mr_widget/components/review_app_link_spec.js @@ -30,7 +30,7 @@ describe('review app link', () => { }); it('renders provided cssClass as class attribute', () => { - expect(el.getAttribute('class')).toEqual(props.cssClass); + expect(el.getAttribute('class')).toContain(props.cssClass); }); it('renders View app text', () => { diff --git a/spec/frontend/vue_mr_widget/components/states/mr_widget_commits_header_spec.js b/spec/frontend/vue_mr_widget/components/states/mr_widget_commits_header_spec.js index 67746b062b9..62fc3330444 100644 --- a/spec/frontend/vue_mr_widget/components/states/mr_widget_commits_header_spec.js +++ b/spec/frontend/vue_mr_widget/components/states/mr_widget_commits_header_spec.js @@ -1,6 +1,5 @@ import { shallowMount } from '@vue/test-utils'; import CommitsHeader from '~/vue_merge_request_widget/components/states/commits_header.vue'; -import Icon from '~/vue_shared/components/icon.vue'; describe('Commits header component', () => { let wrapper; @@ -23,7 +22,6 @@ describe('Commits header component', () => { const findHeaderWrapper = () => wrapper.find('.js-mr-widget-commits-count'); const findCommitToggle = () => wrapper.find('.commit-edit-toggle'); - const findIcon = () => wrapper.find(Icon); const findCommitsCountMessage = () => wrapper.find('.commits-count-message'); const findTargetBranchMessage = () => wrapper.find('.label-branch'); const findModifyButton = () => wrapper.find('.modify-message-button'); @@ -61,7 +59,7 @@ describe('Commits header component', () => { wrapper.setData({ expanded: false }); return wrapper.vm.$nextTick().then(() => { - expect(findIcon().props('name')).toBe('chevron-right'); + expect(findCommitToggle().props('icon')).toBe('chevron-right'); }); }); @@ -119,7 +117,7 @@ describe('Commits header component', () => { it('has a chevron-down icon', done => { wrapper.vm.$nextTick(() => { - expect(findIcon().props('name')).toBe('chevron-down'); + expect(findCommitToggle().props('icon')).toBe('chevron-down'); done(); }); }); diff --git a/spec/frontend/vue_mr_widget/components/states/mr_widget_conflicts_spec.js b/spec/frontend/vue_mr_widget/components/states/mr_widget_conflicts_spec.js index c3a16a776a7..19f8a67d066 100644 --- a/spec/frontend/vue_mr_widget/components/states/mr_widget_conflicts_spec.js +++ b/spec/frontend/vue_mr_widget/components/states/mr_widget_conflicts_spec.js @@ -148,8 +148,8 @@ describe('MRWidgetConflicts', () => { }, }); - expect(vm.contains('.js-resolve-conflicts-button')).toBe(false); - expect(vm.contains('.js-merge-locally-button')).toBe(false); + expect(vm.find('.js-resolve-conflicts-button').exists()).toBe(false); + expect(vm.find('.js-merge-locally-button').exists()).toBe(false); }); it('should not have resolve button when no conflict resolution path', () => { @@ -161,7 +161,7 @@ describe('MRWidgetConflicts', () => { }, }); - expect(vm.contains('.js-resolve-conflicts-button')).toBe(false); + expect(vm.find('.js-resolve-conflicts-button').exists()).toBe(false); }); }); diff --git a/spec/frontend/vue_mr_widget/components/states/mr_widget_failed_to_merge_spec.js b/spec/frontend/vue_mr_widget/components/states/mr_widget_failed_to_merge_spec.js index f591393d721..6778a8f4a1f 100644 --- a/spec/frontend/vue_mr_widget/components/states/mr_widget_failed_to_merge_spec.js +++ b/spec/frontend/vue_mr_widget/components/states/mr_widget_failed_to_merge_spec.js @@ -125,7 +125,11 @@ describe('MRWidgetFailedToMerge', () => { }); it('renders refresh button', () => { - expect(vm.$el.querySelector('.js-refresh-button').textContent.trim()).toEqual('Refresh now'); + expect( + vm.$el + .querySelector('[data-testid="merge-request-failed-refresh-button"]') + .textContent.trim(), + ).toEqual('Refresh now'); }); it('renders remaining time', () => { diff --git a/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js b/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js index ffcf9b1477a..7fe6b44ecc7 100644 --- a/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js +++ b/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js @@ -1,4 +1,4 @@ -import { GlSkeletonLoading, GlSprintf } from '@gitlab/ui'; +import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlSprintf } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; import { invalidPlanWithName, plans, validPlanWithName } from './mock_data'; @@ -49,8 +49,8 @@ describe('MrWidgetTerraformConainer', () => { }); it('diplays loading skeleton', () => { - expect(wrapper.contains(GlSkeletonLoading)).toBe(true); - expect(wrapper.contains(MrWidgetExpanableSection)).toBe(false); + expect(wrapper.find(GlSkeletonLoading).exists()).toBe(true); + expect(wrapper.find(MrWidgetExpanableSection).exists()).toBe(false); }); }); @@ -61,8 +61,8 @@ describe('MrWidgetTerraformConainer', () => { }); it('displays terraform content', () => { - expect(wrapper.contains(GlSkeletonLoading)).toBe(false); - expect(wrapper.contains(MrWidgetExpanableSection)).toBe(true); + expect(wrapper.find(GlSkeletonLoading).exists()).toBe(false); + expect(wrapper.find(MrWidgetExpanableSection).exists()).toBe(true); expect(findPlans()).toEqual(Object.values(plans)); }); @@ -156,7 +156,7 @@ describe('MrWidgetTerraformConainer', () => { }); it('stops loading', () => { - expect(wrapper.contains(GlSkeletonLoading)).toBe(false); + expect(wrapper.find(GlSkeletonLoading).exists()).toBe(false); }); it('generates one broken plan', () => { |