-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Wire up Jest tests with an example pattern
- Loading branch information
1 parent
63f80b1
commit 6aa8b0d
Showing
8 changed files
with
2,768 additions
and
1,055 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| import BlogPostPreview from "./BlogPostPreview"; | ||
| import { mockBlogPostPreview } from "fixtures/cms-blog-post-preview"; | ||
| import { render } from "@testing-library/react"; | ||
|
|
||
| // Mock MarkdownContent component | ||
| jest.mock("components/MarkdownContent", () => { | ||
| return function MockMarkdownContent({ content }) { | ||
| return <div data-testid="mock-markdown-content">{content}</div>; | ||
| }; | ||
| }); | ||
|
|
||
| describe("BlogPostPreview", () => { | ||
| it("renders preview textual data", () => { | ||
| const { debug, getByText, getByAltText } = render( | ||
| <BlogPostPreview {...mockBlogPostPreview} /> | ||
| ); | ||
|
|
||
| // Test title appears | ||
| expect( | ||
| getByText( | ||
| "Samvera Connect 2023 Conference Celebrates In-Person Gathering of Global Community" | ||
| ) | ||
| ).toBeInTheDocument(); | ||
|
|
||
| // Publish Date | ||
| expect(getByText("November 7, 2023")).toBeInTheDocument(); | ||
|
|
||
| // Blog post content | ||
| expect( | ||
| getByText( | ||
| "Philadelphia, PA - Samvera Connect 2023, the much-anticipated conference of the Samvera Community, concluded on October 26th at the Philadelphia Marriott Old City, marking a triumphant return to in-person events after four years of virtual conferences. The conference brought together 78 attendees from five countries, fostering a sense of community solidarity and advancing the technical development and collaboration efforts of the Samvera community." | ||
| ) | ||
| ).toBeInTheDocument(); | ||
|
|
||
| // Tag Cloud | ||
| expect(getByText(/news/i)).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it("renders Blog Post Preview image", () => { | ||
| const { debug, getByAltText } = render( | ||
| <BlogPostPreview {...mockBlogPostPreview} /> | ||
| ); | ||
| debug(); | ||
|
|
||
| // Image renders | ||
| expect( | ||
| getByAltText("Philadelphia downtown - Photo by Micah Giszack on Unsplash") | ||
| ).toBeInTheDocument(); | ||
|
|
||
| // get an element by tagName "img" | ||
| const img = document.querySelector("img"); | ||
|
|
||
| // check it's alt attribute | ||
| expect(img.alt).toBe( | ||
| "Philadelphia downtown - Photo by Micah Giszack on Unsplash" | ||
| ); | ||
|
|
||
| // check it's src attribute | ||
| expect(img.src).toBe( | ||
| "http://images.ctfassets.net/gmxjheo1ix1o/16iCFPpKQ2PraT2Sjx344E/95a32867bc401ab67098af8a5240256c/micah-giszack-1AH0PfLQfDA-unsplash.jpg" | ||
| ); | ||
| }); | ||
| }); | ||
| // |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,69 @@ | ||
| export const mockBlogPostPreview = { | ||
| cmsContent: { | ||
| data: {}, | ||
| content: [ | ||
| { | ||
| data: {}, | ||
| content: [ | ||
| { | ||
| data: {}, | ||
| marks: [], | ||
| value: | ||
| "Philadelphia, PA - Samvera Connect 2023, the much-anticipated conference of the Samvera Community, concluded on October 26th at the Philadelphia Marriott Old City, marking a triumphant return to in-person events after four years of virtual conferences. The conference brought together 78 attendees from five countries, fostering a sense of community solidarity and advancing the technical development and collaboration efforts of the Samvera community.", | ||
| nodeType: "text", | ||
| }, | ||
| ], | ||
| nodeType: "paragraph", | ||
| }, | ||
| ], | ||
| nodeType: "document", | ||
| }, | ||
| image: { | ||
| metadata: { | ||
| tags: [], | ||
| }, | ||
| sys: { | ||
| space: { | ||
| sys: { | ||
| type: "Link", | ||
| linkType: "Space", | ||
| id: "gmxjheo1ix1o", | ||
| }, | ||
| }, | ||
| id: "16iCFPpKQ2PraT2Sjx344E", | ||
| type: "Asset", | ||
| createdAt: "2023-11-15T10:09:34.617Z", | ||
| updatedAt: "2023-11-15T10:09:34.617Z", | ||
| environment: { | ||
| sys: { | ||
| id: "master", | ||
| type: "Link", | ||
| linkType: "Environment", | ||
| }, | ||
| }, | ||
| revision: 1, | ||
| locale: "en-US", | ||
| }, | ||
| fields: { | ||
| title: "Philadelphia downtown - Photo by Micah Giszack on Unsplash", | ||
| description: "Philadelphia downtown", | ||
| file: { | ||
| url: "//images.ctfassets.net/gmxjheo1ix1o/16iCFPpKQ2PraT2Sjx344E/95a32867bc401ab67098af8a5240256c/micah-giszack-1AH0PfLQfDA-unsplash.jpg", | ||
| details: { | ||
| size: 792856, | ||
| image: { | ||
| width: 1920, | ||
| height: 1440, | ||
| }, | ||
| }, | ||
| fileName: "micah-giszack-1AH0PfLQfDA-unsplash.jpg", | ||
| contentType: "image/jpeg", | ||
| }, | ||
| }, | ||
| }, | ||
| publishDate: "November 7, 2023", | ||
| slug: "samvera-connect-2023-success", | ||
| tag: ["news"], | ||
| title: | ||
| "Samvera Connect 2023 Conference Celebrates In-Person Gathering of Global Community", | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| import nextJest from "next/jest.js"; | ||
|
|
||
| const createJestConfig = nextJest({ | ||
| // Provide the path to your Next.js app to load next.config.js and .env files in your test environment | ||
| dir: "./", | ||
| }); | ||
|
|
||
| // Add any custom config to be passed to Jest | ||
| /** @type {import('jest').Config} */ | ||
| const config = { | ||
| // Add more setup options before each test is run | ||
| setupFilesAfterEnv: ["<rootDir>/jest.setup.js"], | ||
| moduleNameMapper: { | ||
| "^components/(.*)$": "<rootDir>/components/$1", | ||
| "^fixtures/(.*)$": "<rootDir>/fixtures/$1", | ||
| }, | ||
| testEnvironment: "jest-environment-jsdom", | ||
| }; | ||
|
|
||
| // createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async | ||
| export default createJestConfig(config); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| import "@testing-library/jest-dom"; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.