diff options
Diffstat (limited to 'spec/frontend/sidebar')
-rw-r--r-- | spec/frontend/sidebar/__snapshots__/todo_spec.js.snap | 2 | ||||
-rw-r--r-- | spec/frontend/sidebar/assignees_realtime_spec.js | 2 | ||||
-rw-r--r-- | spec/frontend/sidebar/assignees_spec.js | 2 | ||||
-rw-r--r-- | spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js | 2 | ||||
-rw-r--r-- | spec/frontend/sidebar/reviewers_spec.js | 9 | ||||
-rw-r--r-- | spec/frontend/sidebar/subscriptions_spec.js | 25 | ||||
-rw-r--r-- | spec/frontend/sidebar/todo_spec.js | 4 |
7 files changed, 25 insertions, 21 deletions
diff --git a/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap b/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap index e295c587d70..846f45345e7 100644 --- a/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap +++ b/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap @@ -3,7 +3,7 @@ exports[`SidebarTodo template renders component container element with proper data attributes 1`] = ` <button aria-label="Mark as done" - class="btn btn-default btn-todo issuable-header-btn float-right" + class="gl-button btn btn-default btn-todo issuable-header-btn float-right" data-issuable-id="1" data-issuable-type="epic" type="button" diff --git a/spec/frontend/sidebar/assignees_realtime_spec.js b/spec/frontend/sidebar/assignees_realtime_spec.js index 1c62c52dc67..a7e280b5ae1 100644 --- a/spec/frontend/sidebar/assignees_realtime_spec.js +++ b/spec/frontend/sidebar/assignees_realtime_spec.js @@ -2,8 +2,8 @@ import { shallowMount } from '@vue/test-utils'; import ActionCable from '@rails/actioncable'; import AssigneesRealtime from '~/sidebar/components/assignees/assignees_realtime.vue'; import SidebarMediator from '~/sidebar/sidebar_mediator'; -import Mock from './mock_data'; import query from '~/issuable_sidebar/queries/issue_sidebar.query.graphql'; +import Mock from './mock_data'; jest.mock('@rails/actioncable', () => { const mockConsumer = { diff --git a/spec/frontend/sidebar/assignees_spec.js b/spec/frontend/sidebar/assignees_spec.js index 23e82171fe9..fbf5fca2234 100644 --- a/spec/frontend/sidebar/assignees_spec.js +++ b/spec/frontend/sidebar/assignees_spec.js @@ -1,6 +1,6 @@ import { mount } from '@vue/test-utils'; -import { trimText } from 'helpers/text_helper'; import { GlIcon } from '@gitlab/ui'; +import { trimText } from 'helpers/text_helper'; import UsersMockHelper from 'helpers/user_mock_data_helper'; import Assignee from '~/sidebar/components/assignees/assignees.vue'; import UsersMock from './mock_data'; diff --git a/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js b/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js index 0b6a2e6ceb9..d52a59bb67b 100644 --- a/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js +++ b/spec/frontend/sidebar/components/time_tracking/time_tracker_spec.js @@ -1,5 +1,5 @@ -import { createMockDirective } from 'helpers/vue_mock_directive'; import { mount } from '@vue/test-utils'; +import { createMockDirective } from 'helpers/vue_mock_directive'; import { stubTransition } from 'helpers/stub_transition'; import TimeTracker from '~/sidebar/components/time_tracking/time_tracker.vue'; diff --git a/spec/frontend/sidebar/reviewers_spec.js b/spec/frontend/sidebar/reviewers_spec.js index 91f28e85f3b..9208fb7288b 100644 --- a/spec/frontend/sidebar/reviewers_spec.js +++ b/spec/frontend/sidebar/reviewers_spec.js @@ -1,6 +1,6 @@ import { mount } from '@vue/test-utils'; -import { trimText } from 'helpers/text_helper'; import { GlIcon } from '@gitlab/ui'; +import { trimText } from 'helpers/text_helper'; import UsersMockHelper from 'helpers/user_mock_data_helper'; import Reviewer from '~/sidebar/components/reviewers/reviewers.vue'; import UsersMock from './mock_data'; @@ -114,8 +114,7 @@ describe('Reviewer component', () => { editable: true, }); - expect(wrapper.findAll('.user-item').length).toBe(users.length); - expect(wrapper.find('.user-list-more').exists()).toBe(false); + expect(wrapper.findAll('[data-testid="reviewer"]').length).toBe(users.length); }); it('shows sorted reviewer where "can merge" users are sorted first', () => { @@ -144,10 +143,10 @@ describe('Reviewer component', () => { users, }); - const userItems = wrapper.findAll('.user-list .user-item a'); + const userItems = wrapper.findAll('[data-testid="reviewer"]'); expect(userItems.length).toBe(3); - expect(userItems.at(0).attributes('title')).toBe(users[2].name); + expect(userItems.at(0).find('a').attributes('title')).toBe(users[2].name); }); it('passes the sorted reviewers to the collapsed-reviewer-list', () => { diff --git a/spec/frontend/sidebar/subscriptions_spec.js b/spec/frontend/sidebar/subscriptions_spec.js index 043ffd972da..e7ae59e26cf 100644 --- a/spec/frontend/sidebar/subscriptions_spec.js +++ b/spec/frontend/sidebar/subscriptions_spec.js @@ -1,17 +1,20 @@ +import { GlToggle } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import Subscriptions from '~/sidebar/components/subscriptions/subscriptions.vue'; import eventHub from '~/sidebar/event_hub'; -import ToggleButton from '~/vue_shared/components/toggle_button.vue'; describe('Subscriptions', () => { let wrapper; - const findToggleButton = () => wrapper.find(ToggleButton); + const findToggleButton = () => wrapper.findComponent(GlToggle); const mountComponent = (propsData) => - shallowMount(Subscriptions, { - propsData, - }); + extendedWrapper( + shallowMount(Subscriptions, { + propsData, + }), + ); afterEach(() => { wrapper.destroy(); @@ -24,7 +27,7 @@ describe('Subscriptions', () => { subscribed: undefined, }); - expect(findToggleButton().attributes('isloading')).toBe('true'); + expect(findToggleButton().props('isLoading')).toBe(true); }); it('is toggled "off" when currently not subscribed', () => { @@ -32,7 +35,7 @@ describe('Subscriptions', () => { subscribed: false, }); - expect(findToggleButton().attributes('value')).toBeFalsy(); + expect(findToggleButton().props('value')).toBe(false); }); it('is toggled "on" when currently subscribed', () => { @@ -40,7 +43,7 @@ describe('Subscriptions', () => { subscribed: true, }); - expect(findToggleButton().attributes('value')).toBe('true'); + expect(findToggleButton().props('value')).toBe(true); }); it('toggleSubscription method emits `toggleSubscription` event on eventHub and Component', () => { @@ -93,14 +96,16 @@ describe('Subscriptions', () => { }); it('sets the correct display text', () => { - expect(wrapper.find('.issuable-header-text').text()).toContain(subscribeDisabledDescription); + expect(wrapper.findByTestId('subscription-title').text()).toContain( + subscribeDisabledDescription, + ); expect(wrapper.find({ ref: 'tooltip' }).attributes('title')).toBe( subscribeDisabledDescription, ); }); it('does not render the toggle button', () => { - expect(wrapper.find('.js-issuable-subscribe-button').exists()).toBe(false); + expect(findToggleButton().exists()).toBe(false); }); }); }); diff --git a/spec/frontend/sidebar/todo_spec.js b/spec/frontend/sidebar/todo_spec.js index 4adfaf7ad7b..7b7e24f2a8f 100644 --- a/spec/frontend/sidebar/todo_spec.js +++ b/spec/frontend/sidebar/todo_spec.js @@ -26,7 +26,7 @@ describe('SidebarTodo', () => { it.each` state | classes - ${false} | ${['btn', 'btn-default', 'btn-todo', 'issuable-header-btn', 'float-right']} + ${false} | ${['gl-button', 'btn', 'btn-default', 'btn-todo', 'issuable-header-btn', 'float-right']} ${true} | ${['btn-blank', 'btn-todo', 'sidebar-collapsed-icon', 'dont-change-state']} `('returns todo button classes for when `collapsed` prop is `$state`', ({ state, classes }) => { createComponent({ collapsed: state }); @@ -35,7 +35,7 @@ describe('SidebarTodo', () => { it.each` isTodo | iconClass | label | icon - ${false} | ${''} | ${'Add a To-Do'} | ${'todo-add'} + ${false} | ${''} | ${'Add a to do'} | ${'todo-add'} ${true} | ${'todo-undone'} | ${'Mark as done'} | ${'todo-done'} `( 'renders proper button when `isTodo` prop is `$isTodo`', |