diff options
author | Paul Slaughter <pslaughter@gitlab.com> | 2018-08-01 22:43:50 +0300 |
---|---|---|
committer | Clement Ho <clemmakesapps@gmail.com> | 2018-08-01 22:43:50 +0300 |
commit | fbfe04401deb7a08da03502282531364aa25d511 (patch) | |
tree | 1b8b25c8ca0f7e048aed07de9cdf24a44fc58c36 /spec/javascripts/avatar_helper_spec.js | |
parent | c1fc33d590b3f853ec820fa33ebc114b86af692d (diff) |
Add vanilla JS avatar_helper and update existing avatar helpers
Diffstat (limited to 'spec/javascripts/avatar_helper_spec.js')
-rw-r--r-- | spec/javascripts/avatar_helper_spec.js | 98 |
1 files changed, 98 insertions, 0 deletions
diff --git a/spec/javascripts/avatar_helper_spec.js b/spec/javascripts/avatar_helper_spec.js new file mode 100644 index 00000000000..b2f80678ae7 --- /dev/null +++ b/spec/javascripts/avatar_helper_spec.js @@ -0,0 +1,98 @@ +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', () => { + expect(getIdenticonBackgroundClass(1)).toEqual('bg2'); + }); + + 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))); + }); + }); +}); |