Skip to content

Commit 429d3c9

Browse files
pmhuapmhua
committed
finished setting up test exports for Next App, Philip <https://github.com/pmhua>
1 parent cc117fb commit 429d3c9

File tree

4 files changed

+292
-11
lines changed

4 files changed

+292
-11
lines changed

‎app/src/utils/createNextApp.util.ts‎

Lines changed: 73 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@
33
import createNextFiles from './createNextFiles.util';
44
import { Component } from '../interfaces/Interfaces';
55

6+
import createTestSuiteNext from './createTestSuiteNext.util';
7+
68
const camelToKebab= (camel:string) => {
79
return camel.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
810
};
@@ -24,8 +26,20 @@ const compToCSS = (component: Component) => {
2426
}
2527

2628
//createPackage
27-
export const createPackage = (path, appName) => {
29+
export const createPackage = (path, appName, test) => {
2830
const filePath = `${path}/${appName}/package.json`;
31+
32+
let testpackages = `,
33+
"@types/enzyme": "^3.10.9",
34+
"@types/jest": "^27.0.1",
35+
"babel-jest": "^27.2.0",
36+
"enzyme": "^3.11.0",
37+
"enzyme-adapter-react-16": "^1.15.6",
38+
"jest": "^27.2.0",
39+
"@types/enzyme-adapter-react-16": "^1.0.6",
40+
"identity-obj-proxy": "^3.0.0",
41+
"ts-jest": "^27.0.5"`;
42+
2943
const data = `
3044
{
3145
"name": "reactype-next",
@@ -34,7 +48,9 @@ export const createPackage = (path, appName) => {
3448
"scripts": {
3549
"dev": "next dev",
3650
"build": "next build",
37-
"start": "next start"
51+
"start": "next start"${
52+
test ? `,
53+
"test": "jest"`: '' }
3854
},
3955
"dependencies": {
4056
"next": "9.3.5",
@@ -44,23 +60,65 @@ export const createPackage = (path, appName) => {
4460
"devDependencies": {
4561
"@types/node": "^14.0.20",
4662
"@types/react": "^16.9.41",
47-
"typescript": "^3.9.6"
63+
"@types/react-dom": "^17.0.9",
64+
"typescript": "^3.9.6"${
65+
test ? testpackages : ''
66+
}
4867
}
4968
}
50-
`;
69+
`;
5170
window.api.writeFile(filePath, data, err => {
5271
if (err) {
53-
console.log('package.json error:', err.message);
72+
console.log('createNextApp.util package.json error:', err.message);
5473
} else {
55-
console.log('package.json written successfully');
74+
console.log('createNextApp.util package.json written successfully');
5675
}
5776
});
5877
};
5978
//createTSConfig (empty)
6079
export const createTsConfig = (path, appName) => {
6180
const filePath = `${path}/${appName}/tsconfig.json`;
6281
//running 'next dev' will autopopulate this with default values
63-
window.api.writeFile(filePath, '', err => {
82+
const data:string = `{
83+
"compileOnSave": false,
84+
"compilerOptions": {
85+
"target": "esnext",
86+
"module": "esnext",
87+
"jsx": "preserve",
88+
"allowJs": true,
89+
"moduleResolution": "node",
90+
"allowSyntheticDefaultImports": true,
91+
"noUnusedLocals": true,
92+
"noUnusedParameters": true,
93+
"removeComments": false,
94+
"preserveConstEnums": true,
95+
"sourceMap": true,
96+
"skipLibCheck": true,
97+
"baseUrl": ".",
98+
"lib": [
99+
"dom",
100+
"es2016"
101+
],
102+
"strict": false,
103+
"forceConsistentCasingInFileNames": true,
104+
"noEmit": true,
105+
"esModuleInterop": true,
106+
"resolveJsonModule": true,
107+
"isolatedModules": true
108+
},
109+
"include": [
110+
"next-env.d.ts",
111+
"**/*.ts",
112+
"**/*.tsx"
113+
],
114+
"exclude": [
115+
"node_modules"
116+
]
117+
}
118+
`;
119+
120+
121+
window.api.writeFile(filePath, data, err => {
64122
if (err) {
65123
console.log('TSConfig error:', err.message);
66124
} else {
@@ -139,20 +197,26 @@ async function createNextAppUtil({
139197
path,
140198
appName,
141199
components,
142-
rootComponents
200+
rootComponents,
201+
testchecked,
143202
}: {
144203
path: string;
145204
appName: string;
146205
components: Component[];
147206
rootComponents: number[];
207+
testchecked: boolean;
148208
}) {
149209
console.log('in the createNextApplication util');
150210

151211
await initFolders(path, appName);
152212
await createBaseTsx(path, appName);
153213
await createDefaultCSS(path, appName, components);
154-
await createPackage(path, appName);
214+
await createPackage(path, appName, testchecked);
155215
await createTsConfig(path, appName);
216+
if (testchecked) {
217+
console.log('testchecked: ',testchecked);
218+
await createTestSuiteNext({path, appName, components, rootComponents, testchecked});
219+
}
156220
await createNextFiles(components, path, appName, rootComponents);
157221

158222
}

‎app/src/utils/createTestSuite.util.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@
77
// }
88

99
const initFolders = (path: string, appName: string) => {
10-
console.log(window); // remember to delete
1110
let dir = path;
1211
dir = `${dir}/${appName}`;
1312
if (!window.api.existsSync(`${dir}/__mocks__`)) {

‎app/src/utils/createTestSuiteNext.util.ts‎

Lines changed: 218 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,218 @@
1+
2+
3+
const initFolders = (path: string, appName: string) => {
4+
let dir = path;
5+
dir = `${dir}/${appName}`;
6+
if (!window.api.existsSync(`${dir}/__mocks__`)) {
7+
window.api.mkdirSync(`${dir}/__mocks__`);
8+
}
9+
if (!window.api.existsSync(`${dir}/__tests__`)) {
10+
window.api.mkdirSync(`${dir}/__tests__`);
11+
}
12+
}
13+
14+
async function createJestConfigFile(path: String, appName: String){
15+
const filePath:string = `${path}/${appName}/jest.config.js`;
16+
const data:string = `
17+
module.exports = {
18+
moduleFileExtensions: [
19+
"ts",
20+
"tsx",
21+
"js"
22+
],
23+
transform: {
24+
"^.+\\.tsx?$": "ts-jest",
25+
"^.+\\.jsx?$": "<rootDir>/jest-preprocess.js",
26+
27+
},
28+
testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.([tj]sx?)$",
29+
globals: {
30+
"ts-jest": {
31+
babelConfig: true,
32+
tsconfig: "jest.tsconfig.json"
33+
}
34+
},
35+
coveragePathIgnorePatterns: [
36+
"/node_modules/",
37+
"enzyme.js"
38+
],
39+
setupFilesAfterEnv: ["<rootDir>/enzyme.js"],
40+
coverageReporters: [
41+
"json",
42+
"lcov",
43+
"text",
44+
"text-summary"
45+
],
46+
moduleNameMapper: {
47+
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/file-mock.js",
48+
"\\.(css|less|scss)$": "identity-obj-proxy"
49+
}
50+
}
51+
`;
52+
window.api.writeFile(filePath, data, err => {
53+
if (err) {
54+
console.log('createTestSuiteNext.util createJestConfigFile error:', err.message);
55+
} else {
56+
console.log('createTestSuitNext.util createJestConfigFile written successfully');
57+
}
58+
});
59+
};
60+
61+
async function createJestTsconfigJsonFile(path: String, appName: String){
62+
console.log('got in create jest tsconfig');
63+
const filePath:string = `${path}/${appName}/jest.tsconfig.json`;
64+
const data:string = `
65+
{
66+
"compilerOptions": {
67+
"module": "commonjs",
68+
"target": "esnext",
69+
"jsx": "react",
70+
"sourceMap": false,
71+
"experimentalDecorators": true,
72+
"noImplicitUseStrict": true,
73+
"moduleResolution": "node",
74+
"esModuleInterop": true,
75+
"allowSyntheticDefaultImports": true,
76+
"lib": [
77+
"es2017",
78+
"dom"
79+
],
80+
"typeRoots": [
81+
"node_modules/@types"
82+
]
83+
},
84+
"exclude": [
85+
"node_modules",
86+
"out",
87+
".next"
88+
]
89+
}
90+
`;
91+
console.log(data);
92+
window.api.writeFile(filePath, data, err => {
93+
if (err) {
94+
console.log('createTestSuiteNext.util createJestTsconfigJsonFile error:', err.message);
95+
} else {
96+
console.log('createTestSuitNext.util createJestTsconfigJsonFile written successfully');
97+
}
98+
});
99+
};
100+
101+
102+
async function createJestPreprocessFile(path: string, appName: string){
103+
const filePath: string = `${path}/${appName}/jest-preprocess.js`;
104+
const data:string = `
105+
const babelOptions = {
106+
presets: ["next/babel"],
107+
}
108+
109+
module.exports = require("babel-jest").default.createTransformer(babelOptions)`;
110+
111+
window.api.writeFile(filePath, data, err => {
112+
if (err) {
113+
console.log('createTestSuite.util createJestPreprocessFile error:', err.message);
114+
} else {
115+
console.log('createTestSuit.util createJestPreprocessFile written successfully');
116+
}
117+
});
118+
}
119+
120+
async function createEnzymeFile(path: string, appName: string){
121+
const filePath: string = `${path}/${appName}/enzyme.js`;
122+
const data:string = `const Adapter = require('enzyme-adapter-react-16');
123+
require('enzyme').configure({adapter: new Adapter()});`;
124+
125+
window.api.writeFile(filePath, data, err => {
126+
if (err) {
127+
console.log('createTestSuite.util createEnzymeFile error:', err.message);
128+
} else {
129+
console.log('createTestSuit.util createEnzymeFile written successfully');
130+
}
131+
});
132+
}
133+
134+
async function createComponentTests(path: string, appName: string, components: Component[]) {
135+
const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
136+
console.log(JSON.stringify(components))
137+
console.log(components);
138+
139+
let data:string = `
140+
import { shallow } from 'enzyme'
141+
import React from 'react';
142+
`;
143+
144+
components.forEach(page => {
145+
console.log(page);
146+
let importString = '';
147+
if (page.isPage) {
148+
importString = `
149+
import ${capitalize(page.name)} from "../pages/${page.name}";`;
150+
data = data + importString;
151+
} else {
152+
importString = `
153+
import ${capitalize(page.name)} from "../components/${page.name}";`;
154+
data = data + importString;
155+
}
156+
})
157+
158+
//let describe = `describe("${page.name}", () => {`
159+
components.forEach(page => {
160+
data = data + `
161+
162+
describe("${capitalize(page.name)}", () => {`
163+
164+
165+
data = data + `
166+
it('renders snapshots, too', () => {
167+
const wrapper = shallow(< ${capitalize(page.name)} />)
168+
expect(wrapper).toMatchSnapshot()
169+
})`
170+
171+
172+
data = data + `
173+
});`
174+
})
175+
176+
177+
178+
window.api.writeFile(filePath, data, err => {
179+
if (err) {
180+
console.log('createTestSuiteNext.util createComponentTests error:', err.message);
181+
} else {
182+
console.log('createTestSuitNext.util createComponentTests written successfully');
183+
}
184+
});
185+
}
186+
187+
const capitalize = (string: string) => {
188+
return string.charAt(0).toUpperCase() + string.slice(1);
189+
}
190+
191+
192+
async function createTestSuite({
193+
path,
194+
appName,
195+
components,
196+
rootComponents,
197+
testchecked,
198+
}: {
199+
path: string;
200+
appName: string;
201+
components: Component[];
202+
rootComponents: number[];
203+
testchecked: boolean;
204+
}) {
205+
console.log('in the createGatsbyApplication util');
206+
console.log('testchecked: ', testchecked);
207+
208+
await initFolders(path, appName);
209+
// await createMocksFiles(path, appName);
210+
// await createTestsFiles(path, appName);
211+
await createJestConfigFile(path, appName);
212+
await createJestTsconfigJsonFile(path, appName);
213+
await createJestPreprocessFile(path, appName);
214+
await createEnzymeFile(path, appName);
215+
await createComponentTests(path, appName, components);
216+
}
217+
218+
export default createTestSuite;

‎app/src/utils/exportProject.util.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const exportProject = (
2323
createFiles(components, path, appName, false);
2424
} // Create fully functional Next.js and Gatsby.js application files
2525
else if (genOption === 1 && projectType === 'Next.js') {
26-
createNextApp({ path, appName, components, rootComponents }).catch(err =>
26+
createNextApp({ path, appName, components, rootComponents, testchecked: tests }).catch(err =>
2727
console.log(err)
2828
);
2929
} else if (genOption === 1 && projectType === 'Gatsby.js') {

0 commit comments

Comments
 (0)