diff options
Diffstat (limited to 'spec/frontend/access_tokens/index_spec.js')
-rw-r--r-- | spec/frontend/access_tokens/index_spec.js | 74 |
1 files changed, 74 insertions, 0 deletions
diff --git a/spec/frontend/access_tokens/index_spec.js b/spec/frontend/access_tokens/index_spec.js new file mode 100644 index 00000000000..e3f17e21739 --- /dev/null +++ b/spec/frontend/access_tokens/index_spec.js @@ -0,0 +1,74 @@ +import { createWrapper } from '@vue/test-utils'; +import Vue from 'vue'; + +import { initExpiresAtField, initProjectsField } from '~/access_tokens'; +import * as ExpiresAtField from '~/access_tokens/components/expires_at_field.vue'; +import * as ProjectsField from '~/access_tokens/components/projects_field.vue'; + +describe('access tokens', () => { + const FakeComponent = Vue.component('FakeComponent', { + props: { + inputAttrs: { + type: Object, + required: true, + }, + }, + render: () => null, + }); + + beforeEach(() => { + window.gon = { features: { personalAccessTokensScopedToProjects: true } }; + }); + + afterEach(() => { + document.body.innerHTML = ''; + }); + + describe.each` + initFunction | mountSelector | expectedComponent + ${initExpiresAtField} | ${'js-access-tokens-expires-at'} | ${ExpiresAtField} + ${initProjectsField} | ${'js-access-tokens-projects'} | ${ProjectsField} + `('$initFunction', ({ initFunction, mountSelector, expectedComponent }) => { + describe('when mount element exists', () => { + beforeEach(() => { + const mountEl = document.createElement('div'); + mountEl.classList.add(mountSelector); + + const input = document.createElement('input'); + input.setAttribute('name', 'foo-bar'); + input.setAttribute('id', 'foo-bar'); + input.setAttribute('placeholder', 'Foo bar'); + input.setAttribute('value', '1,2'); + + mountEl.appendChild(input); + + document.body.appendChild(mountEl); + + // Mock component so we don't have to deal with mocking Apollo + // eslint-disable-next-line no-param-reassign + expectedComponent.default = FakeComponent; + }); + + it('mounts component and sets `inputAttrs` prop', async () => { + const vueInstance = await initFunction(); + + const wrapper = createWrapper(vueInstance); + const component = wrapper.findComponent(FakeComponent); + + expect(component.exists()).toBe(true); + expect(component.props('inputAttrs')).toEqual({ + name: 'foo-bar', + id: 'foo-bar', + value: '1,2', + placeholder: 'Foo bar', + }); + }); + }); + + describe('when mount element does not exist', () => { + it('returns `null`', () => { + expect(initFunction()).toBe(null); + }); + }); + }); +}); |