diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-04-21 02:50:22 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-04-21 02:50:22 +0300 |
commit | 9dc93a4519d9d5d7be48ff274127136236a3adb3 (patch) | |
tree | 70467ae3692a0e35e5ea56bcb803eb512a10bedb /spec/frontend/pages | |
parent | 4b0f34b6d759d6299322b3a54453e930c6121ff0 (diff) |
Add latest changes from gitlab-org/gitlab@13-11-stable-eev13.11.0-rc43
Diffstat (limited to 'spec/frontend/pages')
15 files changed, 856 insertions, 126 deletions
diff --git a/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap b/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap index ddeaa2a79db..9f02e5b9432 100644 --- a/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap +++ b/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap @@ -50,11 +50,11 @@ exports[`User Operation confirmation modal renders modal with form included 1`] <gl-button-stub buttontextclasses="" - category="primary" + category="secondary" disabled="true" icon="" size="medium" - variant="warning" + variant="danger" > secondaryAction diff --git a/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js b/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js index c7293b00adf..318b6d16008 100644 --- a/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js +++ b/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js @@ -11,15 +11,15 @@ describe('User Operation confirmation modal', () => { let wrapper; let formSubmitSpy; - const findButton = (variant) => + const findButton = (variant, category) => wrapper .findAll(GlButton) - .filter((w) => w.attributes('variant') === variant) + .filter((w) => w.attributes('variant') === variant && w.attributes('category') === category) .at(0); const findForm = () => wrapper.find('form'); const findUsernameInput = () => wrapper.find(GlFormInput); - const findPrimaryButton = () => findButton('danger'); - const findSecondaryButton = () => findButton('warning'); + const findPrimaryButton = () => findButton('danger', 'primary'); + const findSecondaryButton = () => findButton('danger', 'secondary'); const findAuthenticityToken = () => new FormData(findForm().element).get('authenticity_token'); const getUsername = () => findUsernameInput().attributes('value'); const getMethodParam = () => new FormData(findForm().element).get('_method'); diff --git a/spec/frontend/pages/admin/users/new/index_spec.js b/spec/frontend/pages/admin/users/new/index_spec.js deleted file mode 100644 index ec9fe487030..00000000000 --- a/spec/frontend/pages/admin/users/new/index_spec.js +++ /dev/null @@ -1,41 +0,0 @@ -import $ from 'jquery'; -import UserInternalRegexHandler from '~/pages/admin/users/new/index'; - -describe('UserInternalRegexHandler', () => { - const FIXTURE = 'admin/users/new_with_internal_user_regex.html'; - let $userExternal; - let $userEmail; - let $warningMessage; - - beforeEach(() => { - loadFixtures(FIXTURE); - // eslint-disable-next-line no-new - new UserInternalRegexHandler(); - $userExternal = $('#user_external'); - $userEmail = $('#user_email'); - $warningMessage = $('#warning_external_automatically_set'); - if (!$userExternal.prop('checked')) $userExternal.prop('checked', 'checked'); - }); - - describe('Behaviour of userExternal checkbox when', () => { - it('matches email as internal', (done) => { - expect($warningMessage.hasClass('hidden')).toBeTruthy(); - - $userEmail.val('test@').trigger('input'); - - expect($userExternal.prop('checked')).toBeFalsy(); - expect($warningMessage.hasClass('hidden')).toBeFalsy(); - done(); - }); - - it('matches email as external', (done) => { - expect($warningMessage.hasClass('hidden')).toBeTruthy(); - - $userEmail.val('test.ext@').trigger('input'); - - expect($userExternal.prop('checked')).toBeTruthy(); - expect($warningMessage.hasClass('hidden')).toBeTruthy(); - done(); - }); - }); -}); diff --git a/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js b/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js index 694a0c2b9c1..2992c7f0624 100644 --- a/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js +++ b/spec/frontend/pages/projects/forks/new/components/fork_form_spec.js @@ -1,7 +1,8 @@ -import { GlForm, GlFormInputGroup } from '@gitlab/ui'; +import { GlForm, GlFormInputGroup, GlFormInput } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import axios from 'axios'; import AxiosMockAdapter from 'axios-mock-adapter'; +import { kebabCase } from 'lodash'; import createFlash from '~/flash'; import httpStatus from '~/lib/utils/http_status'; import * as urlUtility from '~/lib/utils/url_utility'; @@ -59,6 +60,7 @@ describe('ForkForm component', () => { }, stubs: { GlFormInputGroup, + GlFormInput, }, }); }; @@ -204,6 +206,37 @@ describe('ForkForm component', () => { }); }); + describe('project slug', () => { + const projectPath = 'some other project slug'; + + beforeEach(() => { + mockGetRequest(); + createComponent({ + projectPath, + }); + }); + + it('initially loads slug without kebab-case transformation', () => { + expect(findForkSlugInput().attributes('value')).toBe(projectPath); + }); + + it('changes to kebab case when project name changes', async () => { + const newInput = `${projectPath}1`; + findForkNameInput().vm.$emit('input', newInput); + await wrapper.vm.$nextTick(); + + expect(findForkSlugInput().attributes('value')).toBe(kebabCase(newInput)); + }); + + it('does not change to kebab case when project slug is changed manually', async () => { + const newInput = `${projectPath}1`; + findForkSlugInput().vm.$emit('input', newInput); + await wrapper.vm.$nextTick(); + + expect(findForkSlugInput().attributes('value')).toBe(newInput); + }); + }); + describe('visibility level', () => { it.each` project | namespace | privateIsDisabled | internalIsDisabled | publicIsDisabled diff --git a/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_a_spec.js.snap b/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_a_spec.js.snap index 1c1327e7a4e..8b54a06ac7c 100644 --- a/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_a_spec.js.snap +++ b/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_a_spec.js.snap @@ -1,70 +1,322 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`Learn GitLab Design A should render the loading state 1`] = ` -<ul> - <li> - <span> - Create or import a repository - </span> - </li> - <li> - <span> - Invite your colleagues - </span> - </li> - <li> - <span> - <gl-link-stub - href="http://example.com/" +exports[`Learn GitLab Design A renders correctly 1`] = ` +<div> + <div + class="row" + > + <div + class="gl-mb-7 gl-ml-5" + > + <h1 + class="gl-font-size-h1" > - Set up CI/CD - </gl-link-stub> - </span> - </li> - <li> - <span> - <gl-link-stub - href="http://example.com/" + Learn GitLab + </h1> + + <p + class="gl-text-gray-700 gl-mb-0" > - Start a free Ultimate trial - </gl-link-stub> - </span> - </li> - <li> - <span> - <gl-link-stub - href="http://example.com/" + Ready to get started with GitLab? Follow these steps to set up your workspace, plan and commit changes, and deploy your project. + </p> + </div> + </div> + + <div + class="gl-mb-3" + > + <p + class="gl-text-gray-500 gl-mb-2" + data-testid="completion-percentage" + > + 22% completed + </p> + + <div + class="progress" + max="9" + value="2" + > + <div + aria-valuemax="9" + aria-valuemin="0" + aria-valuenow="2" + class="progress-bar" + role="progressbar" + style="width: 22.22222222222222%;" > - Add code owners - </gl-link-stub> - </span> - </li> - <li> - <span> - <gl-link-stub - href="http://example.com/" + <!----> + </div> + </div> + </div> + + <div + class="row row-cols-1 row-cols-md-3 gl-mt-5" + > + <div + class="col gl-mb-6" + > + <div + class="gl-card gl-pt-0 learn-gitlab-section-card" > - Add merge request approval - </gl-link-stub> - </span> - </li> - <li> - <span> - <gl-link-stub - href="http://example.com/" + <!----> + + <div + class="gl-card-body" + > + <div + class="learn-gitlab-section-card-header" + > + <img + src="/assets/learn_gitlab/section_workspace.svg" + /> + + <h2 + class="gl-font-lg gl-mb-3" + > + Set up your workspace + </h2> + + <p + class="gl-text-gray-700 gl-mb-6" + > + Complete these tasks first so you can enjoy GitLab's features to their fullest: + </p> + </div> + + <div + class="gl-mb-4" + > + <span + class="gl-text-green-500" + > + <svg + aria-hidden="true" + class="gl-icon s16" + data-testid="completed-icon" + > + <use + href="#check-circle-filled" + /> + </svg> + + Invite your colleagues + + </span> + + <!----> + </div> + <div + class="gl-mb-4" + > + <span + class="gl-text-green-500" + > + <svg + aria-hidden="true" + class="gl-icon s16" + data-testid="completed-icon" + > + <use + href="#check-circle-filled" + /> + </svg> + + Create or import a repository + + </span> + + <!----> + </div> + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Set up CI/CD + </a> + </span> + + <!----> + </div> + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Start a free Ultimate trial + </a> + </span> + + <!----> + </div> + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Add code owners + </a> + </span> + + <span + class="gl-font-style-italic gl-text-gray-500" + data-testid="trial-only" + > + + - Trial only + + </span> + </div> + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Add merge request approval + </a> + </span> + + <span + class="gl-font-style-italic gl-text-gray-500" + data-testid="trial-only" + > + + - Trial only + + </span> + </div> + </div> + + <!----> + </div> + </div> + <div + class="col gl-mb-6" + > + <div + class="gl-card gl-pt-0 learn-gitlab-section-card" > - Submit a merge request - </gl-link-stub> - </span> - </li> - <li> - <span> - <gl-link-stub - href="http://example.com/" + <!----> + + <div + class="gl-card-body" + > + <div + class="learn-gitlab-section-card-header" + > + <img + src="/assets/learn_gitlab/section_plan.svg" + /> + + <h2 + class="gl-font-lg gl-mb-3" + > + Plan and execute + </h2> + + <p + class="gl-text-gray-700 gl-mb-6" + > + Create a workflow for your new workspace, and learn how GitLab features work together: + </p> + </div> + + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Create an issue + </a> + </span> + + <!----> + </div> + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Submit a merge request + </a> + </span> + + <!----> + </div> + </div> + + <!----> + </div> + </div> + <div + class="col gl-mb-6" + > + <div + class="gl-card gl-pt-0 learn-gitlab-section-card" > - Run a security scan - </gl-link-stub> - </span> - </li> -</ul> + <!----> + + <div + class="gl-card-body" + > + <div + class="learn-gitlab-section-card-header" + > + <img + src="/assets/learn_gitlab/section_deploy.svg" + /> + + <h2 + class="gl-font-lg gl-mb-3" + > + Deploy + </h2> + + <p + class="gl-text-gray-700 gl-mb-6" + > + Use your new GitLab workflow to deploy your application, monitor its health, and keep it secure: + </p> + </div> + + <div + class="gl-mb-4" + > + <span> + <a + class="gl-link" + href="http://example.com/" + > + Run a Security scan using CI/CD + </a> + </span> + + <!----> + </div> + </div> + + <!----> + </div> + </div> + </div> +</div> `; diff --git a/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_b_spec.js.snap b/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_b_spec.js.snap index dd899b93302..07c7f2df09e 100644 --- a/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_b_spec.js.snap +++ b/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_b_spec.js.snap @@ -29,21 +29,21 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-gray-500 gl-mb-2" data-testid="completion-percentage" > - 25% completed + 22% completed </p> <div class="progress" - max="8" + max="9" value="2" > <div - aria-valuemax="8" + aria-valuemax="9" aria-valuemin="0" aria-valuenow="2" class="progress-bar" role="progressbar" - style="width: 25%;" + style="width: 22.22222222222222%;" > <!----> </div> @@ -94,6 +94,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Invite your colleagues" src="http://example.com/images/illustration.svg" /> @@ -151,6 +152,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Create or import a repository" src="http://example.com/images/illustration.svg" /> @@ -200,6 +202,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Set-up CI/CD" src="http://example.com/images/illustration.svg" /> @@ -249,6 +252,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Try GitLab Ultimate for free" src="http://example.com/images/illustration.svg" /> @@ -303,6 +307,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Add code owners" src="http://example.com/images/illustration.svg" /> @@ -357,6 +362,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Enable require merge approvals" src="http://example.com/images/illustration.svg" /> @@ -422,6 +428,57 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Create an issue" + src="http://example.com/images/illustration.svg" + /> + + <h6> + Create an issue + </h6> + + <p + class="gl-font-sm gl-text-gray-700" + > + Create/import issues (tickets) to collaborate on ideas and plan work. + </p> + + <a + class="gl-link" + href="http://example.com/" + rel="noopener noreferrer" + target="_blank" + > + Create an issue + </a> + </div> + </div> + + <!----> + </div> + </div> + + <div + class="col gl-mb-6" + > + <div + class="gl-card gl-pt-0" + > + <!----> + + <div + class="gl-card-body" + > + <div + class="gl-text-right gl-h-5" + > + <!----> + </div> + + <div + class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" + > + <img + alt="Submit a merge request (MR)" src="http://example.com/images/illustration.svg" /> @@ -487,11 +544,12 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` class="gl-text-center gl-display-flex gl-justify-content-center gl-align-items-center gl-flex-direction-column learn-gitlab-info-card-content" > <img + alt="Run a Security scan using CI/CD" src="http://example.com/images/illustration.svg" /> <h6> - Run a security scan + Run a Security scan using CI/CD </h6> <p @@ -506,7 +564,7 @@ exports[`Learn GitLab Design B renders correctly 1`] = ` rel="noopener noreferrer" target="_blank" > - Run a Security scan + Run a Security scan using CI/CD </a> </div> </div> diff --git a/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_section_card_spec.js.snap b/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_section_card_spec.js.snap new file mode 100644 index 00000000000..ad8db0822cc --- /dev/null +++ b/spec/frontend/pages/projects/learn_gitlab/components/__snapshots__/learn_gitlab_section_card_spec.js.snap @@ -0,0 +1,67 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Learn GitLab Section Card renders correctly 1`] = ` +<gl-card-stub + bodyclass="" + class="gl-pt-0 learn-gitlab-section-card" + footerclass="" + headerclass="" +> + <div + class="learn-gitlab-section-card-header" + > + <img + src="/assets/learn_gitlab/section_workspace.svg" + /> + + <h2 + class="gl-font-lg gl-mb-3" + > + Set up your workspace + </h2> + + <p + class="gl-text-gray-700 gl-mb-6" + > + Complete these tasks first so you can enjoy GitLab's features to their fullest: + </p> + </div> + + <learn-gitlab-section-link-stub + action="userAdded" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="issueCreated" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="gitWrite" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="mergeRequestCreated" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="securityScanEnabled" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="pipelineCreated" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="trialStarted" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="codeOwnersEnabled" + value="[object Object]" + /> + <learn-gitlab-section-link-stub + action="requiredMrApprovalsEnabled" + value="[object Object]" + /> +</gl-card-stub> +`; diff --git a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js index 2154358de51..64ace341038 100644 --- a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js +++ b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js @@ -1,22 +1,38 @@ -import { shallowMount } from '@vue/test-utils'; +import { GlProgressBar } from '@gitlab/ui'; +import { mount } from '@vue/test-utils'; import LearnGitlabA from '~/pages/projects/learn_gitlab/components/learn_gitlab_a.vue'; import { testActions } from './mock_data'; describe('Learn GitLab Design A', () => { let wrapper; + const createWrapper = () => { + wrapper = mount(LearnGitlabA, { propsData: { actions: testActions } }); + }; + + beforeEach(() => { + createWrapper(); + }); + afterEach(() => { wrapper.destroy(); wrapper = null; }); - const createWrapper = () => { - wrapper = shallowMount(LearnGitlabA, { propsData: { actions: testActions } }); - }; + it('renders correctly', () => { + expect(wrapper.element).toMatchSnapshot(); + }); - it('should render the loading state', () => { - createWrapper(); + it('renders the progress percentage', () => { + const text = wrapper.find('[data-testid="completion-percentage"]').text(); - expect(wrapper.element).toMatchSnapshot(); + expect(text).toBe('22% completed'); + }); + + it('renders the progress bar with correct values', () => { + const progressBar = wrapper.findComponent(GlProgressBar); + + expect(progressBar.attributes('value')).toBe('2'); + expect(progressBar.attributes('max')).toBe('9'); }); }); diff --git a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_b_spec.js b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_b_spec.js index fbb989fae32..207944bfa1f 100644 --- a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_b_spec.js +++ b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_b_spec.js @@ -26,13 +26,13 @@ describe('Learn GitLab Design B', () => { it('renders the progress percentage', () => { const text = wrapper.find('[data-testid="completion-percentage"]').text(); - expect(text).toEqual('25% completed'); + expect(text).toBe('22% completed'); }); it('renders the progress bar with correct values', () => { - const progressBar = wrapper.find(GlProgressBar); + const progressBar = wrapper.findComponent(GlProgressBar); expect(progressBar.attributes('value')).toBe('2'); - expect(progressBar.attributes('max')).toBe('8'); + expect(progressBar.attributes('max')).toBe('9'); }); }); diff --git a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_section_card_spec.js b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_section_card_spec.js new file mode 100644 index 00000000000..de6aca08235 --- /dev/null +++ b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_section_card_spec.js @@ -0,0 +1,26 @@ +import { shallowMount } from '@vue/test-utils'; +import LearnGitlabSectionCard from '~/pages/projects/learn_gitlab/components/learn_gitlab_section_card.vue'; +import { testActions } from './mock_data'; + +const defaultSection = 'workspace'; + +describe('Learn GitLab Section Card', () => { + let wrapper; + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + const createWrapper = () => { + wrapper = shallowMount(LearnGitlabSectionCard, { + propsData: { section: defaultSection, actions: testActions }, + }); + }; + + it('renders correctly', () => { + createWrapper({ completed: false }); + + expect(wrapper.element).toMatchSnapshot(); + }); +}); diff --git a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_section_link_spec.js b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_section_link_spec.js new file mode 100644 index 00000000000..882d233a239 --- /dev/null +++ b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_section_link_spec.js @@ -0,0 +1,49 @@ +import { shallowMount } from '@vue/test-utils'; +import LearnGitlabSectionLink from '~/pages/projects/learn_gitlab/components/learn_gitlab_section_link.vue'; + +const defaultAction = 'gitWrite'; +const defaultProps = { + title: 'Create Repository', + description: 'Some description', + url: 'https://example.com', + completed: false, +}; + +describe('Learn GitLab Section Link', () => { + let wrapper; + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + const createWrapper = (action = defaultAction, props = {}) => { + wrapper = shallowMount(LearnGitlabSectionLink, { + propsData: { action, value: { ...defaultProps, ...props } }, + }); + }; + + it('renders no icon when not completed', () => { + createWrapper(undefined, { completed: false }); + + expect(wrapper.find('[data-testid="completed-icon"]').exists()).toBe(false); + }); + + it('renders the completion icon when completed', () => { + createWrapper(undefined, { completed: true }); + + expect(wrapper.find('[data-testid="completed-icon"]').exists()).toBe(true); + }); + + it('renders no trial only when it is not required', () => { + createWrapper(); + + expect(wrapper.find('[data-testid="trial-only"]').exists()).toBe(false); + }); + + it('renders trial only when trial is required', () => { + createWrapper('codeOwnersEnabled'); + + expect(wrapper.find('[data-testid="trial-only"]').exists()).toBe(true); + }); +}); diff --git a/spec/frontend/pages/projects/learn_gitlab/components/mock_data.js b/spec/frontend/pages/projects/learn_gitlab/components/mock_data.js index caac667e2b1..d6ee2b00c8e 100644 --- a/spec/frontend/pages/projects/learn_gitlab/components/mock_data.js +++ b/spec/frontend/pages/projects/learn_gitlab/components/mock_data.js @@ -39,4 +39,9 @@ export const testActions = { completed: false, svg: 'http://example.com/images/illustration.svg', }, + issueCreated: { + url: 'http://example.com/', + completed: false, + svg: 'http://example.com/images/illustration.svg', + }, }; diff --git a/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js b/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js index bee628c3a56..878721666ff 100644 --- a/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js +++ b/spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js @@ -46,6 +46,7 @@ const defaultProps = { pagesHelpPath: '/help/user/project/pages/introduction#gitlab-pages-access-control', packagesAvailable: false, packagesHelpPath: '/help/user/packages/index', + requestCveAvailable: true, }; describe('Settings Panel', () => { @@ -76,6 +77,7 @@ describe('Settings Panel', () => { const findRepositoryFeatureSetting = () => findRepositoryFeatureProjectRow().find(projectFeatureSetting); const findProjectVisibilitySettings = () => wrapper.find({ ref: 'project-visibility-settings' }); + const findIssuesSettingsRow = () => wrapper.find({ ref: 'issues-settings' }); const findAnalyticsRow = () => wrapper.find({ ref: 'analytics-settings' }); const findProjectVisibilityLevelInput = () => wrapper.find('[name="project[visibility_level]"]'); const findRequestAccessEnabledInput = () => @@ -174,6 +176,16 @@ describe('Settings Panel', () => { }); }); + describe('Issues settings', () => { + it('has label for CVE request toggle', () => { + wrapper = mountComponent(); + + expect(findIssuesSettingsRow().findComponent(GlToggle).props('label')).toBe( + settingsPanel.i18n.cve_request_toggle_label, + ); + }); + }); + describe('Repository', () => { it('should set the repository help text when the visibility level is set to private', () => { wrapper = mountComponent({ currentSettings: { visibilityLevel: visibilityOptions.PRIVATE } }); @@ -228,7 +240,7 @@ describe('Settings Panel', () => { }); }); - describe('Pipelines', () => { + describe('CI/CD', () => { it('should enable the builds access level input when the repository is enabled', () => { wrapper = mountComponent({ currentSettings: { repositoryAccessLevel: featureAccessLevel.EVERYONE }, @@ -304,6 +316,17 @@ describe('Settings Panel', () => { expect(findContainerRegistryEnabledInput().props('disabled')).toBe(true); }); + + it('has label for the toggle', () => { + wrapper = mountComponent({ + currentSettings: { visibilityLevel: visibilityOptions.PUBLIC }, + registryAvailable: true, + }); + + expect(findContainerRegistrySettings().findComponent(GlToggle).props('label')).toBe( + settingsPanel.i18n.containerRegistryLabel, + ); + }); }); describe('Git Large File Storage', () => { @@ -342,6 +365,15 @@ describe('Settings Panel', () => { expect(findLFSFeatureToggle().props('disabled')).toBe(true); }); + it('has label for toggle', () => { + wrapper = mountComponent({ + currentSettings: { repositoryAccessLevel: featureAccessLevel.EVERYONE }, + lfsAvailable: true, + }); + + expect(findLFSFeatureToggle().props('label')).toBe(settingsPanel.i18n.lfsLabel); + }); + it('should not change lfsEnabled when disabling the repository', async () => { // mount over shallowMount, because we are aiming to test rendered state of toggle wrapper = mountComponent({ currentSettings: { lfsEnabled: true } }, mount); @@ -432,6 +464,17 @@ describe('Settings Panel', () => { expect(findPackagesEnabledInput().props('disabled')).toBe(true); }); + + it('has label for toggle', () => { + wrapper = mountComponent({ + currentSettings: { repositoryAccessLevel: featureAccessLevel.EVERYONE }, + packagesAvailable: true, + }); + + expect(findPackagesEnabledInput().findComponent(GlToggle).props('label')).toBe( + settingsPanel.i18n.packagesLabel, + ); + }); }); describe('Pages', () => { diff --git a/spec/frontend/pages/shared/wikis/wiki_alert_spec.js b/spec/frontend/pages/shared/wikis/components/wiki_alert_spec.js index 6a18473b1a7..6a18473b1a7 100644 --- a/spec/frontend/pages/shared/wikis/wiki_alert_spec.js +++ b/spec/frontend/pages/shared/wikis/components/wiki_alert_spec.js diff --git a/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js b/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js new file mode 100644 index 00000000000..8ab0b87d2ee --- /dev/null +++ b/spec/frontend/pages/shared/wikis/components/wiki_form_spec.js @@ -0,0 +1,222 @@ +import { mount } from '@vue/test-utils'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; +import WikiForm from '~/pages/shared/wikis/components/wiki_form.vue'; + +describe('WikiForm', () => { + let wrapper; + + const findForm = () => wrapper.find('form'); + const findTitle = () => wrapper.find('#wiki_title'); + const findFormat = () => wrapper.find('#wiki_format'); + const findContent = () => wrapper.find('#wiki_content'); + const findMessage = () => wrapper.find('#wiki_message'); + const findSubmitButton = () => wrapper.findByTestId('wiki-submit-button'); + const findCancelButton = () => wrapper.findByTestId('wiki-cancel-button'); + const findTitleHelpLink = () => wrapper.findByTestId('wiki-title-help-link'); + const findMarkdownHelpLink = () => wrapper.findByTestId('wiki-markdown-help-link'); + + const pageInfoNew = { + persisted: false, + uploadsPath: '/project/path/-/wikis/attachments', + wikiPath: '/project/path/-/wikis', + helpPath: '/help/user/project/wiki/index', + markdownHelpPath: '/help/user/markdown', + markdownPreviewPath: '/project/path/-/wikis/.md/preview-markdown', + createPath: '/project/path/-/wikis/new', + }; + + const pageInfoPersisted = { + ...pageInfoNew, + persisted: true, + + title: 'My page', + content: 'My page content', + format: 'markdown', + path: '/project/path/-/wikis/home', + }; + + function createWrapper(persisted = false, pageInfo = {}) { + wrapper = extendedWrapper( + mount( + WikiForm, + { + provide: { + formatOptions: { + Markdown: 'markdown', + RDoc: 'rdoc', + AsciiDoc: 'asciidoc', + Org: 'org', + }, + pageInfo: { + ...(persisted ? pageInfoPersisted : pageInfoNew), + ...pageInfo, + }, + }, + }, + { attachToDocument: true }, + ), + ); + + jest.spyOn(wrapper.vm, 'onBeforeUnload'); + } + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + it.each` + title | persisted | message + ${'my page'} | ${false} | ${'Create my page'} + ${'my-page'} | ${false} | ${'Create my page'} + ${'somedir/my-page'} | ${false} | ${'Create somedir/my page'} + ${'my-page'} | ${true} | ${'Update my page'} + `( + 'updates the commit message to $message when title is $title and persisted=$persisted', + async ({ title, message, persisted }) => { + createWrapper(persisted); + + findTitle().setValue(title); + + await wrapper.vm.$nextTick(); + + expect(findMessage().element.value).toBe(message); + }, + ); + + it('sets the commit message to "Update My page" when the page first loads when persisted', async () => { + createWrapper(true); + + await wrapper.vm.$nextTick(); + + expect(findMessage().element.value).toBe('Update My page'); + }); + + it.each` + value | text + ${'markdown'} | ${'[Link Title](page-slug)'} + ${'rdoc'} | ${'{Link title}[link:page-slug]'} + ${'asciidoc'} | ${'link:page-slug[Link title]'} + ${'org'} | ${'[[page-slug]]'} + `('updates the link help message when format=$value is selected', async ({ value, text }) => { + createWrapper(); + + findFormat().find(`option[value=${value}]`).setSelected(); + + await wrapper.vm.$nextTick(); + + expect(wrapper.text()).toContain(text); + }); + + it('starts with no unload warning', async () => { + createWrapper(); + + await wrapper.vm.$nextTick(); + + window.dispatchEvent(new Event('beforeunload')); + + expect(wrapper.vm.onBeforeUnload).not.toHaveBeenCalled(); + }); + + it.each` + persisted | titleHelpText | titleHelpLink + ${true} | ${'You can move this page by adding the path to the beginning of the title.'} | ${'/help/user/project/wiki/index#move-a-wiki-page'} + ${false} | ${'You can specify the full path for the new file. We will automatically create any missing directories.'} | ${'/help/user/project/wiki/index#create-a-new-wiki-page'} + `( + 'shows appropriate title help text and help link for when persisted=$persisted', + async ({ persisted, titleHelpLink, titleHelpText }) => { + createWrapper(persisted); + + await wrapper.vm.$nextTick(); + + expect(wrapper.text()).toContain(titleHelpText); + expect(findTitleHelpLink().attributes().href).toEqual(titleHelpLink); + }, + ); + + it('shows correct link for wiki specific markdown docs', async () => { + createWrapper(); + + await wrapper.vm.$nextTick(); + + expect(findMarkdownHelpLink().attributes().href).toEqual( + '/help/user/markdown#wiki-specific-markdown', + ); + }); + + describe('when wiki content is updated', () => { + beforeEach(() => { + createWrapper(); + + const input = findContent(); + input.setValue('Lorem ipsum dolar sit!'); + input.element.dispatchEvent(new Event('input')); + + return wrapper.vm.$nextTick(); + }); + + it('sets before unload warning', () => { + window.dispatchEvent(new Event('beforeunload')); + + expect(wrapper.vm.onBeforeUnload).toHaveBeenCalled(); + }); + + it('when form submitted, unsets before unload warning', async () => { + findForm().element.dispatchEvent(new Event('submit')); + + await wrapper.vm.$nextTick(); + + window.dispatchEvent(new Event('beforeunload')); + + expect(wrapper.vm.onBeforeUnload).not.toHaveBeenCalled(); + }); + }); + + describe('submit button state', () => { + it.each` + title | content | buttonState | disabledAttr + ${'something'} | ${'something'} | ${'enabled'} | ${undefined} + ${''} | ${'something'} | ${'disabled'} | ${'disabled'} + ${'something'} | ${''} | ${'disabled'} | ${'disabled'} + ${''} | ${''} | ${'disabled'} | ${'disabled'} + ${' '} | ${' '} | ${'disabled'} | ${'disabled'} + `( + "when title='$title', content='$content', then the button is $buttonState'", + async ({ title, content, disabledAttr }) => { + createWrapper(); + + findTitle().setValue(title); + findContent().setValue(content); + + await wrapper.vm.$nextTick(); + + expect(findSubmitButton().attributes().disabled).toBe(disabledAttr); + }, + ); + + it.each` + persisted | buttonLabel + ${true} | ${'Save changes'} + ${false} | ${'Create page'} + `('when persisted=$persisted, label is set to $buttonLabel', ({ persisted, buttonLabel }) => { + createWrapper(persisted); + + expect(findSubmitButton().text()).toBe(buttonLabel); + }); + }); + + describe('cancel button state', () => { + it.each` + persisted | redirectLink + ${false} | ${'/project/path/-/wikis'} + ${true} | ${'/project/path/-/wikis/home'} + `( + 'when persisted=$persisted, redirects the user to appropriate path', + ({ persisted, redirectLink }) => { + createWrapper(persisted); + + expect(findCancelButton().attributes().href).toEqual(redirectLink); + }, + ); + }); +}); |