136 lines
3.8 KiB
JavaScript
136 lines
3.8 KiB
JavaScript
import { GlEmptyState, GlLink, GlTooltip, GlTruncate } from '@gitlab/ui';
|
|
import { mount } from '@vue/test-utils';
|
|
import TokenTable from '~/clusters/agents/components/token_table.vue';
|
|
import { useFakeDate } from 'helpers/fake_date';
|
|
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
|
|
|
|
describe('ClusterAgentTokenTable', () => {
|
|
let wrapper;
|
|
useFakeDate([2021, 2, 15]);
|
|
|
|
const defaultTokens = [
|
|
{
|
|
id: '1',
|
|
createdAt: '2021-02-13T00:00:00Z',
|
|
description: 'Description of token 1',
|
|
createdByUser: {
|
|
name: 'user-1',
|
|
},
|
|
lastUsedAt: '2021-02-13T00:00:00Z',
|
|
name: 'token-1',
|
|
},
|
|
{
|
|
id: '2',
|
|
createdAt: '2021-02-10T00:00:00Z',
|
|
description: null,
|
|
createdByUser: null,
|
|
lastUsedAt: null,
|
|
name: 'token-2',
|
|
},
|
|
];
|
|
|
|
const createComponent = (tokens) => {
|
|
wrapper = extendedWrapper(mount(TokenTable, { propsData: { tokens } }));
|
|
};
|
|
|
|
const findEmptyState = () => wrapper.find(GlEmptyState);
|
|
const findLink = () => wrapper.find(GlLink);
|
|
|
|
beforeEach(() => {
|
|
return createComponent(defaultTokens);
|
|
});
|
|
|
|
afterEach(() => {
|
|
wrapper.destroy();
|
|
});
|
|
|
|
it('displays a learn more link', () => {
|
|
const learnMoreLink = findLink();
|
|
|
|
expect(learnMoreLink.exists()).toBe(true);
|
|
expect(learnMoreLink.text()).toBe(TokenTable.i18n.learnMore);
|
|
});
|
|
|
|
it.each`
|
|
name | lineNumber
|
|
${'token-1'} | ${0}
|
|
${'token-2'} | ${1}
|
|
`('displays token name "$name" for line "$lineNumber"', ({ name, lineNumber }) => {
|
|
const tokens = wrapper.findAll('[data-testid="agent-token-name"]');
|
|
const token = tokens.at(lineNumber);
|
|
|
|
expect(token.text()).toBe(name);
|
|
});
|
|
|
|
it.each`
|
|
lastContactText | lineNumber
|
|
${'2 days ago'} | ${0}
|
|
${'Never'} | ${1}
|
|
`(
|
|
'displays last contact information "$lastContactText" for line "$lineNumber"',
|
|
({ lastContactText, lineNumber }) => {
|
|
const tokens = wrapper.findAllByTestId('agent-token-used');
|
|
const token = tokens.at(lineNumber);
|
|
|
|
expect(token.text()).toBe(lastContactText);
|
|
},
|
|
);
|
|
|
|
it.each`
|
|
createdText | lineNumber
|
|
${'2 days ago'} | ${0}
|
|
${'5 days ago'} | ${1}
|
|
`(
|
|
'displays created information "$createdText" for line "$lineNumber"',
|
|
({ createdText, lineNumber }) => {
|
|
const tokens = wrapper.findAll('[data-testid="agent-token-created-time"]');
|
|
const token = tokens.at(lineNumber);
|
|
|
|
expect(token.text()).toBe(createdText);
|
|
},
|
|
);
|
|
|
|
it.each`
|
|
createdBy | lineNumber
|
|
${'user-1'} | ${0}
|
|
${'Unknown user'} | ${1}
|
|
`(
|
|
'displays creator information "$createdBy" for line "$lineNumber"',
|
|
({ createdBy, lineNumber }) => {
|
|
const tokens = wrapper.findAll('[data-testid="agent-token-created-user"]');
|
|
const token = tokens.at(lineNumber);
|
|
|
|
expect(token.text()).toBe(createdBy);
|
|
},
|
|
);
|
|
|
|
it.each`
|
|
description | truncatesText | hasTooltip | lineNumber
|
|
${'Description of token 1'} | ${true} | ${true} | ${0}
|
|
${''} | ${false} | ${false} | ${1}
|
|
`(
|
|
'displays description information "$description" for line "$lineNumber"',
|
|
({ description, truncatesText, hasTooltip, lineNumber }) => {
|
|
const tokens = wrapper.findAll('[data-testid="agent-token-description"]');
|
|
const token = tokens.at(lineNumber);
|
|
|
|
expect(token.text()).toContain(description);
|
|
expect(token.find(GlTruncate).exists()).toBe(truncatesText);
|
|
expect(token.find(GlTooltip).exists()).toBe(hasTooltip);
|
|
},
|
|
);
|
|
|
|
describe('when there are no tokens', () => {
|
|
beforeEach(() => {
|
|
return createComponent([]);
|
|
});
|
|
|
|
it('displays an empty state', () => {
|
|
const emptyState = findEmptyState();
|
|
|
|
expect(emptyState.exists()).toBe(true);
|
|
expect(emptyState.text()).toContain(TokenTable.i18n.noTokens);
|
|
});
|
|
});
|
|
});
|