Skip to content

Commit 6fec148

Browse files
souhaib-benbouzidsouhaib-benbouzid
committed
modified testing
- added @testing-library/react - added footer test - modified imports resolving in jest.config tsconfig
1 parent 24b682b commit 6fec148

File tree

7 files changed

+302
-38
lines changed

7 files changed

+302
-38
lines changed

‎web/jest.config.js‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
11
module.exports = {
22
testEnvironment: "jsdom",
33
collectCoverageFrom: ["src/**/*.{ts,tsx}"],
4-
// coverageThreshold: {
5-
// global: {
6-
// branches: 80,
7-
// functions: 80,
8-
// lines: 80,
9-
// statements: 80,
10-
// },
11-
// },
4+
coverageThreshold: {
5+
global: {
6+
branches: 80,
7+
functions: 80,
8+
lines: 80,
9+
statements: 80,
10+
},
11+
},
1212
transform: {
1313
"^.+\\.(ts|tsx)?$": "ts-jest",
1414
},
1515
coveragePathIgnorePatterns: ["node_modules", "dist"],
16+
modulePaths: ["<rootDir>"],
1617
};

‎web/package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@
7171
"@material-ui/lab": "^4.0.0-alpha.57",
7272
"@n8tb1t/use-scroll-position": "^2.0.3",
7373
"@prettier/plugin-pug": "^1.13.1",
74+
"@testing-library/react": "^11.2.6",
7475
"@types/jest": "^26.0.19",
7576
"@types/markdown-to-jsx": "^6.11.3",
7677
"@types/react": "^17.0.0",
@@ -136,5 +137,6 @@
136137
"webpack": "^5.11.0",
137138
"webpack-cli": "^4.3.0",
138139
"webpack-dev-server": "^3.11.0"
139-
}
140+
},
141+
"dependencies": {}
140142
}

‎web/src/apps/main/components/footer/__snapshots__/footer.spec.tsx.snap‎

Lines changed: 186 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,186 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`components/footer/footer.spec.tsx should render properly 1`] = `
4+
<div>
5+
<footer
6+
class="makeStyles-root-1"
7+
>
8+
<div
9+
class="MuiContainer-root MuiContainer-maxWidthLg css-cnms5y-MuiContainer-root"
10+
>
11+
<div
12+
class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-flex-start"
13+
>
14+
<div
15+
class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-6 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-9"
16+
>
17+
<div
18+
class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-direction-xs-column MuiGrid-grid-xs-12 MuiGrid-grid-md-6"
19+
>
20+
<h6
21+
class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-categoryTitle-3 css-2ulfj5-MuiTypography-root"
22+
>
23+
Helpful Links
24+
</h6>
25+
<a
26+
href="/"
27+
>
28+
<h6
29+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
30+
>
31+
Home
32+
</h6>
33+
</a>
34+
<a
35+
href="/Learn"
36+
>
37+
<h6
38+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
39+
>
40+
Learn
41+
</h6>
42+
</a>
43+
<a
44+
href="/Projects"
45+
>
46+
<h6
47+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
48+
>
49+
Projects
50+
</h6>
51+
</a>
52+
<a
53+
href="/Articles"
54+
>
55+
<h6
56+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
57+
>
58+
Articles
59+
</h6>
60+
</a>
61+
<a
62+
href="/FAQ"
63+
>
64+
<h6
65+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
66+
>
67+
FAQ
68+
</h6>
69+
</a>
70+
</div>
71+
<div
72+
class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-direction-xs-column MuiGrid-grid-xs-12 MuiGrid-grid-md-6"
73+
>
74+
<h6
75+
class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-categoryTitle-3 css-2ulfj5-MuiTypography-root"
76+
>
77+
Social Media
78+
</h6>
79+
<a
80+
href="https://www.github.com/dzcode-io"
81+
>
82+
<h6
83+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
84+
>
85+
Github
86+
</h6>
87+
</a>
88+
<a
89+
href="https://join.slack.com/t/dzcode/shared_invite/zt-ek9kscb7-m8z_~cBjX79l~uchuABPFQ"
90+
>
91+
<h6
92+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
93+
>
94+
Slack
95+
</h6>
96+
</a>
97+
<a
98+
href="https://www.facebook.com/dzcode.io"
99+
>
100+
<h6
101+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
102+
>
103+
Facebook
104+
</h6>
105+
</a>
106+
<a
107+
href="https://www.instagram.com/dzcode.io"
108+
>
109+
<h6
110+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
111+
>
112+
Instagram
113+
</h6>
114+
</a>
115+
<a
116+
href="https://www.youtube.com/channel/UC_tLjuQaYotzERtaAo8Y4SQ"
117+
>
118+
<h6
119+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
120+
>
121+
YouTube
122+
</h6>
123+
</a>
124+
<a
125+
href="https://twitter.com/dzcode_io"
126+
>
127+
<h6
128+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
129+
>
130+
Twitter
131+
</h6>
132+
</a>
133+
<a
134+
href="https://www.linkedin.com/groups/8924363"
135+
>
136+
<h6
137+
class="MuiTypography-root MuiTypography-subtitle2 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ati914-MuiTypography-root"
138+
>
139+
LinkedIn
140+
</h6>
141+
</a>
142+
</div>
143+
</div>
144+
<div
145+
class="MuiGrid-root makeStyles-contactDetails-4 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-3"
146+
>
147+
<h6
148+
class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-categoryTitle-3 css-2ulfj5-MuiTypography-root"
149+
>
150+
Contact Information
151+
</h6>
152+
<a
153+
href="tel:+21367-626-1157"
154+
>
155+
<p
156+
class="MuiTypography-root MuiTypography-body1 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ahj2mt-MuiTypography-root"
157+
>
158+
+213 06-76-26-11-57
159+
</p>
160+
</a>
161+
<a
162+
href="mailto:contact@dzcode.io"
163+
>
164+
<p
165+
class="MuiTypography-root MuiTypography-body1 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ahj2mt-MuiTypography-root"
166+
>
167+
contact@dzcode.io
168+
</p>
169+
</a>
170+
<p
171+
class="MuiTypography-root MuiTypography-body1 MuiTypography-colorInitial MuiTypography-alignInherit MuiTypography-displayInitial makeStyles-linkText-2 css-ahj2mt-MuiTypography-root"
172+
>
173+
Copyright ©
174+
2021
175+
<a
176+
href="https://twitter.com/dzcode_io"
177+
>
178+
@dzCode_io
179+
</a>
180+
</p>
181+
</div>
182+
</div>
183+
</div>
184+
</footer>
185+
</div>
186+
`;

‎web/src/apps/main/components/footer/footer.spec.tsx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import { Footer } from ".";
2+
import { Provider } from "react-redux";
3+
import { BrowserRouter as Router } from "react-router-dom";
4+
import { mainStore } from "src/apps/main/redux";
5+
import { render } from "@testing-library/react";
6+
7+
describe("components/footer/footer.spec.tsx", () => {
8+
test("should render properly", () => {
9+
const { container } = render(
10+
<Provider store={mainStore}>
11+
<Router>
12+
<Footer />
13+
</Router>
14+
</Provider>,
15+
);
16+
expect(container).toMatchSnapshot();
17+
});
18+
});

‎web/src/apps/main/components/footer/index.tsx‎

Lines changed: 20 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -47,34 +47,26 @@ export const Footer: FC = () => {
4747
alignContent="stretch"
4848
>
4949
<Grid container item xs={12} md={9} spacing={6}>
50-
{sections
51-
? sections.map((category, i) => (
52-
<Grid
53-
direction="column"
54-
container
55-
item
56-
xs={12}
57-
md={6}
58-
key={i}
59-
>
60-
<Typography variant="h6" className={classes.categoryTitle}>
61-
{category.title}
62-
</Typography>
63-
{category.links.map((link, i) => {
64-
return (
65-
<LinkV2 key={i} href={link.href}>
66-
<Typography
67-
variant="subtitle2"
68-
className={classes.linkText}
69-
>
70-
{link.text}
71-
</Typography>
72-
</LinkV2>
73-
);
74-
})}
75-
</Grid>
76-
))
77-
: null}
50+
{sections &&
51+
sections.map((category, i) => (
52+
<Grid direction="column" container item xs={12} md={6} key={i}>
53+
<Typography variant="h6" className={classes.categoryTitle}>
54+
{category.title}
55+
</Typography>
56+
{category.links.map((link, i) => {
57+
return (
58+
<LinkV2 key={i} href={link.href}>
59+
<Typography
60+
variant="subtitle2"
61+
className={classes.linkText}
62+
>
63+
{link.text}
64+
</Typography>
65+
</LinkV2>
66+
);
67+
})}
68+
</Grid>
69+
))}
7870
</Grid>
7971
<Grid item xs={12} md={3} className={classes.contactDetails}>
8072
<Typography variant="h6" className={classes.categoryTitle}>

‎web/tsconfig.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,6 @@
5555
/* Advanced Options */
5656
// "declarationDir": "lib" /* Output directory for generated declaration files. */
5757
},
58-
"include": ["./src"],
58+
"include": ["src", "src/**/*"],
5959
"exclude": ["**/webpack.*.js"]
6060
}

0 commit comments

Comments
 (0)