diff --git a/src/course-home/live-tab/LiveTab.jsx b/src/course-home/live-tab/LiveTab.jsx index 05a470e038..eccbf60db9 100644 --- a/src/course-home/live-tab/LiveTab.jsx +++ b/src/course-home/live-tab/LiveTab.jsx @@ -13,6 +13,7 @@ const LiveTab = () => { return (
diff --git a/src/course-home/outline-tab/OutlineTab.test.jsx b/src/course-home/outline-tab/OutlineTab.test.jsx index 39852568b7..5b3da39882 100644 --- a/src/course-home/outline-tab/OutlineTab.test.jsx +++ b/src/course-home/outline-tab/OutlineTab.test.jsx @@ -132,6 +132,24 @@ describe('Outline Tab', () => { expect(expandedSectionNode).toHaveAttribute('aria-expanded', 'true'); }); + it('displays correct heading for expanded section', async () => { + const { courseBlocks } = await buildMinimalCourseBlocks(courseId, 'Title', { resumeBlock: true }); + setTabData({ course_blocks: { blocks: courseBlocks.blocks } }); + await fetchAndRender(); + const headingContent = screen.getByText('Title of Section'); + const { parentElement } = headingContent; + expect(parentElement.tagName).toBe('H2'); + }); + + it('checks that the expanded section is within the correct list', async () => { + const { courseBlocks } = await buildMinimalCourseBlocks(courseId, 'Title', { resumeBlock: true }); + setTabData({ course_blocks: { blocks: courseBlocks.blocks } }); + await fetchAndRender(); + const listElement = screen.getByRole('presentation', { id: 'courseHome-outline' }); + expect(listElement).toBeInTheDocument(); + expect(listElement.tagName).toBe('OL'); + }); + it('includes outline_tab_notifications_slot', async () => { const { courseBlocks } = await buildMinimalCourseBlocks(courseId, 'Title', { resumeBlock: true }); setTabData({ diff --git a/src/course-home/outline-tab/section-outline/SectionTitle.tsx b/src/course-home/outline-tab/section-outline/SectionTitle.tsx index 69c4ddfd98..dfab6aee3e 100644 --- a/src/course-home/outline-tab/section-outline/SectionTitle.tsx +++ b/src/course-home/outline-tab/section-outline/SectionTitle.tsx @@ -35,7 +35,9 @@ const SectionTitle: React.FC = ({ complete, hideFromTOC, title }) => { )}
- {title} +

+ {title} +

, {intl.formatMessage(complete ? messages.completedSection : messages.incompleteSection)} diff --git a/src/index.scss b/src/index.scss index 37623bb29a..b9a5cca12c 100755 --- a/src/index.scss +++ b/src/index.scss @@ -436,12 +436,12 @@ .course-outline-tab .pgn__card { .pgn__card-header { display: block; - + .pgn__card-header-content { margin-top: 0; } } - + .pgn__card-header-actions { margin-left: 0; } diff --git a/src/plugin-slots/CourseHomeSectionOutlineSlot/index.tsx b/src/plugin-slots/CourseHomeSectionOutlineSlot/index.tsx index ff188513f8..7f18561ffe 100644 --- a/src/plugin-slots/CourseHomeSectionOutlineSlot/index.tsx +++ b/src/plugin-slots/CourseHomeSectionOutlineSlot/index.tsx @@ -16,7 +16,7 @@ const CourseHomeSectionOutlineSlot: React.FC = ({ idAliases={['course_home_section_outline_slot']} pluginProps={{ expandAll, sectionIds, sections }} > -
    +