110 lines
3.3 KiB
JavaScript
110 lines
3.3 KiB
JavaScript
import { TEST_HOST } from 'spec/test_constants';
|
|
import { getFirstCharacterCapitalized } from '~/lib/utils/text_utility';
|
|
import {
|
|
DEFAULT_SIZE_CLASS,
|
|
IDENTICON_BG_COUNT,
|
|
renderAvatar,
|
|
renderIdenticon,
|
|
getIdenticonBackgroundClass,
|
|
getIdenticonTitle,
|
|
} from '~/helpers/avatar_helper';
|
|
|
|
function matchAll(str) {
|
|
return new RegExp(`^${str}$`);
|
|
}
|
|
|
|
describe('avatar_helper', () => {
|
|
describe('getIdenticonBackgroundClass', () => {
|
|
it('returns identicon bg class from id that is a number', () => {
|
|
expect(getIdenticonBackgroundClass(1)).toEqual('bg2');
|
|
});
|
|
|
|
it('returns identicon bg class from id that is a string', () => {
|
|
expect(getIdenticonBackgroundClass('1')).toEqual('bg2');
|
|
});
|
|
|
|
it('returns identicon bg class from id that is a GraphQL string id', () => {
|
|
expect(getIdenticonBackgroundClass('gid://gitlab/Project/1')).toEqual('bg2');
|
|
});
|
|
|
|
it('returns identicon bg class from unparsable string', () => {
|
|
expect(getIdenticonBackgroundClass('gid://gitlab/')).toEqual('bg1');
|
|
});
|
|
|
|
it(`wraps around if id is bigger than ${IDENTICON_BG_COUNT}`, () => {
|
|
expect(getIdenticonBackgroundClass(IDENTICON_BG_COUNT + 4)).toEqual('bg5');
|
|
expect(getIdenticonBackgroundClass(IDENTICON_BG_COUNT * 5 + 6)).toEqual('bg7');
|
|
});
|
|
});
|
|
|
|
describe('getIdenticonTitle', () => {
|
|
it('returns identicon title from name', () => {
|
|
expect(getIdenticonTitle('Lorem')).toEqual('L');
|
|
expect(getIdenticonTitle('dolar-sit-amit')).toEqual('D');
|
|
expect(getIdenticonTitle('%-with-special-chars')).toEqual('%');
|
|
});
|
|
|
|
it('returns space if name is falsey', () => {
|
|
expect(getIdenticonTitle('')).toEqual(' ');
|
|
expect(getIdenticonTitle(null)).toEqual(' ');
|
|
});
|
|
});
|
|
|
|
describe('renderIdenticon', () => {
|
|
it('renders with the first letter as title and bg based on id', () => {
|
|
const entity = {
|
|
id: IDENTICON_BG_COUNT + 3,
|
|
name: 'Xavior',
|
|
};
|
|
const options = {
|
|
sizeClass: 's32',
|
|
};
|
|
|
|
const result = renderIdenticon(entity, options);
|
|
|
|
expect(result).toHaveClass(`identicon ${options.sizeClass} bg4`);
|
|
expect(result).toHaveText(matchAll(getFirstCharacterCapitalized(entity.name)));
|
|
});
|
|
|
|
it('renders with defaults, if no options are given', () => {
|
|
const entity = {
|
|
id: 1,
|
|
name: 'tanuki',
|
|
};
|
|
|
|
const result = renderIdenticon(entity);
|
|
|
|
expect(result).toHaveClass(`identicon ${DEFAULT_SIZE_CLASS} bg2`);
|
|
expect(result).toHaveText(matchAll(getFirstCharacterCapitalized(entity.name)));
|
|
});
|
|
});
|
|
|
|
describe('renderAvatar', () => {
|
|
it('renders an image with the avatarUrl', () => {
|
|
const avatarUrl = `${TEST_HOST}/not-real-assets/test.png`;
|
|
|
|
const result = renderAvatar({
|
|
avatar_url: avatarUrl,
|
|
});
|
|
|
|
expect(result).toBeMatchedBy('img');
|
|
expect(result).toHaveAttr('src', avatarUrl);
|
|
expect(result).toHaveClass(DEFAULT_SIZE_CLASS);
|
|
});
|
|
|
|
it('renders an identicon if no avatarUrl', () => {
|
|
const entity = {
|
|
id: 1,
|
|
name: 'walrus',
|
|
};
|
|
const options = {
|
|
sizeClass: 's16',
|
|
};
|
|
|
|
const result = renderAvatar(entity, options);
|
|
|
|
expect(result).toHaveClass(`identicon ${options.sizeClass} bg2`);
|
|
expect(result).toHaveText(matchAll(getFirstCharacterCapitalized(entity.name)));
|
|
});
|
|
});
|
|
});
|