diff options
author | Bryce Johnson <bryce@gitlab.com> | 2017-05-17 18:22:26 +0300 |
---|---|---|
committer | Bryce Johnson <bryce@gitlab.com> | 2017-05-18 23:38:10 +0300 |
commit | b73959a94bcace3d0af7819f7621b308980c49d9 (patch) | |
tree | f304a64be3f83548406eacae6947ac869733a130 /spec | |
parent | 3c668fa04fd7e0a1d925e9666eb727ed3e83d145 (diff) |
Fixes per feedback on user avatar components.
Diffstat (limited to 'spec')
4 files changed, 12 insertions, 69 deletions
diff --git a/spec/javascripts/vue_shared/components/user_avatar_image_spec.js b/spec/javascripts/vue_shared/components/user_avatar_image_spec.js index 0b5ec736b1e..8daa7610274 100644 --- a/spec/javascripts/vue_shared/components/user_avatar_image_spec.js +++ b/spec/javascripts/vue_shared/components/user_avatar_image_spec.js @@ -18,8 +18,6 @@ describe('User Avatar Image Component', function () { this.userAvatarImage = new UserAvatarImageComponent({ propsData: this.propsData, }).$mount(); - - this.imageElement = this.userAvatarImage.$el.outerHTML; }); it('should return a defined Vue component', function () { @@ -27,14 +25,7 @@ describe('User Avatar Image Component', function () { }); it('should have <img> as a child element', function () { - const componentImgTag = this.userAvatarImage.$el.outerHTML; - expect(componentImgTag).toContain('<img'); - }); - - it('should return neccessary props as defined', function () { - _.each(this.propsData, (val, key) => { - expect(this.userAvatarImage[key]).toBeDefined(); - }); + expect(this.userAvatarImage.$el.tagName).toBe('IMG'); }); it('should properly compute tooltipContainer', function () { @@ -42,19 +33,22 @@ describe('User Avatar Image Component', function () { }); it('should properly render tooltipContainer', function () { - expect(this.imageElement).toContain('data-container="body"'); + expect(this.userAvatarImage.$el.getAttribute('data-container')).toBe('body'); }); it('should properly compute avatarSizeClass', function () { expect(this.userAvatarImage.avatarSizeClass).toBe('s99'); }); - it('should properly compute imgCssClasses', function () { - expect(this.userAvatarImage.imgCssClasses).toBe('avatar s99 myextraavatarclass'); - }); + it('should properly render img css', function () { + const classList = this.userAvatarImage.$el.classList; + const containsAvatar = classList.contains('avatar'); + const containsSizeClass = classList.contains('s99'); + const containsCustomClass = classList.contains('myextraavatarclass'); - it('should properly render imgCssClasses', function () { - expect(this.imageElement).toContain('avatar s99 myextraavatarclass'); + expect(containsAvatar).toBe(true); + expect(containsSizeClass).toBe(true); + expect(containsCustomClass).toBe(true); }); }); }); diff --git a/spec/javascripts/vue_shared/components/user_avatar_link_spec.js b/spec/javascripts/vue_shared/components/user_avatar_link_spec.js index 770daa9f0de..52e450e9ba5 100644 --- a/spec/javascripts/vue_shared/components/user_avatar_link_spec.js +++ b/spec/javascripts/vue_shared/components/user_avatar_link_spec.js @@ -35,13 +35,11 @@ describe('User Avatar Link Component', function () { }); it('should render <a> as a child element', function () { - const componentLinkTag = this.userAvatarLink.$el.outerHTML; - expect(componentLinkTag).toContain('<a'); + expect(this.userAvatarLink.$el.tagName).toBe('A'); }); it('should have <img> as a child element', function () { - const componentImgTag = this.userAvatarLink.$el.outerHTML; - expect(componentImgTag).toContain('<img'); + expect(this.userAvatarLink.$el.querySelector('img')).not.toBeNull(); }); it('should return neccessary props as defined', function () { @@ -49,10 +47,4 @@ describe('User Avatar Link Component', function () { expect(this.userAvatarLink[key]).toBeDefined(); }); }); - - it('should include props in the rendered output', function () { - _.each(this.propsData, (val) => { - expect(this.userAvatarLink.$el.outerHTML).toContain(val); - }); - }); }); diff --git a/spec/javascripts/vue_shared/components/user_avatar_size_mixin_spec.js b/spec/javascripts/vue_shared/components/user_avatar_size_mixin_spec.js deleted file mode 100644 index b37813cdb3d..00000000000 --- a/spec/javascripts/vue_shared/components/user_avatar_size_mixin_spec.js +++ /dev/null @@ -1,37 +0,0 @@ -import Vue from 'vue'; -import UserAvatarSizeMixin from '~/vue_shared/components/user_avatar/user_avatar_size_mixin'; - -describe('User Avatar Size Mixin', () => { - beforeEach(() => { - this.vueInstance = new Vue({ - data: { - size: 99, - }, - mixins: [UserAvatarSizeMixin], - }); - }); - - describe('#avatarSizeClass', () => { - it('should be a defined computed value', () => { - expect(this.vueInstance.avatarSizeClass).toBeDefined(); - }); - - it('should correctly transform size into the class name', () => { - expect(this.vueInstance.avatarSizeClass).toBe('s99'); - }); - }); - - describe('#avatarSizeStylesMap', () => { - it('should be a defined computed value', () => { - expect(this.vueInstance.avatarSizeStylesMap).toBeDefined(); - }); - - it('should return a correctly formatted styles width', () => { - expect(this.vueInstance.avatarSizeStylesMap.width).toBe('99px'); - }); - - it('should return a correctly formatted styles height', () => { - expect(this.vueInstance.avatarSizeStylesMap.height).toBe('99px'); - }); - }); -}); diff --git a/spec/javascripts/vue_shared/components/user_avatar_svg_spec.js b/spec/javascripts/vue_shared/components/user_avatar_svg_spec.js index 809886c5dbd..b8d639ffbec 100644 --- a/spec/javascripts/vue_shared/components/user_avatar_svg_spec.js +++ b/spec/javascripts/vue_shared/components/user_avatar_svg_spec.js @@ -25,11 +25,5 @@ describe('User Avatar Svg Component', function () { expect(this.userAvatarSvg.$el.tagName).toEqual('svg'); expect(this.userAvatarSvg.$el.innerHTML).toContain('<path'); }); - - it('should return neccessary props as defined', function () { - _.each(this.propsData, (val, key) => { - expect(this.userAvatarSvg[key]).toBeDefined(); - }); - }); }); }); |