debian-mirror-gitlab/spec/frontend/access_tokens/index_spec.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

181 lines
6 KiB
JavaScript
Raw Normal View History

2021-04-17 20:07:23 +05:30
import { createWrapper } from '@vue/test-utils';
2022-07-23 23:45:48 +05:30
import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
2021-04-17 20:07:23 +05:30
2022-07-23 23:45:48 +05:30
import {
initAccessTokenTableApp,
initExpiresAtField,
initNewAccessTokenApp,
initTokensApp,
} from '~/access_tokens';
2022-11-25 23:54:43 +05:30
import AccessTokenTableApp from '~/access_tokens/components/access_token_table_app.vue';
2022-08-27 11:52:29 +05:30
import ExpiresAtField from '~/access_tokens/components/expires_at_field.vue';
2022-11-25 23:54:43 +05:30
import NewAccessTokenApp from '~/access_tokens/components/new_access_token_app.vue';
import TokensApp from '~/access_tokens/components/tokens_app.vue';
import { FORM_SELECTOR } from '~/access_tokens/components/constants';
2022-07-23 23:45:48 +05:30
import { FEED_TOKEN, INCOMING_EMAIL_TOKEN, STATIC_OBJECT_TOKEN } from '~/access_tokens/constants';
import { __, sprintf } from '~/locale';
2021-04-17 20:07:23 +05:30
describe('access tokens', () => {
2022-07-23 23:45:48 +05:30
let wrapper;
2021-04-17 20:07:23 +05:30
2022-07-23 23:45:48 +05:30
afterEach(() => {
wrapper?.destroy();
resetHTMLFixture();
2021-04-17 20:07:23 +05:30
});
2022-07-23 23:45:48 +05:30
describe('initAccessTokenTableApp', () => {
const accessTokenType = 'personal access token';
const accessTokenTypePlural = 'personal access tokens';
2022-11-25 23:54:43 +05:30
const initialActiveAccessTokens = [{ revoked_path: '1' }];
2022-07-23 23:45:48 +05:30
it('mounts the component and provides required values', () => {
setHTMLFixture(
`<div id="js-access-token-table-app"
data-access-token-type="${accessTokenType}"
data-access-token-type-plural="${accessTokenTypePlural}"
data-initial-active-access-tokens=${JSON.stringify(initialActiveAccessTokens)}
>
</div>`,
);
const vueInstance = initAccessTokenTableApp();
wrapper = createWrapper(vueInstance);
2022-11-25 23:54:43 +05:30
const component = wrapper.findComponent({ name: 'AccessTokenTableRoot' });
2022-07-23 23:45:48 +05:30
expect(component.exists()).toBe(true);
2022-11-25 23:54:43 +05:30
expect(wrapper.findComponent(AccessTokenTableApp).vm).toMatchObject({
2022-07-23 23:45:48 +05:30
// Required value
accessTokenType,
accessTokenTypePlural,
initialActiveAccessTokens,
// Default values
2022-11-25 23:54:43 +05:30
information: undefined,
2022-07-23 23:45:48 +05:30
noActiveTokensMessage: sprintf(__('This user has no active %{accessTokenTypePlural}.'), {
accessTokenTypePlural,
}),
showRole: false,
});
});
it('mounts the component and provides all values', () => {
2022-11-25 23:54:43 +05:30
const information = 'Additional information';
2022-07-23 23:45:48 +05:30
const noActiveTokensMessage = 'This group has no active access tokens.';
setHTMLFixture(
`<div id="js-access-token-table-app"
data-access-token-type="${accessTokenType}"
data-access-token-type-plural="${accessTokenTypePlural}"
data-initial-active-access-tokens=${JSON.stringify(initialActiveAccessTokens)}
2022-11-25 23:54:43 +05:30
data-information="${information}"
2022-07-23 23:45:48 +05:30
data-no-active-tokens-message="${noActiveTokensMessage}"
data-show-role
>
</div>`,
);
const vueInstance = initAccessTokenTableApp();
wrapper = createWrapper(vueInstance);
2022-11-25 23:54:43 +05:30
const component = wrapper.findComponent({ name: 'AccessTokenTableRoot' });
2022-07-23 23:45:48 +05:30
expect(component.exists()).toBe(true);
2022-11-25 23:54:43 +05:30
expect(component.findComponent(AccessTokenTableApp).vm).toMatchObject({
2022-07-23 23:45:48 +05:30
accessTokenType,
accessTokenTypePlural,
initialActiveAccessTokens,
2022-11-25 23:54:43 +05:30
information,
2022-07-23 23:45:48 +05:30
noActiveTokensMessage,
showRole: true,
});
});
it('returns `null`', () => {
expect(initNewAccessTokenApp()).toBe(null);
});
2021-04-17 20:07:23 +05:30
});
2022-08-27 11:52:29 +05:30
describe('initExpiresAtField', () => {
2021-04-17 20:07:23 +05:30
describe('when mount element exists', () => {
2022-08-27 11:52:29 +05:30
const nameAttribute = 'access_tokens[expires_at]';
const idAttribute = 'access_tokens_expires_at';
2021-04-29 21:17:54 +05:30
2021-04-17 20:07:23 +05:30
beforeEach(() => {
2022-07-23 23:45:48 +05:30
setHTMLFixture(
2022-08-27 11:52:29 +05:30
`<div class="js-access-tokens-expires-at">
2022-07-23 23:45:48 +05:30
<input
2022-08-27 11:52:29 +05:30
name="access_tokens[expires_at]"
data-js-name="expiresAt"
id="access_tokens_expires_at"
2022-07-23 23:45:48 +05:30
placeholder="Foo bar"
value="1,2"
/>
</div>`,
);
});
2023-06-20 00:43:36 +05:30
it('mounts component and sets `inputAttrs` prop', () => {
2022-08-27 11:52:29 +05:30
wrapper = createWrapper(initExpiresAtField());
const component = wrapper.findComponent(ExpiresAtField);
2021-04-17 20:07:23 +05:30
expect(component.exists()).toBe(true);
expect(component.props('inputAttrs')).toEqual({
2021-04-29 21:17:54 +05:30
name: nameAttribute,
id: idAttribute,
2021-04-17 20:07:23 +05:30
value: '1,2',
placeholder: 'Foo bar',
});
});
});
describe('when mount element does not exist', () => {
it('returns `null`', () => {
2022-08-27 11:52:29 +05:30
expect(initExpiresAtField()).toBe(null);
2021-04-17 20:07:23 +05:30
});
});
});
2022-07-23 23:45:48 +05:30
describe('initNewAccessTokenApp', () => {
it('mounts the component and sets `accessTokenType` prop', () => {
const accessTokenType = 'personal access token';
setHTMLFixture(
2022-11-25 23:54:43 +05:30
`<div id="js-new-access-token-app" data-access-token-type="${accessTokenType}"></div>
<form id="${FORM_SELECTOR.slice(1)}"></form>`,
2022-07-23 23:45:48 +05:30
);
const vueInstance = initNewAccessTokenApp();
wrapper = createWrapper(vueInstance);
2022-11-25 23:54:43 +05:30
const component = wrapper.findComponent({ name: 'NewAccessTokenRoot' });
2022-07-23 23:45:48 +05:30
expect(component.exists()).toBe(true);
2022-11-25 23:54:43 +05:30
expect(component.findComponent(NewAccessTokenApp).vm).toMatchObject({ accessTokenType });
2022-07-23 23:45:48 +05:30
});
it('returns `null`', () => {
expect(initNewAccessTokenApp()).toBe(null);
});
});
describe('initTokensApp', () => {
2022-10-11 01:57:18 +05:30
it('mounts the component and provides`tokenTypes`', () => {
2022-07-23 23:45:48 +05:30
const tokensData = {
[FEED_TOKEN]: FEED_TOKEN,
[INCOMING_EMAIL_TOKEN]: INCOMING_EMAIL_TOKEN,
[STATIC_OBJECT_TOKEN]: STATIC_OBJECT_TOKEN,
};
setHTMLFixture(
`<div id="js-tokens-app" data-tokens-data=${JSON.stringify(tokensData)}></div>`,
);
const vueInstance = initTokensApp();
wrapper = createWrapper(vueInstance);
2022-11-25 23:54:43 +05:30
const component = wrapper.findComponent(TokensApp);
2022-07-23 23:45:48 +05:30
expect(component.exists()).toBe(true);
2022-11-25 23:54:43 +05:30
expect(component.vm).toMatchObject({ tokenTypes: tokensData });
2022-07-23 23:45:48 +05:30
});
it('returns `null`', () => {
expect(initNewAccessTokenApp()).toBe(null);
});
});
2021-04-17 20:07:23 +05:30
});