diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-04-08 21:09:50 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-04-08 21:09:50 +0000 |
commit | 76358aee81a471a5e71eaf3e8c2d91b7c9a0a5a9 (patch) | |
tree | df9ba3dcc09eb404de31e0d79cb8f0b77812e655 /spec/frontend/reports | |
parent | 80e9fdc9682cfbcfb9202a2733605a6a6bd23f05 (diff) | |
download | gitlab-ce-76358aee81a471a5e71eaf3e8c2d91b7c9a0a5a9.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/reports')
-rw-r--r-- | spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js | 112 |
1 files changed, 112 insertions, 0 deletions
diff --git a/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js b/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js new file mode 100644 index 00000000000..794deca42ac --- /dev/null +++ b/spec/frontend/reports/accessibility_report/components/accessibility_issue_body_spec.js @@ -0,0 +1,112 @@ +import { shallowMount } from '@vue/test-utils'; +import AccessibilityIssueBody from '~/reports/accessibility_report/components/accessibility_issue_body.vue'; + +const issue = { + name: + 'The accessibility scanning found 2 errors of the following type: WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.A.NoContent', + code: 'WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.A.NoContent', + message: 'This element has insufficient contrast at this conformance level.', + status: 'failed', + className: 'spec.test_spec', + learnMoreUrl: 'https://www.w3.org/TR/WCAG20-TECHS/H91.html', +}; + +describe('CustomMetricsForm', () => { + let wrapper; + + const mountComponent = ({ name, code, message, status, className }, isNew = false) => { + wrapper = shallowMount(AccessibilityIssueBody, { + propsData: { + issue: { + name, + code, + message, + status, + className, + }, + isNew, + }, + }); + }; + + const findIsNewBadge = () => wrapper.find({ ref: 'accessibility-issue-is-new-badge' }); + + beforeEach(() => { + mountComponent(issue); + }); + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + it('Displays the issue message', () => { + const description = wrapper.find({ ref: 'accessibility-issue-description' }).text(); + + expect(description).toContain(`Message: ${issue.message}`); + }); + + describe('When an issue code is present', () => { + it('Creates the correct URL for learning more about the issue code', () => { + const learnMoreUrl = wrapper + .find({ ref: 'accessibility-issue-learn-more' }) + .attributes('href'); + + expect(learnMoreUrl).toEqual(issue.learnMoreUrl); + }); + }); + + describe('When an issue code is not present', () => { + beforeEach(() => { + mountComponent({ + ...issue, + code: undefined, + }); + }); + + it('Creates a URL leading to the overview documentation page', () => { + const learnMoreUrl = wrapper + .find({ ref: 'accessibility-issue-learn-more' }) + .attributes('href'); + + expect(learnMoreUrl).toEqual('https://www.w3.org/TR/WCAG20-TECHS/Overview.html'); + }); + }); + + describe('When an issue code does not contain the TECHS code', () => { + beforeEach(() => { + mountComponent({ + ...issue, + code: 'WCAG2AA.Principle4.Guideline4_1.4_1_2', + }); + }); + + it('Creates a URL leading to the overview documentation page', () => { + const learnMoreUrl = wrapper + .find({ ref: 'accessibility-issue-learn-more' }) + .attributes('href'); + + expect(learnMoreUrl).toEqual('https://www.w3.org/TR/WCAG20-TECHS/Overview.html'); + }); + }); + + describe('When issue is new', () => { + beforeEach(() => { + mountComponent(issue, true); + }); + + it('Renders the new badge', () => { + expect(findIsNewBadge().exists()).toEqual(true); + }); + }); + + describe('When issue is not new', () => { + beforeEach(() => { + mountComponent(issue, false); + }); + + it('Does not render the new badge', () => { + expect(findIsNewBadge().exists()).toEqual(false); + }); + }); +}); |