Skip to content

Commit fe70345

Browse files
authored
Merge pull request #2 from oslabs-beta/minzo-jest-and-package-config
Minzo jest and package config
2 parents 48a9265 + 543affc commit fe70345

File tree

9 files changed

+50
-35
lines changed

9 files changed

+50
-35
lines changed

.babelrc

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
{
2-
"presets": [
3-
"airbnb"
4-
],
2+
"presets": ["airbnb", "@babel/preset-typescript"],
53
"plugins": ["@emotion"]
64
}

.eslintrc

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,12 @@
33
"airbnb",
44
"plugin:jest/recommended",
55
"plugin:@typescript-eslint/eslint-recommended",
6-
"plugin:@typescript-eslint/recommended"
6+
"plugin:@typescript-eslint/recommended",
7+
"plugin:testing-library/react", // added in for RTL tests
8+
"plugin:jest-dom/recommended" // added in for RTL tests
79
],
810
"root": true,
9-
"plugins": ["jest", "react", "react-hooks", "@typescript-eslint"],
11+
"plugins": ["jest", "react", "react-hooks", "@typescript-eslint", "testing-library", "jest-dom"],
1012
"rules": {
1113
"arrow-parens": [2, "as-needed"],
1214
"import/no-unresolved": "off",

demo-app/src/client/Components/Buttons.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import Increment from './Increment';
33

4-
function Buttons():JSX.Element {
4+
function Buttons(): JSX.Element {
55
const buttons = [];
66
for (let i = 0; i < 4; i++) {
77
buttons.push(<Increment key={i} />);
@@ -20,4 +20,3 @@ function Buttons():JSX.Element {
2020
}
2121

2222
export default Buttons;
23-

jest.config.js

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
const { TextEncoder } = require('util');
2+
module.exports = {
3+
globals: {
4+
TextEncoder: TextEncoder,
5+
},
6+
transform: {
7+
'^.+\\.(js|ts|tsx)$': 'ts-jest',
8+
},
9+
testPathIgnorePatterns: ['www', './src/backend/__tests__/ignore'],
10+
coveragePathIgnorePatterns: ['/src/backend/__tests__/ignore/'],
11+
transformIgnorePatterns: ['/node_modules/(?!d3|d3-array|internmap|delaunator|robust-predicates)'],
12+
testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$',
13+
moduleFileExtensions: ['ts', 'tsx', 'js'],
14+
setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
15+
testEnvironment: 'jsdom',
16+
moduleNameMapper: {
17+
'\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
18+
'<rootDir>/__mocks__/fileMock.js',
19+
'\\.(scss|sass|css)$': 'identity-obj-proxy',
20+
},
21+
};

package.json

Lines changed: 11 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,16 @@
11
{
22
"name": "reactime",
33
"description": "build web extension bundle.js",
4-
"jest": {
5-
"transform": {
6-
"^.+\\.(js|ts|tsx)$": "ts-jest"
7-
},
8-
"testPathIgnorePatterns": [
9-
"www",
10-
"./src/backend/__tests__/ignore"
11-
],
12-
"coveragePathIgnorePatterns": [
13-
"/src/backend/__tests__/ignore/"
14-
],
15-
"transformIgnorePatterns": [
16-
"/node_modules/(?!d3|d3-array|internmap|delaunator|robust-predicates)"
17-
],
18-
"testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
19-
"moduleFileExtensions": [
20-
"ts",
21-
"tsx",
22-
"js"
23-
]
24-
},
254
"scripts": {
265
"build": "NODE_OPTIONS=--openssl-legacy-provider webpack --mode production",
276
"dev": "NODE_OPTIONS=--openssl-legacy-provider webpack --mode development --watch",
287
"buildlegacy": "webpack --mode production",
298
"devlegacy": "webpack --mode development --watch",
309
"test": "jest --verbose --coverage",
3110
"test-backend": "jest --verbose --coverage src/backend",
11+
"test-frontend": "jest --verbose --coverage src/app",
12+
"test-newfront": "jest --verbose --coverage src/app/__tests__new",
13+
"test-zo": "jest --verbose --coverage src/app/__tests__zo",
3214
"test-on": "./node_modules/.bin/jest $1",
3315
"docker-test-lint": "eslint --ext .js --ext .jsx src",
3416
"docs": "typedoc --json docs --inputFiles src/app --inputFiles src/backend --readme docs/readme.md",
@@ -110,9 +92,12 @@
11092
"@babel/plugin-proposal-decorators": "^7.10.5",
11193
"@babel/preset-env": "^7.12.7",
11294
"@babel/preset-react": "^7.12.7",
95+
"@babel/preset-typescript": "^7.21.5",
11396
"@emotion/babel-plugin": "^11.7.2",
97+
"@inrupt/jest-jsdom-polyfills": "^1.6.2",
11498
"@testing-library/jest-dom": "^4.2.4",
11599
"@testing-library/react": "^13.4.0",
100+
"@testing-library/user-event": "^14.4.3",
116101
"@types/chai": "^4.2.14",
117102
"@types/chrome": "^0.0.119",
118103
"@types/d3": "^7.4.0",
@@ -134,15 +119,19 @@
134119
"eslint-config-airbnb": "^18.2.0",
135120
"eslint-plugin-import": "^2.22.0",
136121
"eslint-plugin-jest": "^22.21.0",
122+
"eslint-plugin-jest-dom": "^4.0.3",
137123
"eslint-plugin-jsx-a11y": "^6.3.1",
138124
"eslint-plugin-react": "^7.20.3",
139125
"eslint-plugin-react-hooks": "^1.7.0",
126+
"eslint-plugin-testing-library": "^5.10.3",
140127
"express": "^4.17.1",
141128
"jest": "^29.5.0",
142129
"jest-cli": "^26.1.0",
143130
"jest-diff": "^26.1.0",
131+
"jest-environment-jsdom": "^29.5.0",
144132
"jest-runner-eslint": "^2.0.0",
145133
"jscharting-react": "^1.2.1",
134+
"jsdom": "^21.1.2",
146135
"prettier": "2.8.4",
147136
"puppeteer": "^14.3.0",
148137
"react-devtools-core": "^4.27.3",
@@ -195,12 +184,12 @@
195184
"d3-scale-chromatic": "^3.0.0",
196185
"d3-shape": "^2.0.0",
197186
"d3-zoom": "^3.0.0",
187+
"identity-obj-proxy": "^3.0.0",
198188
"immer": "^9.0.12",
199189
"intro.js": "^5.0.0",
200190
"intro.js-react": "^0.6.0",
201191
"jest-runner": "^26.1.0",
202192
"jscharting": "^3.0.2",
203-
"jsdom": "^21.1.1",
204193
"jsondiffpatch": "^0.3.11",
205194
"lodash": "^4.17.21",
206195
"prop-types": "^15.7.2",

src/backend/controllers/createTree.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,8 @@ export default function createTree(currentFiberNode: Fiber): Tree {
154154
// // if user uses useContext hook, context data will be stored in memoizedProps.value of the Context.Provider component => grab context object stored in memoizedprops
155155
// // Different from other provider, such as Routes, BrowswerRouter, ReactRedux, ..., Context.Provider does not have a displayName
156156
// // TODO: need to render this context provider when user use useContext hook.
157+
//
158+
//
157159
// if (tag === ContextProvider && !elementType._context.displayName) {
158160
// let stateData = memoizedProps.value;
159161
// if (stateData === null || typeof stateData !== 'object') {
@@ -193,6 +195,7 @@ export default function createTree(currentFiberNode: Fiber): Tree {
193195
const hooksStates = getHooksStateAndUpdateMethod(memoizedState);
194196
// Obtain variable names by parsing the function definition stored in elementType.
195197
const hooksNames = getHooksNames(elementType.toString());
198+
196199
// Intialize state & index:
197200
componentData.hooksState = {};
198201
componentData.hooksIndex = [];
@@ -257,6 +260,7 @@ export default function createTree(currentFiberNode: Fiber): Tree {
257260
}
258261

259262
// ------------RETURN THE TREE OUTPUT & PASS TO FRONTEND FOR RENDERING------
263+
260264
return tree;
261265
}
262266
}

src/backend/controllers/statePropExtractors.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -115,23 +115,23 @@ export function getHooksNames(elementType: string): { hookName: string; varName:
115115
// Due to difference in babel transpilation in browser vs for jest test, expression is stored in differen location
116116
const expression =
117117
declarations[0]?.init?.callee?.expressions || //work for browser
118-
declarations[0]?.init?.arguments?.[0]?.callee?.expressions; //work for jest test;
118+
declarations[0]?.init?.arguments?.[0]?.callee?.expressions; //work for jest test;
119119
// A functional declaration within a component that isn't a hook won't have the callee being searched for above. This line will cause this forEach execution to stop here in this case.
120-
if (expression === undefined) return;
120+
if (expression === undefined) return;
121121
let reactHook: string;
122122
reactHook = expression[1].property?.name;
123123
if (reactHook === 'useState') {
124124
// Obtain the variable being set:
125125
let varName: string =
126126
// Points to second to last element of declarations because webpack adds an extra variable when converting files that use ES6
127-
declarations[declarations.length - 2]?.id?.name || // work react application;
127+
declarations[declarations.length - 2]?.id?.name || // work react application;
128128
(Array.isArray(declarations[0]?.id?.elements)
129129
? declarations[0]?.id?.elements[0]?.name
130130
: undefined); //work for nextJS application
131131
// Obtain the setState method:
132132
let hookName: string =
133133
//Points to last element of declarations because webpack adds an extra variable when converting files that use ES6
134-
declarations[declarations.length - 1]?.id?.name || // work react application;
134+
declarations[declarations.length - 1]?.id?.name || // work react application;
135135
(Array.isArray(declarations[0]?.id?.elements)
136136
? declarations[0]?.id?.elements[0]?.name
137137
: undefined); //work for nextJS & Remix

src/backend/routers/linkFiber.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,7 @@ export default function linkFiber(mode: Status): () => Promise<void> {
127127
return function (...args: Parameters<typeof onCommitFiberRoot>) {
128128
// Obtain the updated FiberRootNode, after the target React application re-renders
129129
const fiberRoot = args[1];
130+
130131
// If the target React application is visible, send a request to update the snapShot tree displayed on Chrome Extension
131132
if (isVisible) throttledUpdateSnapshot(fiberRoot, mode);
132133
// After our added work is completed we invoke the original onComitFiberRoot function

tsconfig.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,8 @@
1919
"types": ["chrome", "jest", "node"],
2020

2121
// ---------------------------------TYPE CHECKING---------------------------
22-
// "strict": true, /* Enable all strict type-checking options. */
23-
// "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */
22+
// "strict": true, /* Enable all strict type-checking options. */
23+
// "noImplicitAny": true /* Enable error reporting for expressions and declarations with an implied 'any' type. */,
2424
// "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */
2525
// "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
2626
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
@@ -75,6 +75,7 @@
7575
"exclude": [
7676
"./src/app/__tests__",
7777
"./src/backend/__tests__",
78+
"./src/app/__tests__new",
7879
"node_modules",
7980
"./src/extension/build/bundles"
8081
],

0 commit comments

Comments
 (0)