diff options
author | Samantha Ming <sming@gitlab.com> | 2019-08-19 21:29:47 -0700 |
---|---|---|
committer | Paul Slaughter <pslaughter@gitlab.com> | 2019-08-20 15:15:19 -0500 |
commit | 1c7cbc25b9a877e492643d8749fa2862d86fd93f (patch) | |
tree | 247b93a45cff4c2d4730cf692b89d14e440d3fc3 /spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js | |
parent | 96b994bd05db072655bcd28204770013feeaa779 (diff) | |
download | gitlab-ce-1c7cbc25b9a877e492643d8749fa2862d86fd93f.tar.gz |
Apply patch and update spec per MR comments
- Use wrapper instead of global Vue object
- Use vue utils helper method
- Remove redundant spec tests
Diffstat (limited to 'spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js')
-rw-r--r-- | spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js | 90 |
1 files changed, 29 insertions, 61 deletions
diff --git a/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js b/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js index 64170a53a7f..6398351834c 100644 --- a/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js +++ b/spec/frontend/sidebar/components/assignees/uncollapsed_assignee_list_spec.js @@ -1,4 +1,3 @@ -import Vue from 'vue'; import { mount } from '@vue/test-utils'; import UncollapsedAssigneeList from '~/sidebar/components/assignees/uncollapsed_assignee_list.vue'; import AssigneeAvatarLink from '~/sidebar/components/assignees/assignee_avatar_link.vue'; @@ -56,79 +55,48 @@ describe('UncollapsedAssigneeList component', () => { }); }); - describe('Two or more assignees/users', () => { - beforeEach(() => { - createComponent({ - users: UsersMockHelper.createNumberRandomUsers(3), - }); - }); - - it('more than one user', () => { - expect(wrapper.findAll(AssigneeAvatarLink).length).toBe(3); - }); - - it('shows the "show-less" assignees label', done => { - const users = UsersMockHelper.createNumberRandomUsers(6); - - createComponent({ - users, + describe('n+ more label', () => { + describe('when users count is rendered users', () => { + beforeEach(() => { + createComponent({ + users: UsersMockHelper.createNumberRandomUsers(DEFAULT_RENDER_COUNT), + }); }); - expect(wrapper.vm.$el.querySelectorAll('.user-item').length).toEqual(DEFAULT_RENDER_COUNT); - - expect(wrapper.vm.$el.querySelector('.user-list-more')).not.toBe(null); - const usersLabelExpectation = users.length - DEFAULT_RENDER_COUNT; - - expect(wrapper.vm.$el.querySelector('.user-list-more .btn-link').innerText.trim()).not.toBe( - `+${usersLabelExpectation} more`, - ); - wrapper.vm.toggleShowLess(); - Vue.nextTick(() => { - expect(wrapper.vm.$el.querySelector('.user-list-more .btn-link').innerText.trim()).toBe( - '- show less', - ); - done(); + it('does not show more label', () => { + expect(findMoreButton().exists()).toBe(false); }); }); - it('shows the "show-less" when "n+ more " label is clicked', done => { - createComponent({ - users: UsersMockHelper.createNumberRandomUsers(6), + describe('when more than rendered users', () => { + beforeEach(() => { + createComponent({ + users: UsersMockHelper.createNumberRandomUsers(DEFAULT_RENDER_COUNT + 1), + }); }); - wrapper.vm.$el.querySelector('.user-list-more .btn-link').click(); - Vue.nextTick(() => { - expect(wrapper.vm.$el.querySelector('.user-list-more .btn-link').innerText.trim()).toBe( - '- show less', - ); - done(); + it('shows "+1 more" label', () => { + expect(findMoreButton().text()).toBe('+ 1 more'); }); - }); - - it('does not show n+ more label when less than render count', () => { - expect(findMoreButton().exists()).toBe(false); - }); - }); - describe('n+ more label', () => { - beforeEach(() => { - createComponent({ - users: UsersMockHelper.createNumberRandomUsers(DEFAULT_RENDER_COUNT + 1), + it('shows truncated users', () => { + expect(wrapper.findAll(AssigneeAvatarLink).length).toBe(DEFAULT_RENDER_COUNT); }); - }); - it('shows "+1 more" label', () => { - expect(findMoreButton().text()).toBe('+ 1 more'); - expect(wrapper.findAll(AssigneeAvatarLink).length).toBe(DEFAULT_RENDER_COUNT); - }); + describe('when more button is clicked', () => { + beforeEach(() => { + findMoreButton().trigger('click'); + + return wrapper.vm.$nextTick(); + }); - it('shows "show less" label', done => { - findMoreButton().trigger('click'); + it('shows "show less" label', () => { + expect(findMoreButton().text()).toBe('- show less'); + }); - Vue.nextTick(() => { - expect(findMoreButton().text()).toBe('- show less'); - expect(wrapper.findAll(AssigneeAvatarLink).length).toBe(DEFAULT_RENDER_COUNT + 1); - done(); + it('shows all users', () => { + expect(wrapper.findAll(AssigneeAvatarLink).length).toBe(DEFAULT_RENDER_COUNT + 1); + }); }); }); }); |