Skip to content

Commit 5120cd7

Browse files
Joshua-HowardJoshua-Howard
committed
Initial Puppeteer Automated Tests: hooks-redux-router-typescript
1 parent 3c9ca56 commit 5120cd7

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

70 files changed

+19475
-0
lines changed

‎sandboxes/automated-tests/.eslintrc.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
module.exports = {
2+
extends: ['airbnb', 'prettier'],
3+
parser: 'babel-eslint',
4+
plugins: ['prettier'],
5+
rules: {
6+
'prettier/prettier': ['error'],
7+
'react/jsx-filename-extension': [0],
8+
'no-console': [0],
9+
'react/prop-types': [0]
10+
}
11+
};

‎sandboxes/automated-tests/Backend/server.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
const express = require('express');
2+
const path = require('path');
3+
4+
const app = express();
5+
6+
app.use(express.static(path.resolve(__dirname, '../', 'Frontend', 'public')));
7+
8+
const server = app.listen(3000);
9+
// () => {console.log('Express listening on port 3000');}
10+
11+
module.exports = server;

‎sandboxes/automated-tests/Frontend/public/index-bundle.js

Lines changed: 1282 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎sandboxes/automated-tests/Frontend/public/index.html

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<meta name="theme-color" content="#000000" />
7+
<meta name="description" content="Reactime Sandboxes" />
8+
<title>Reactime Sandboxes</title>
9+
</head>
10+
<body>
11+
<noscript>You need to enable JavaScript to run this app.</noscript>
12+
<div id="root">
13+
HTML in the Root Div
14+
</div>
15+
<script src="./index-bundle.js"></script>
16+
</body>
17+
</html>

‎sandboxes/automated-tests/Frontend/public/typescript-bundle.js

Lines changed: 1270 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎sandboxes/automated-tests/Frontend/public/typescript.html

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<meta name="theme-color" content="#000000" />
7+
<meta name="description" content="Reactime Sandboxes" />
8+
<title>Typescript Reactime Sandboxes</title>
9+
</head>
10+
<body>
11+
<noscript>You need to enable JavaScript to run this app.</noscript>
12+
<div id="root">
13+
HTML in the Root Div
14+
</div>
15+
<script src="./typescript-bundle.js"></script>
16+
</body>
17+
</html>

‎sandboxes/automated-tests/README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# reactime-sandboxes
2+
Sandboxes for testing Reactime

‎sandboxes/automated-tests/__tests__/hooks-redux-router-typescript.js

Lines changed: 185 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,185 @@
1+
/* eslint-disable no-undef */
2+
import 'babel-polyfill';
3+
4+
const puppeteer = require('puppeteer');
5+
6+
const SERVER = require('../Backend/server');
7+
8+
const APP = 'http://localhost:3000';
9+
const TYPESCRIPT = 'http://localhost:3000/typescript.html';
10+
11+
let browser;
12+
let page;
13+
14+
describe('Sandbox Tests', () => {
15+
beforeAll(async () => {
16+
await SERVER;
17+
18+
browser = await puppeteer.launch({
19+
args: ['--no-sandbox', '--disable-setuid-sandbox']
20+
// headless: false
21+
});
22+
page = await browser.newPage();
23+
});
24+
25+
afterAll(async () => {
26+
await SERVER.close();
27+
28+
await browser.close();
29+
});
30+
31+
describe('Non-Typescript Tests', () => {
32+
describe('Sandbox Launch', () => {
33+
it('Sandboxes Load Successfully', async () => {
34+
await page.goto(APP);
35+
const title = await page.$eval('title', el => el.innerHTML);
36+
expect(title).toBe('Reactime Sandboxes');
37+
38+
// await page.screenshot({ path: 'example.png' }); // Add a screenshot
39+
});
40+
});
41+
42+
describe('Hook Tests', () => {
43+
it('The parent count should be 1 after the button is clicked 2 times', async () => {
44+
await page.$eval('#increaseButton', el => el.click());
45+
await page.$eval('#increaseButton', el => el.click());
46+
47+
const lastSnapshotJSON = await page.$eval(
48+
'#lastSnapshot',
49+
el => el.innerHTML
50+
);
51+
52+
const lastSnapshot = await JSON.parse(lastSnapshotJSON);
53+
54+
// The snapshot is 1 event behind currently; if this is changed then the expected value would be 2
55+
// console.log(JSON.parse(document.querySelector('#lastSnapshot').innerHTML).children[0].children[1].state.count)
56+
expect(lastSnapshot.children[0].children[1].state.count).toBe(1);
57+
});
58+
59+
it('After the both button is clicked 2 times, the first child count should be 1 and the second child count should be 999', async () => {
60+
await page.$eval('#childBothButton', el => el.click());
61+
await page.$eval('#childBothButton', el => el.click());
62+
63+
const lastSnapshotJSON = await page.$eval(
64+
'#lastSnapshot',
65+
el => el.innerHTML
66+
);
67+
68+
const lastSnapshot = await JSON.parse(lastSnapshotJSON);
69+
70+
// console.log(JSON.parse(document.querySelector('#lastSnapshot').innerHTML).children[0].children[1].children[0].state.count2)
71+
expect(
72+
lastSnapshot.children[0].children[1].children[0].state.count2
73+
).toBe(1);
74+
75+
expect(
76+
lastSnapshot.children[0].children[1].children[0].state.count3
77+
).toBe(999);
78+
});
79+
});
80+
81+
describe('UseEffect Tests', () => {
82+
it('Should navigate to the useEffect Tests', async () => {
83+
await page.$eval('#UseEffect', el => el.click());
84+
});
85+
});
86+
87+
describe('UseContext Tests', () => {
88+
it('Should navigate to the UseContext Tests', async () => {
89+
await page.$eval('#UseContext', el => el.click());
90+
});
91+
});
92+
93+
describe('UseMemo Tests', () => {
94+
it('Should navigate to the UseMemo Tests', async () => {
95+
await page.$eval('#UseMemo', el => el.click());
96+
});
97+
});
98+
99+
describe('Redux Tests', () => {
100+
it('Should navigate to the Redux Tests', async () => {
101+
await page.$eval('#Redux', el => el.click());
102+
});
103+
});
104+
105+
describe('Router Tests', () => {
106+
it('Should navigate to the Router Tests', async () => {
107+
await page.$eval('#Router', el => el.click());
108+
});
109+
});
110+
111+
describe('SetState Tests', () => {
112+
it('Should navigate to the SetState Tests', async () => {
113+
await page.$eval('#SetState', el => el.click());
114+
});
115+
});
116+
117+
describe('SetStateConditional Tests', () => {
118+
it('Should navigate to the SetStateConditional Tests', async () => {
119+
await page.$eval('#SetStateConditional', el => el.click());
120+
});
121+
});
122+
123+
describe('ComponentDidMount Tests', () => {
124+
it('Should navigate to the ComponentDidMount Tests', async () => {
125+
await page.$eval('#ComponentDidMount', el => el.click());
126+
});
127+
});
128+
});
129+
130+
describe('Typescript Tests', () => {
131+
describe('Typescript Sandbox Launch', () => {
132+
it('Typescript Sandboxes Load Successfully', async () => {
133+
await page.goto(TYPESCRIPT);
134+
const title = await page.$eval('title', el => el.innerHTML);
135+
expect(title).toBe('Typescript Reactime Sandboxes');
136+
137+
// await page.screenshot({ path: 'example.png' }); // Add a screenshot
138+
});
139+
});
140+
141+
describe('Typescript Hook Tests', () => {
142+
describe('UseEffect Tests', () => {
143+
it('Should navigate to the useEffect Tests', async () => {
144+
await page.$eval('#UseEffect', el => el.click());
145+
});
146+
});
147+
148+
describe('UseContext Tests', () => {
149+
it('Should navigate to the UseContext Tests', async () => {
150+
await page.$eval('#UseContext', el => el.click());
151+
});
152+
});
153+
154+
describe('UseMemo Tests', () => {
155+
it('Should navigate to the UseMemo Tests', async () => {
156+
await page.$eval('#UseMemo', el => el.click());
157+
});
158+
});
159+
160+
describe('Redux Tests', () => {
161+
it('Should navigate to the Redux Tests', async () => {
162+
await page.$eval('#Redux', el => el.click());
163+
});
164+
});
165+
166+
describe('Router Tests', () => {
167+
it('Should navigate to the Router Tests', async () => {
168+
await page.$eval('#Router', el => el.click());
169+
});
170+
});
171+
172+
describe('SetState Tests', () => {
173+
it('Should navigate to the SetState Tests', async () => {
174+
await page.$eval('#SetState', el => el.click());
175+
});
176+
});
177+
178+
describe('ComponentDidMount Tests', () => {
179+
it('Should navigate to the ComponentDidMount Tests', async () => {
180+
await page.$eval('#ComponentDidMount', el => el.click());
181+
});
182+
});
183+
});
184+
});
185+
});

‎sandboxes/automated-tests/babel.config.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
module.exports = {
2+
presets: ['@babel/preset-env', '@babel/preset-react'],
3+
plugins: [['@babel/plugin-proposal-class-properties', { loose: true }]]
4+
};

‎sandboxes/automated-tests/hooks-redux-router/Frontend/app.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import React from 'react';
2+
import './index.scss';
3+
// import { Provider } from 'react-redux';
4+
// import store from './src/redux/store';
5+
import Scenes from './src/scenes/index';
6+
7+
const App = () => {
8+
return (
9+
<>
10+
{/* <Provider store={store}> */}
11+
<Scenes />
12+
{/* </Provider> */}
13+
</>
14+
);
15+
};
16+
17+
export default App;

0 commit comments

Comments
 (0)