From 68926334a1b80641d0c0f33345f2629b642c988e Mon Sep 17 00:00:00 2001 From: Diana Villalvazo Date: Tue, 29 Jul 2025 08:13:07 -0600 Subject: [PATCH] test: transform snapshot into rtl test 1/2 (#1756) * test: remove snapshots and use rtl tests * test: improve coverage on search results test --- src/__snapshots__/index.test.jsx.snap | 228 --- .../CoursewareSearchEmpty.test.jsx | 10 +- .../CoursewareSearchResults.test.jsx | 50 +- .../CoursewareSearchEmpty.test.jsx.snap | 10 - .../CoursewareSearchResults.test.jsx.snap | 1238 ----------------- src/index.test.jsx | 6 +- 6 files changed, 56 insertions(+), 1486 deletions(-) delete mode 100644 src/__snapshots__/index.test.jsx.snap delete mode 100644 src/course-home/courseware-search/__snapshots__/CoursewareSearchEmpty.test.jsx.snap delete mode 100644 src/course-home/courseware-search/__snapshots__/CoursewareSearchResults.test.jsx.snap diff --git a/src/__snapshots__/index.test.jsx.snap b/src/__snapshots__/index.test.jsx.snap deleted file mode 100644 index 7eb0886b..00000000 --- a/src/__snapshots__/index.test.jsx.snap +++ /dev/null @@ -1,228 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`app registry subscribe: APP_INIT_ERROR. snapshot: displays an ErrorPage to root element 1`] = ` - - - -`; - -exports[`app registry subscribe: APP_READY. links App to root element 1`] = ` - - - - - - - - -
- - - - - } - path="*" - /> - - - - } - path="/goal-unsubscribe/:token" - /> - - - - } - path="/redirect/*" - /> - - - - } - path="/preferences-unsubscribe/:userToken/:updatePatch" - /> - - - - } - path="/course/:courseId/access-denied" - /> - - - - - - } - path="/course/:courseId/home" - /> - - - - - - } - path="/course/:courseId/live" - /> - - - - - - } - path="/course/:courseId/dates" - /> - - - - - - } - path="/course/:courseId/discussion/:path/*" - /> - - - - - - } - path="/course/:courseId/progress/:targetUserId/" - /> - - - - - - } - path="/course/:courseId/progress" - /> - - - - - - } - path="/course/:courseId/course-end" - /> - - - - } - path="/course/:courseId/:sequenceId/:unitId" - /> - - - - } - path="/course/:courseId/:sequenceId" - /> - - - - } - path="/course/:courseId" - /> - - - - } - path="/preview/course/:courseId/:sequenceId/:unitId" - /> - - - - } - path="/preview/course/:courseId/:sequenceId" - /> - -
- - - - - -`; diff --git a/src/course-home/courseware-search/CoursewareSearchEmpty.test.jsx b/src/course-home/courseware-search/CoursewareSearchEmpty.test.jsx index 7ef5909a..0a17a4f3 100644 --- a/src/course-home/courseware-search/CoursewareSearchEmpty.test.jsx +++ b/src/course-home/courseware-search/CoursewareSearchEmpty.test.jsx @@ -5,6 +5,7 @@ import { screen, } from '../../setupTest'; import CoursewareSearchEmpty from './CoursewareSearchEmpty'; +import messages from './messages'; function renderComponent() { const { container } = render(); @@ -16,9 +17,12 @@ describe('CoursewareSearchEmpty', () => { initializeMockApp(); }); - it('should match the snapshot', () => { + it('render empty results text and corresponding classes', () => { renderComponent(); - - expect(screen.getByTestId('no-results')).toMatchSnapshot(); + const emptyText = screen.getByText(messages.searchResultsNone.defaultMessage); + expect(emptyText).toBeInTheDocument(); + expect(emptyText).toHaveClass('courseware-search-results__empty'); + expect(emptyText).toHaveAttribute('data-testid', 'no-results'); + expect(emptyText.parentElement).toHaveClass('courseware-search-results'); }); }); diff --git a/src/course-home/courseware-search/CoursewareSearchResults.test.jsx b/src/course-home/courseware-search/CoursewareSearchResults.test.jsx index eae95083..bddb40ef 100644 --- a/src/course-home/courseware-search/CoursewareSearchResults.test.jsx +++ b/src/course-home/courseware-search/CoursewareSearchResults.test.jsx @@ -7,6 +7,7 @@ import { import CoursewareSearchResults from './CoursewareSearchResults'; import messages from './messages'; import searchResultsFactory from './test-data/search-results-factory'; +import * as mock from './test-data/mocked-response.json'; jest.mock('react-redux'); @@ -34,8 +35,53 @@ describe('CoursewareSearchResults', () => { renderComponent({ results }); }); - it('should match the snapshot', () => { - expect(screen.getByTestId('search-results')).toMatchSnapshot(); + it('should render complete list', () => { + const courses = screen.getAllByRole('link'); + expect(courses.length).toBe(mock.results.length); + }); + + it('should render correct link for internal course', () => { + const courses = screen.getAllByRole('link'); + const firstCourse = courses[0]; + const firstCourseTitle = firstCourse.querySelector('.courseware-search-results__title span'); + expect(firstCourseTitle.innerHTML).toEqual(mock.results[0].data.content.display_name); + expect(firstCourse.href).toContain(mock.results[0].data.url); + expect(firstCourse).not.toHaveAttribute('target', '_blank'); + expect(firstCourse).not.toHaveAttribute('rel', 'nofollow'); + }); + + it('should render correct link if is External url course', () => { + const courses = screen.getAllByRole('link'); + const externalCourse = courses[courses.length - 1]; + const externalCourseTitle = externalCourse.querySelector('.courseware-search-results__title span'); + expect(externalCourseTitle.innerHTML).toEqual(mock.results[mock.results.length - 1].data.content.display_name); + expect(externalCourse.href).toContain(mock.results[mock.results.length - 1].data.url); + expect(externalCourse).toHaveAttribute('target', '_blank'); + expect(externalCourse).toHaveAttribute('rel', 'nofollow'); + const icon = externalCourse.querySelector('svg'); + expect(icon).toBeInTheDocument(); + }); + + it('should render location breadcrumbs', () => { + const breadcrumbs = screen.getAllByText(mock.results[0].data.location[0]); + expect(breadcrumbs.length).toBeGreaterThan(0); + const firstBreadcrumb = breadcrumbs[0].closest('li'); + expect(firstBreadcrumb).toBeInTheDocument(); + expect(firstBreadcrumb.querySelector('div').textContent).toBe(mock.results[0].data.location[0]); + expect(firstBreadcrumb.nextSibling.querySelector('div').textContent).toBe(mock.results[0].data.location[1]); + }); + }); + + describe('when results are provided with content hits', () => { + beforeEach(() => { + const { results } = searchResultsFactory('Passing'); + renderComponent({ results }); + }); + + it('should render content hits', () => { + const contentHits = screen.getByText('1'); + expect(contentHits).toBeInTheDocument(); + expect(contentHits.tagName).toBe('EM'); }); }); }); diff --git a/src/course-home/courseware-search/__snapshots__/CoursewareSearchEmpty.test.jsx.snap b/src/course-home/courseware-search/__snapshots__/CoursewareSearchEmpty.test.jsx.snap deleted file mode 100644 index e87c856e..00000000 --- a/src/course-home/courseware-search/__snapshots__/CoursewareSearchEmpty.test.jsx.snap +++ /dev/null @@ -1,10 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CoursewareSearchEmpty should match the snapshot 1`] = ` -

- No results found. -

-`; diff --git a/src/course-home/courseware-search/__snapshots__/CoursewareSearchResults.test.jsx.snap b/src/course-home/courseware-search/__snapshots__/CoursewareSearchResults.test.jsx.snap deleted file mode 100644 index 12178a62..00000000 --- a/src/course-home/courseware-search/__snapshots__/CoursewareSearchResults.test.jsx.snap +++ /dev/null @@ -1,1238 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CoursewareSearchResults when list of results is provided should match the snapshot 1`] = ` -
- -
- - - -
-
-
- - Demo Course Overview - -
-
    -
  • -
    - Introduction -
    -
    • -
  • -
    - Demo Course Overview -
    -
    • -
-
- - -
- - - -
-
-
- - Passing a Course - - - 1 - -
-
    -
  • -
    - About Exams and Certificates -
    -
    • -
  • -
    - edX Exams -
    -
    • -
  • -
    - Passing a Course -
    -
    • -
-
- - -
- - - -
-
-
- - Passing a Course - -
-
    -
  • -
    - About Exams and Certificates -
    -
    • -
  • -
    - edX Exams -
    -
    • -
  • -
    - Passing a Course -
    -
    • -
-
- - -
- - - -
-
-
- - Text Input - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Homework - Question Styles -
    -
    • -
  • -
    - Text input -
    -
    • -
-
- - -
- - - -
-
-
- - Pointing on a Picture - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Homework - Question Styles -
    -
    • -
  • -
    - Pointing on a Picture -
    -
    • -
-
- - -
- - - -
-
-
- - Getting Answers - -
-
    -
  • -
    - About Exams and Certificates -
    -
    • -
  • -
    - edX Exams -
    -
    • -
  • -
    - Getting Answers -
    -
    • -
-
- - -
- - - -
-
-
- - Welcome! - - - 30 - -
-
    -
  • -
    - Introduction -
    -
    • -
  • -
    - Demo Course Overview -
    -
    • -
  • -
    - Introduction: Video and Sequences -
    -
    • -
-
- - -
- - - -
-
-
- - Multiple Choice Questions - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Homework - Question Styles -
    -
    • -
  • -
    - Multiple Choice Questions -
    -
    • -
-
- - -
- - - -
-
-
- - Numerical Input - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Homework - Question Styles -
    -
    • -
  • -
    - Numerical Input -
    -
    • -
-
- - -
- - - -
-
-
- - Connecting a Circuit and a Circuit Diagram - - - 3 - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Lesson 1 - Getting Started -
    -
    • -
  • -
    - Video Presentation Styles -
    -
    • -
-
- - -
- - - -
-
-
- - CAPA - -
-
    -
  • -
    - Example Week 2: Get Interactive -
    -
    • -
  • -
    - Homework - Labs and Demos -
    -
    • -
  • -
    - Code Grader -
    -
    • -
-
- - -
- - - -
-
-
- - Interactive Questions - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Lesson 1 - Getting Started -
    -
    • -
  • -
    - Interactive Questions -
    -
    • -
-
- - -
- - - -
-
-
- - Blank HTML Page - - - 6 - -
-
    -
  • -
    - Introduction -
    -
    • -
  • -
    - Demo Course Overview -
    -
    • -
  • -
    - Introduction: Video and Sequences -
    -
    • -
-
- - -
- - - -
-
-
- - Discussion Forums - - - 5 - -
-
    -
  • -
    - Example Week 3: Be Social -
    -
    • -
  • -
    - Lesson 3 - Be Social -
    -
    • -
  • -
    - Discussion Forums -
    -
    • -
-
- - -
- - - -
-
-
- - Overall Grade - - - 7 - -
-
    -
  • -
    - About Exams and Certificates -
    -
    • -
  • -
    - edX Exams -
    -
    • -
  • -
    - Overall Grade Performance -
    -
    • -
-
- - -
- - - -
-
-
- - Blank HTML Page - - - 3 - -
-
    -
  • -
    - Example Week 3: Be Social -
    -
    • -
  • -
    - Lesson 3 - Be Social -
    -
    • -
  • -
    - Homework - Find Your Study Buddy -
    -
    • -
-
- - -
- - - -
-
-
- - Find Your Study Buddy - - - 3 - -
-
    -
  • -
    - Example Week 3: Be Social -
    -
    • -
  • -
    - Homework - Find Your Study Buddy -
    -
    • -
  • -
    - Homework - Find Your Study Buddy -
    -
    • -
-
- - -
- - - -
-
-
- - Be Social - - - 4 - -
-
    -
  • -
    - Example Week 3: Be Social -
    -
    • -
  • -
    - Lesson 3 - Be Social -
    -
    • -
  • -
    - Be Social -
    -
    • -
-
- - -
- - - -
-
-
- - EdX Exams - - - 4 - -
-
    -
  • -
    - About Exams and Certificates -
    -
    • -
  • -
    - edX Exams -
    -
    • -
  • -
    - EdX Exams -
    -
    • -
-
- - -
- - - -
-
-
- - When Are Your Exams? - - - 2 - -
-
    -
  • -
    - Example Week 1: Getting Started -
    -
    • -
  • -
    - Lesson 1 - Getting Started -
    -
    • -
  • -
    - When Are Your Exams? -
    -
    • -
-
- - -
- - - -
-
-
- - External Course Link Test - -
-
- -
-`; diff --git a/src/index.test.jsx b/src/index.test.jsx index 4ff17b46..27e9bb81 100644 --- a/src/index.test.jsx +++ b/src/index.test.jsx @@ -69,15 +69,11 @@ describe('app registry', () => { const callArgs = subscribe.mock.calls[0]; expect(callArgs[0]).toEqual(APP_READY); callArgs[1](); - const [rendered] = mockRender.mock.calls[0]; - expect(rendered).toMatchSnapshot(); }); - test('subscribe: APP_INIT_ERROR. snapshot: displays an ErrorPage to root element', () => { + test('subscribe: APP_INIT_ERROR.', () => { const callArgs = subscribe.mock.calls[1]; expect(callArgs[0]).toEqual(APP_INIT_ERROR); const error = { message: 'test-error-message' }; callArgs[1](error); - const [rendered] = mockRender.mock.calls[0]; - expect(rendered).toMatchSnapshot(); }); });