diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-02-11 00:15:20 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-02-11 00:15:20 +0300 |
commit | 9abffa14d6395d56b77313541d63e0c12ae2b602 (patch) | |
tree | 55eb69304c835d5e0b49344d331ee851add9647a /spec/frontend/jira_connect | |
parent | e0277d5393d958865fdec470176ac5874edded06 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/jira_connect')
4 files changed, 141 insertions, 64 deletions
diff --git a/spec/frontend/jira_connect/branches/components/new_branch_form_spec.js b/spec/frontend/jira_connect/branches/components/new_branch_form_spec.js index 901d9b5c267..b9fed5f34f1 100644 --- a/spec/frontend/jira_connect/branches/components/new_branch_form_spec.js +++ b/spec/frontend/jira_connect/branches/components/new_branch_form_spec.js @@ -1,4 +1,4 @@ -import { GlAlert, GlForm, GlFormInput, GlButton } from '@gitlab/ui'; +import { GlAlert, GlForm, GlFormInput, GlButton, GlSprintf } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import Vue from 'vue'; import VueApollo from 'vue-apollo'; @@ -10,17 +10,12 @@ import SourceBranchDropdown from '~/jira_connect/branches/components/source_bran import { CREATE_BRANCH_ERROR_GENERIC, CREATE_BRANCH_ERROR_WITH_CONTEXT, + I18N_NEW_BRANCH_PERMISSION_ALERT, } from '~/jira_connect/branches/constants'; import createBranchMutation from '~/jira_connect/branches/graphql/mutations/create_branch.mutation.graphql'; +import { mockProjects } from '../mock_data'; -const mockProject = { - id: 'test', - fullPath: 'test-path', - repository: { - branchNames: ['main', 'f-test', 'release'], - rootRef: 'main', - }, -}; +const mockProject = mockProjects[0]; const mockCreateBranchMutationResponse = { data: { createBranch: { @@ -52,14 +47,15 @@ describe('NewBranchForm', () => { const findSourceBranchDropdown = () => wrapper.findComponent(SourceBranchDropdown); const findProjectDropdown = () => wrapper.findComponent(ProjectDropdown); const findAlert = () => wrapper.findComponent(GlAlert); + const findAlertSprintf = () => findAlert().findComponent(GlSprintf); const findForm = () => wrapper.findComponent(GlForm); const findInput = () => wrapper.findComponent(GlFormInput); const findButton = () => wrapper.findComponent(GlButton); const completeForm = async () => { - await findInput().vm.$emit('input', 'cool-branch-name'); await findProjectDropdown().vm.$emit('change', mockProject); await findSourceBranchDropdown().vm.$emit('change', 'source-branch'); + await findInput().vm.$emit('input', 'cool-branch-name'); }; function createMockApolloProvider({ @@ -87,27 +83,107 @@ describe('NewBranchForm', () => { }); describe('when selecting items from dropdowns', () => { - describe('when a project is selected', () => { - it('sets the `selectedProject` prop for ProjectDropdown and SourceBranchDropdown', async () => { + describe('when no project selected', () => { + beforeEach(() => { createComponent(); + }); - const projectDropdown = findProjectDropdown(); - await projectDropdown.vm.$emit('change', mockProject); + it('hides source branch selection and branch name input', () => { + expect(findSourceBranchDropdown().exists()).toBe(false); + expect(findInput().exists()).toBe(false); + }); + + it('disables the submit button', () => { + expect(findButton().props('disabled')).toBe(true); + }); + }); + + describe('when a valid project is selected', () => { + describe("when a source branch isn't selected", () => { + beforeEach(async () => { + createComponent(); + await findProjectDropdown().vm.$emit('change', mockProject); + }); + + it('sets the `selectedProject` prop for ProjectDropdown and SourceBranchDropdown', () => { + expect(findProjectDropdown().props('selectedProject')).toEqual(mockProject); + expect(findSourceBranchDropdown().exists()).toBe(true); + expect(findSourceBranchDropdown().props('selectedProject')).toEqual(mockProject); + }); + + it('disables the submit button', () => { + expect(findButton().props('disabled')).toBe(true); + }); + + it('renders branch input field', () => { + expect(findInput().exists()).toBe(true); + }); + }); + + describe('when `initialBranchName` is provided', () => { + it('sets value of branch name input to `initialBranchName` by default', async () => { + const mockInitialBranchName = 'ap1-test-branch-name'; + + createComponent({ provide: { initialBranchName: mockInitialBranchName } }); + await findProjectDropdown().vm.$emit('change', mockProject); + + expect(findInput().attributes('value')).toBe(mockInitialBranchName); + }); + }); + + describe('when a source branch is selected', () => { + it('sets the `selectedBranchName` prop for SourceBranchDropdown', async () => { + createComponent(); + await completeForm(); + + const mockBranchName = 'main'; + const sourceBranchDropdown = findSourceBranchDropdown(); + await sourceBranchDropdown.vm.$emit('change', mockBranchName); + + expect(sourceBranchDropdown.props('selectedBranchName')).toBe(mockBranchName); + }); - expect(projectDropdown.props('selectedProject')).toEqual(mockProject); - expect(findSourceBranchDropdown().props('selectedProject')).toEqual(mockProject); + describe.each` + branchName | submitButtonDisabled + ${undefined} | ${true} + ${''} | ${true} + ${' '} | ${true} + ${'test-branch'} | ${false} + `('when branch name is $branchName', ({ branchName, submitButtonDisabled }) => { + it(`sets submit button 'disabled' prop to ${submitButtonDisabled}`, async () => { + createComponent(); + await completeForm(); + await findInput().vm.$emit('input', branchName); + + expect(findButton().props('disabled')).toBe(submitButtonDisabled); + }); + }); }); }); - describe('when a source branch is selected', () => { - it('sets the `selectedBranchName` prop for SourceBranchDropdown', async () => { + describe("when user doesn't have push permissions for the selected project", () => { + beforeEach(async () => { createComponent(); - const mockBranchName = 'main'; - const sourceBranchDropdown = findSourceBranchDropdown(); - await sourceBranchDropdown.vm.$emit('change', mockBranchName); + const projectDropdown = findProjectDropdown(); + await projectDropdown.vm.$emit('change', { + ...mockProject, + userPermissions: { pushCode: false }, + }); + }); + + it('displays an alert', () => { + const alert = findAlert(); + + expect(alert.exists()).toBe(true); + expect(findAlertSprintf().attributes('message')).toBe(I18N_NEW_BRANCH_PERMISSION_ALERT); + expect(alert.props('variant')).toBe('warning'); + expect(alert.props('dismissible')).toBe(false); + }); - expect(sourceBranchDropdown.props('selectedBranchName')).toBe(mockBranchName); + it('hides source branch selection and branch name input', () => { + expect(findSourceBranchDropdown().exists()).toBe(false); + expect(findInput().exists()).toBe(false); }); }); }); @@ -179,7 +255,7 @@ describe('NewBranchForm', () => { it('displays an alert', () => { const alert = findAlert(); expect(alert.exists()).toBe(true); - expect(alert.text()).toBe(alertText); + expect(findAlertSprintf().attributes('message')).toBe(alertText); expect(alert.props()).toMatchObject({ title: alertTitle, variant: 'danger' }); }); @@ -190,15 +266,6 @@ describe('NewBranchForm', () => { }); }); - describe('when `initialBranchName` is specified', () => { - it('sets value of branch name input to `initialBranchName` by default', () => { - const mockInitialBranchName = 'ap1-test-branch-name'; - - createComponent({ provide: { initialBranchName: mockInitialBranchName } }); - expect(findInput().attributes('value')).toBe(mockInitialBranchName); - }); - }); - describe('error handling', () => { describe.each` component | componentName @@ -209,13 +276,15 @@ describe('NewBranchForm', () => { beforeEach(async () => { createComponent(); + await completeForm(); await wrapper.findComponent(component).vm.$emit('error', { message: mockErrorMessage }); }); it('displays an alert', () => { const alert = findAlert(); + expect(alert.exists()).toBe(true); - expect(alert.text()).toBe(mockErrorMessage); + expect(findAlertSprintf().attributes('message')).toBe(mockErrorMessage); expect(alert.props('variant')).toBe('danger'); }); diff --git a/spec/frontend/jira_connect/branches/components/project_dropdown_spec.js b/spec/frontend/jira_connect/branches/components/project_dropdown_spec.js index 71fe75da911..136a5967ee4 100644 --- a/spec/frontend/jira_connect/branches/components/project_dropdown_spec.js +++ b/spec/frontend/jira_connect/branches/components/project_dropdown_spec.js @@ -14,30 +14,7 @@ import ProjectDropdown from '~/jira_connect/branches/components/project_dropdown import { PROJECTS_PER_PAGE } from '~/jira_connect/branches/constants'; import getProjectsQuery from '~/jira_connect/branches/graphql/queries/get_projects.query.graphql'; -const mockProjects = [ - { - id: 'test', - name: 'test', - nameWithNamespace: 'test', - avatarUrl: 'https://gitlab.com', - path: 'test-path', - fullPath: 'test-path', - repository: { - empty: false, - }, - }, - { - id: 'gitlab', - name: 'GitLab', - nameWithNamespace: 'gitlab-org/gitlab', - avatarUrl: 'https://gitlab.com', - path: 'gitlab', - fullPath: 'gitlab-org/gitlab', - repository: { - empty: false, - }, - }, -]; +import { mockProjects } from '../mock_data'; const mockProjectsQueryResponse = { data: { @@ -134,7 +111,7 @@ describe('ProjectDropdown', () => { }); describe('when selecting a dropdown item', () => { - it('emits `change` event with the selected project name', async () => { + it('emits `change` event with the selected project', async () => { const mockProject = mockProjects[0]; const itemToSelect = findDropdownItemByProjectId(mockProject.id); await itemToSelect.vm.$emit('click'); @@ -146,7 +123,7 @@ describe('ProjectDropdown', () => { describe('when `selectedProject` prop is specified', () => { const mockProject = mockProjects[0]; - beforeEach(async () => { + beforeEach(() => { wrapper.setProps({ selectedProject: mockProject, }); diff --git a/spec/frontend/jira_connect/branches/components/source_branch_dropdown_spec.js b/spec/frontend/jira_connect/branches/components/source_branch_dropdown_spec.js index 161bcc8c86d..56eb6d75def 100644 --- a/spec/frontend/jira_connect/branches/components/source_branch_dropdown_spec.js +++ b/spec/frontend/jira_connect/branches/components/source_branch_dropdown_spec.js @@ -7,15 +7,16 @@ import waitForPromises from 'helpers/wait_for_promises'; import SourceBranchDropdown from '~/jira_connect/branches/components/source_branch_dropdown.vue'; import { BRANCHES_PER_PAGE } from '~/jira_connect/branches/constants'; import getProjectQuery from '~/jira_connect/branches/graphql/queries/get_project.query.graphql'; +import { mockProjects } from '../mock_data'; const mockProject = { id: 'test', - fullPath: 'test-path', repository: { branchNames: ['main', 'f-test', 'release'], rootRef: 'main', }, }; +const mockSelectedProject = mockProjects[0]; const mockProjectQueryResponse = { data: { @@ -76,7 +77,7 @@ describe('SourceBranchDropdown', () => { describe('when `selectedProject` becomes specified', () => { beforeEach(async () => { wrapper.setProps({ - selectedProject: mockProject, + selectedProject: mockSelectedProject, }); await waitForPromises(); @@ -101,7 +102,7 @@ describe('SourceBranchDropdown', () => { it('renders loading icon in dropdown', () => { createComponent({ mockApollo: createMockApolloProvider({ getProjectQueryLoading: true }), - props: { selectedProject: mockProject }, + props: { selectedProject: mockSelectedProject }, }); expect(findLoadingIcon().isVisible()).toBe(true); @@ -111,7 +112,7 @@ describe('SourceBranchDropdown', () => { describe('when branches have loaded', () => { describe('when searching branches', () => { it('triggers a refetch', async () => { - createComponent({ mountFn: mount, props: { selectedProject: mockProject } }); + createComponent({ mountFn: mount, props: { selectedProject: mockSelectedProject } }); await waitForPromises(); jest.clearAllMocks(); @@ -129,7 +130,7 @@ describe('SourceBranchDropdown', () => { describe('template', () => { beforeEach(async () => { - createComponent({ props: { selectedProject: mockProject } }); + createComponent({ props: { selectedProject: mockSelectedProject } }); await waitForPromises(); }); diff --git a/spec/frontend/jira_connect/branches/mock_data.js b/spec/frontend/jira_connect/branches/mock_data.js new file mode 100644 index 00000000000..742ab5392c8 --- /dev/null +++ b/spec/frontend/jira_connect/branches/mock_data.js @@ -0,0 +1,30 @@ +export const mockProjects = [ + { + id: 'test', + name: 'test', + nameWithNamespace: 'test', + avatarUrl: 'https://gitlab.com', + path: 'test-path', + fullPath: 'test-path', + repository: { + empty: false, + }, + userPermissions: { + pushCode: true, + }, + }, + { + id: 'gitlab', + name: 'GitLab', + nameWithNamespace: 'gitlab-org/gitlab', + avatarUrl: 'https://gitlab.com', + path: 'gitlab', + fullPath: 'gitlab-org/gitlab', + repository: { + empty: false, + }, + userPermissions: { + pushCode: true, + }, + }, +]; |