Skip to content

Commit

Permalink
Fix jest tests
Browse files Browse the repository at this point in the history
  • Loading branch information
smartspot2 committed Aug 13, 2023
1 parent 0f76572 commit 1d7d752
Show file tree
Hide file tree
Showing 9 changed files with 16,125 additions and 18,499 deletions.
5 changes: 5 additions & 0 deletions csm_web/frontend/src/tests/__mocks__/styleMock.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
/**
* Mock with no styles.
*/

module.exports = {};
70 changes: 35 additions & 35 deletions csm_web/frontend/src/tests/__snapshots__/Modal.test.tsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -6,23 +6,23 @@ exports[`Modal should close correctly when an external modal closer is clicked 1
class="modal-overlay"
/>
<div
class="modal test-modal"
class="modal "
>
<div
class="modal-contents"
class="modal-close-container"
>
<div
<button
aria-label="close"
class="modal-close-x"
>
<button
aria-label="close"
class="inline-plus-sign"
>
<span>
×
</span>
</button>
</div>
<x-svg
classname="icon"
/>
</button>
</div>
<div
class="modal-contents test-modal"
>
<div>
Hello World
</div>
Expand All @@ -45,20 +45,20 @@ exports[`Modal should render correctly 1`] = `
class="modal "
>
<div
class="modal-contents"
class="modal-close-container"
>
<div
<button
aria-label="close"
class="modal-close-x"
>
<button
aria-label="close"
class="inline-plus-sign"
>
<span>
×
</span>
</button>
</div>
<x-svg
classname="icon"
/>
</button>
</div>
<div
class="modal-contents "
>
<div>
Hello World
</div>
Expand All @@ -73,23 +73,23 @@ exports[`Modal should render correctly with className 1`] = `
class="modal-overlay"
/>
<div
class="modal test-modal"
class="modal "
>
<div
class="modal-contents"
class="modal-close-container"
>
<div
<button
aria-label="close"
class="modal-close-x"
>
<button
aria-label="close"
class="inline-plus-sign"
>
<span>
×
</span>
</button>
</div>
<x-svg
classname="icon"
/>
</button>
</div>
<div
class="modal-contents test-modal"
>
<div>
Hello World
</div>
Expand Down
16 changes: 16 additions & 0 deletions csm_web/frontend/src/tests/__transformers__/pathTransformer.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
/**
* Transform files to their path name.
*/

import * as path from "path";

module.exports = {
process(sourceText, sourcePath, options) {
// convert path name to lowercase, and replace the "." with "-";
// this circumvents errors relating to component naming
const base = path.basename(sourcePath).toLowerCase().replace(".", "-");
return {
code: `module.exports = ${JSON.stringify(base)};`
};
}
};
10 changes: 5 additions & 5 deletions csm_web/frontend/src/tests/section/StudentDropper.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,14 +22,14 @@ jest.mock("../../components/Modal", () => {

describe("StudentDropper", () => {
it("should render correctly without interaction", () => {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" />, {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" courseRestricted={false} />, {
wrapper: testQueryClientWrapper
});
expect(component.asFragment()).toMatchSnapshot();
});

it("should render modal correctly after clicking x", () => {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" />, {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" courseRestricted={false} />, {
wrapper: testQueryClientWrapper
});

Expand All @@ -42,7 +42,7 @@ describe("StudentDropper", () => {
});

it("should close modal correctly", () => {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" />, {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" courseRestricted={false} />, {
wrapper: testQueryClientWrapper
});

Expand Down Expand Up @@ -72,7 +72,7 @@ describe("StudentDropper", () => {
return null as any;
});

const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" />, {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" courseRestricted={false} />, {
wrapper: testQueryClientWrapper
});

Expand Down Expand Up @@ -129,7 +129,7 @@ describe("StudentDropper", () => {
return null as any;
});

const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" />, {
const component = render(<StudentDropper id={1} sectionId={2} name="Test Student" courseRestricted={false} />, {
wrapper: testQueryClientWrapper
});

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,10 @@ exports[`StudentDropper should close modal correctly 1`] = `
<span
class="student-dropper "
>
<span
class="inline-plus-sign"
<x-svg
classname="icon inline-plus-sign"
title="Drop student from section"
>
×
</span>
/>
</span>
</DocumentFragment>
`;
Expand All @@ -20,12 +18,10 @@ exports[`StudentDropper should render correctly without interaction 1`] = `
<span
class="student-dropper "
>
<span
class="inline-plus-sign"
<x-svg
classname="icon inline-plus-sign"
title="Drop student from section"
>
×
</span>
/>
</span>
</DocumentFragment>
`;
Expand All @@ -35,71 +31,72 @@ exports[`StudentDropper should render modal correctly after clicking x 1`] = `
<span
class="student-dropper ban-prompt-visible"
>
<span
class="inline-plus-sign"
<x-svg
classname="icon inline-plus-sign"
title="Drop student from section"
>
×
</span>
/>
<div
class="_mock-modal"
>
<button>
Close
</button>
<div
class="studentDropper"
>
<div
class="studentDropperHeadItem"
<div>
<h2
class="student-dropper-head-item"
>
DROP Student
</div>
<div>
</h2>
<div
class="student-dropper-checkbox-container"
>
<input
id="drop"
name="drop"
type="checkbox"
/>
<label
class="studentDropperCheckboxLabel"
class="student-dropper-checkbox-label"
for="drop"
>
I would like to DROP Test Student from this section.
</label>
<br />
</div>
<div
class="studentDropperHeadItem"
</div>
<div>
<h2
class="student-dropper-head-item"
>
BAN Student
</div>
<div>
</h2>
<div
class="student-dropper-checkbox-container"
>
<input
disabled=""
id="ban"
name="ban"
type="checkbox"
/>
<label
class="studentDropperCheckboxLabel"
class="student-dropper-checkbox-label"
for="ban"
>
I would like to BAN Test Student from this course.
</label>
<br />
</div>
<div
class="studentDropperSubmitWrapper"
</div>
<div
class="student-dropper-submit-wrapper"
>
<button
class="danger-btn"
disabled=""
>
<button
class="studentDropperSubmit"
disabled=""
id="dropper submit button"
>
Submit
</button>
</div>
Submit
</button>
</div>
</div>
</span>
Expand Down
21 changes: 13 additions & 8 deletions jest.config.js → jest.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
* https://jestjs.io/docs/configuration
*/

module.exports = {
/** @type {import('ts-jest').JestConfigWithTsJest} */
export default {
// All imported modules in your tests should be mocked automatically
// automock: false,

Expand All @@ -26,10 +27,7 @@ module.exports = {
coverageDirectory: "coverage",

// An array of regexp pattern strings used to skip coverage collection
coveragePathIgnorePatterns: [
"/node_modules/",
"/utils/api.tsx",
],
coveragePathIgnorePatterns: ["/node_modules/", "/utils/api.tsx"],

// Indicates which provider should be used to instrument code for coverage
// coverageProvider: "babel",
Expand Down Expand Up @@ -96,7 +94,9 @@ module.exports = {
// ],

// A map from regular expressions to module names or to arrays of module names that allow to stub out resources with a single module
// moduleNameMapper: {},
moduleNameMapper: {
"\\.(s[ac]ss|css)$": "<rootDir>/csm_web/frontend/src/tests/__mocks__/styleMock.ts"
},

// An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader
// modulePathIgnorePatterns: [],
Expand All @@ -108,7 +108,7 @@ module.exports = {
// notifyMode: "failure-change",

// A preset that is used as a base for Jest's configuration
// preset: undefined,
preset: "ts-jest",

// Run tests from one or more projects
// projects: undefined,
Expand Down Expand Up @@ -181,7 +181,12 @@ module.exports = {
// testRunner: "jest-circus/runner",

// A map from regular expressions to paths to transformers
// transform: undefined,
transform: {
"\\.([jt]sx?)$": "ts-jest",
// map these extensions to just their path names
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
"<rootDir>/csm_web/frontend/src/tests/__transformers__/pathTransformer.ts"
}

// An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
// transformIgnorePatterns: [
Expand Down
Loading

0 comments on commit 1d7d752

Please sign in to comment.