diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-01-20 18:08:53 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-01-20 18:08:53 +0300 |
commit | 709948b7a69597b1efe24df9b0f388cc0b493dd9 (patch) | |
tree | a6cbb0b7a1243c5308f8d5afb703d1980edb4595 /spec/frontend/token_access | |
parent | 50ea04b6c6823aa1bd8d64cd9a77dcbd03b19053 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/token_access')
-rw-r--r-- | spec/frontend/token_access/mock_data.js | 26 | ||||
-rw-r--r-- | spec/frontend/token_access/opt_in_jwt_spec.js | 126 | ||||
-rw-r--r-- | spec/frontend/token_access/token_access_spec.js | 17 |
3 files changed, 169 insertions, 0 deletions
diff --git a/spec/frontend/token_access/mock_data.js b/spec/frontend/token_access/mock_data.js index 0c8ba266201..fff5a0ad4d0 100644 --- a/spec/frontend/token_access/mock_data.js +++ b/spec/frontend/token_access/mock_data.js @@ -105,3 +105,29 @@ export const mockProjects = [ __typename: 'Project', }, ]; + +export const optInJwtQueryResponse = (optInJwt) => ({ + data: { + project: { + id: '1', + ciCdSettings: { + optInJwt, + __typename: 'ProjectCiCdSetting', + }, + __typename: 'Project', + }, + }, +}); + +export const optInJwtMutationResponse = (optInJwt) => ({ + data: { + ciCdSettingsUpdate: { + ciCdSettings: { + optInJwt, + __typename: 'ProjectCiCdSetting', + }, + errors: [], + __typename: 'CiCdSettingsUpdatePayload', + }, + }, +}); diff --git a/spec/frontend/token_access/opt_in_jwt_spec.js b/spec/frontend/token_access/opt_in_jwt_spec.js new file mode 100644 index 00000000000..a25a480f889 --- /dev/null +++ b/spec/frontend/token_access/opt_in_jwt_spec.js @@ -0,0 +1,126 @@ +import { GlLoadingIcon, GlToggle } from '@gitlab/ui'; +import Vue from 'vue'; +import VueApollo from 'vue-apollo'; +import createMockApollo from 'helpers/mock_apollo_helper'; +import { mountExtended, shallowMountExtended } from 'helpers/vue_test_utils_helper'; +import waitForPromises from 'helpers/wait_for_promises'; +import { createAlert } from '~/flash'; +import OptInJwt from '~/token_access/components/opt_in_jwt.vue'; +import getOptInJwtSettingQuery from '~/token_access/graphql/queries/get_opt_in_jwt_setting.query.graphql'; +import updateOptInJwtMutation from '~/token_access/graphql/mutations/update_opt_in_jwt.mutation.graphql'; +import { optInJwtMutationResponse, optInJwtQueryResponse } from './mock_data'; + +const errorMessage = 'An error occurred'; +const error = new Error(errorMessage); + +Vue.use(VueApollo); + +jest.mock('~/flash'); + +describe('OptInJwt component', () => { + let wrapper; + + const failureHandler = jest.fn().mockRejectedValue(error); + const enabledOptInJwtHandler = jest.fn().mockResolvedValue(optInJwtQueryResponse(true)); + const disabledOptInJwtHandler = jest.fn().mockResolvedValue(optInJwtQueryResponse(false)); + const updateOptInJwtHandler = jest.fn().mockResolvedValue(optInJwtMutationResponse(true)); + + const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon); + const findToggle = () => wrapper.findComponent(GlToggle); + const findOptInJwtExpandedSection = () => wrapper.findByTestId('opt-in-jwt-expanded-section'); + + const createMockApolloProvider = (requestHandlers) => { + return createMockApollo(requestHandlers); + }; + + const createComponent = (requestHandlers, mountFn = shallowMountExtended) => { + wrapper = mountFn(OptInJwt, { + provide: { + fullPath: 'root/my-repo', + }, + apolloProvider: createMockApolloProvider(requestHandlers), + data() { + return { + targetProjectPath: 'root/test', + }; + }, + }); + }; + + describe('loading state', () => { + it('shows loading state and hides toggle while waiting on query to resolve', async () => { + createComponent([[getOptInJwtSettingQuery, enabledOptInJwtHandler]]); + + expect(findLoadingIcon().exists()).toBe(true); + expect(findToggle().exists()).toBe(false); + + await waitForPromises(); + + expect(findLoadingIcon().exists()).toBe(false); + expect(findToggle().exists()).toBe(true); + }); + }); + + describe('toggle JWT token access', () => { + it('code instruction is visible when toggle is enabled', async () => { + createComponent([[getOptInJwtSettingQuery, enabledOptInJwtHandler]]); + + await waitForPromises(); + + expect(findToggle().props('value')).toBe(true); + expect(findOptInJwtExpandedSection().exists()).toBe(true); + }); + + it('code instruction is hidden when toggle is disabled', async () => { + createComponent([[getOptInJwtSettingQuery, disabledOptInJwtHandler]]); + + await waitForPromises(); + + expect(findToggle().props('value')).toBe(false); + expect(findOptInJwtExpandedSection().exists()).toBe(false); + }); + + describe('update JWT token access', () => { + it('calls updateOptInJwtMutation with correct arguments', async () => { + createComponent( + [ + [getOptInJwtSettingQuery, disabledOptInJwtHandler], + [updateOptInJwtMutation, updateOptInJwtHandler], + ], + mountExtended, + ); + + await waitForPromises(); + + findToggle().vm.$emit('change', true); + + expect(updateOptInJwtHandler).toHaveBeenCalledWith({ + input: { + fullPath: 'root/my-repo', + optInJwt: true, + }, + }); + }); + + it('handles update error', async () => { + createComponent( + [ + [getOptInJwtSettingQuery, enabledOptInJwtHandler], + [updateOptInJwtMutation, failureHandler], + ], + mountExtended, + ); + + await waitForPromises(); + + findToggle().vm.$emit('change', false); + + await waitForPromises(); + + expect(createAlert).toHaveBeenCalledWith({ + message: 'An error occurred while update the setting. Please try again.', + }); + }); + }); + }); +}); diff --git a/spec/frontend/token_access/token_access_spec.js b/spec/frontend/token_access/token_access_spec.js index 6fe94e28548..62f546463a1 100644 --- a/spec/frontend/token_access/token_access_spec.js +++ b/spec/frontend/token_access/token_access_spec.js @@ -5,6 +5,7 @@ import createMockApollo from 'helpers/mock_apollo_helper'; import { mountExtended, shallowMountExtended } from 'helpers/vue_test_utils_helper'; import waitForPromises from 'helpers/wait_for_promises'; import { createAlert } from '~/flash'; +import OptInJwt from '~/token_access/components/opt_in_jwt.vue'; import TokenAccess from '~/token_access/components/token_access.vue'; import addProjectCIJobTokenScopeMutation from '~/token_access/graphql/mutations/add_project_ci_job_token_scope.mutation.graphql'; import removeProjectCIJobTokenScopeMutation from '~/token_access/graphql/mutations/remove_project_ci_job_token_scope.mutation.graphql'; @@ -40,6 +41,7 @@ describe('TokenAccess component', () => { const failureHandler = jest.fn().mockRejectedValue(error); const findToggle = () => wrapper.findComponent(GlToggle); + const findOptInJwt = () => wrapper.findComponent(OptInJwt); const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon); const findAddProjectBtn = () => wrapper.findByRole('button', { name: 'Add project' }); const findRemoveProjectBtn = () => wrapper.findByRole('button', { name: 'Remove access' }); @@ -82,6 +84,21 @@ describe('TokenAccess component', () => { }); }); + describe('template', () => { + beforeEach(async () => { + createComponent([ + [getCIJobTokenScopeQuery, enabledJobTokenScopeHandler], + [getProjectsWithCIJobTokenScopeQuery, getProjectsWithScopeHandler], + ]); + + await waitForPromises(); + }); + + it('renders the opt in jwt component', () => { + expect(findOptInJwt().exists()).toBe(true); + }); + }); + describe('fetching projects and scope', () => { it('fetches projects and scope correctly', () => { const expectedVariables = { |