diff --git a/src/courseware/course/Course.test.jsx b/src/courseware/course/Course.test.jsx index 2dc15bd4..4eeb4f20 100644 --- a/src/courseware/course/Course.test.jsx +++ b/src/courseware/course/Course.test.jsx @@ -117,10 +117,10 @@ describe('Course', () => { render(); expect(sessionStorage.getItem(`notificationTrayStatus.${mockData.courseId}`)).toBe('"open"'); const notificationShowButton = await screen.findByRole('button', { name: /Show notification tray/i }); - expect(screen.queryByRole('region', { name: /notification tray/i })).toBeInTheDocument(); + expect(screen.queryByRole('region', { name: /notification tray/i })).not.toHaveClass('d-none'); fireEvent.click(notificationShowButton); expect(sessionStorage.getItem(`notificationTrayStatus.${mockData.courseId}`)).toBe('"closed"'); - expect(screen.queryByRole('region', { name: /notification tray/i })).not.toBeInTheDocument(); + expect(screen.queryByRole('region', { name: /notification tray/i })).toHaveClass('d-none'); }); it('handles reload persisting notification tray status', async () => { diff --git a/src/courseware/course/sequence/Sequence.test.jsx b/src/courseware/course/sequence/Sequence.test.jsx index d771d97d..8c07f989 100644 --- a/src/courseware/course/sequence/Sequence.test.jsx +++ b/src/courseware/course/sequence/Sequence.test.jsx @@ -74,8 +74,8 @@ describe('Sequence', () => { ); await waitFor(() => expect(screen.queryByText('Loading locked content messaging...')).toBeInTheDocument()); - // `Previous`, `Active`, `Next` and `Prerequisite` buttons. - expect(screen.getAllByRole('button').length).toEqual(4); + // `Previous`, `Active`, `Next`, `Prerequisite` and `Close Tray` buttons. + expect(screen.getAllByRole('button').length).toEqual(5); expect(screen.getByText('Content Locked')).toBeInTheDocument(); const unitContainer = container.querySelector('.unit-container'); @@ -126,7 +126,7 @@ describe('Sequence', () => { render(); expect(await screen.findByText('Loading learning sequence...')).toBeInTheDocument(); // Renders navigation buttons plus one button for each unit. - expect(screen.getAllByRole('button')).toHaveLength(3 + unitBlocks.length); + expect(screen.getAllByRole('button')).toHaveLength(4 + unitBlocks.length); loadUnit(); await waitFor(() => expect(screen.queryByText('Loading learning sequence...')).not.toBeInTheDocument()); diff --git a/src/courseware/course/sidebar/Sidebar.jsx b/src/courseware/course/sidebar/Sidebar.jsx index 7acfa525..94511ab7 100644 --- a/src/courseware/course/sidebar/Sidebar.jsx +++ b/src/courseware/course/sidebar/Sidebar.jsx @@ -1,18 +1,15 @@ -import React, { useContext } from 'react'; -import SidebarContext from './SidebarContext'; -import { SIDEBARS } from './sidebars'; +import React from 'react'; +import { SIDEBAR_ORDER, SIDEBARS } from './sidebars'; -const Sidebar = () => { - const { - currentSidebar, - } = useContext(SidebarContext); - if (!currentSidebar) { - return null; - } - const CurrentSidebar = SIDEBARS[currentSidebar].Sidebar; - return ( - - ); -}; +const Sidebar = () => ( + <> + { + SIDEBAR_ORDER.map((sideBarId) => { + const SidebarToRender = SIDEBARS[sideBarId].Sidebar; + return ; + }) + } + +); export default Sidebar; diff --git a/src/courseware/course/sidebar/common/SidebarBase.jsx b/src/courseware/course/sidebar/common/SidebarBase.jsx index a1c6651c..2e2e44fb 100644 --- a/src/courseware/course/sidebar/common/SidebarBase.jsx +++ b/src/courseware/course/sidebar/common/SidebarBase.jsx @@ -34,11 +34,12 @@ const SidebarBase = ({ useEventListener('message', receiveMessage); - return currentSidebar === sidebarId && ( + return (
{ className="d-flex w-100 h-100 border-0" title={intl.formatMessage(messages.discussionsTitle)} allow="clipboard-write" + loading="lazy" /> );