From 8c7f4e9d5f36cff46365a7f8c4b9c21578c1e781 Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Thu, 18 Jun 2020 11:18:50 +0000 Subject: Add latest changes from gitlab-org/gitlab@13-1-stable-ee --- spec/frontend/right_sidebar_spec.js | 87 +++++++++++++++++++++++++++++++++++++ 1 file changed, 87 insertions(+) create mode 100644 spec/frontend/right_sidebar_spec.js (limited to 'spec/frontend/right_sidebar_spec.js') diff --git a/spec/frontend/right_sidebar_spec.js b/spec/frontend/right_sidebar_spec.js new file mode 100644 index 00000000000..d80d80152a5 --- /dev/null +++ b/spec/frontend/right_sidebar_spec.js @@ -0,0 +1,87 @@ +import $ from 'jquery'; +import MockAdapter from 'axios-mock-adapter'; +import '~/commons/bootstrap'; +import axios from '~/lib/utils/axios_utils'; +import Sidebar from '~/right_sidebar'; + +let $aside = null; +let $toggle = null; +let $icon = null; +let $page = null; +let $labelsIcon = null; + +const assertSidebarState = state => { + const shouldBeExpanded = state === 'expanded'; + const shouldBeCollapsed = state === 'collapsed'; + expect($aside.hasClass('right-sidebar-expanded')).toBe(shouldBeExpanded); + expect($page.hasClass('right-sidebar-expanded')).toBe(shouldBeExpanded); + expect($icon.hasClass('fa-angle-double-right')).toBe(shouldBeExpanded); + expect($aside.hasClass('right-sidebar-collapsed')).toBe(shouldBeCollapsed); + expect($page.hasClass('right-sidebar-collapsed')).toBe(shouldBeCollapsed); + expect($icon.hasClass('fa-angle-double-left')).toBe(shouldBeCollapsed); +}; + +describe('RightSidebar', () => { + describe('fixture tests', () => { + const fixtureName = 'issues/open-issue.html'; + preloadFixtures(fixtureName); + let mock; + + beforeEach(() => { + loadFixtures(fixtureName); + mock = new MockAdapter(axios); + new Sidebar(); // eslint-disable-line no-new + $aside = $('.right-sidebar'); + $page = $('.layout-page'); + $icon = $aside.find('i'); + $toggle = $aside.find('.js-sidebar-toggle'); + $labelsIcon = $aside.find('.sidebar-collapsed-icon'); + }); + + afterEach(() => { + mock.restore(); + }); + + it('should expand/collapse the sidebar when arrow is clicked', () => { + assertSidebarState('expanded'); + $toggle.click(); + assertSidebarState('collapsed'); + $toggle.click(); + assertSidebarState('expanded'); + }); + + it('should float over the page and when sidebar icons clicked', () => { + $labelsIcon.click(); + assertSidebarState('expanded'); + }); + + it('should collapse when the icon arrow clicked while it is floating on page', () => { + $labelsIcon.click(); + assertSidebarState('expanded'); + $toggle.click(); + assertSidebarState('collapsed'); + }); + + it('should broadcast todo:toggle event when add todo clicked', done => { + const todos = getJSONFixture('todos/todos.json'); + mock.onPost(/(.*)\/todos$/).reply(200, todos); + + const todoToggleSpy = jest.fn(); + $(document).on('todo:toggle', todoToggleSpy); + + $('.issuable-sidebar-header .js-issuable-todo').click(); + + setImmediate(() => { + expect(todoToggleSpy.mock.calls.length).toEqual(1); + + done(); + }); + }); + + it('should not hide collapsed icons', () => { + [].forEach.call(document.querySelectorAll('.sidebar-collapsed-icon'), el => { + expect(el.querySelector('.fa, svg').classList.contains('hidden')).toBeFalsy(); + }); + }); + }); +}); -- cgit v1.2.3