changing mocha code to jest code and added files for jest environment

Author: ash-t-luu

jest.config.js

@@ -1,9 +1,13 @@
+const path = require('path');
+
 module.exports = {
     preset: 'ts-jest',
-    testEnvironment: 'node',
+    testEnvironment: './vscode-environment.js',
+    modulePaths: ['<rootDir>'],
     // Add other Jest configurations as needed
-    testMatch: ['**/test/**/*.js', '**/?(*.)+(spec|test).js'], // Match JavaScript files
+    // testMatch: ['**/test/**/*.js', '**/?(*.)+(spec|test).js'], // Match JavaScript files
     moduleNameMapper: {
-        '^@/(.*)$': 'build/src/$1', // Adjust this based on your project structure
+        // '^@/(.*)$': 'build/src/$1', // Adjust this based on your project structure
+        vscode: path.join(__dirname, 'vscode.js')  // <----- most important line
     },
 };

package-lock.json

@@ -70,15 +70,14 @@
   "scripts": {
     "lint": "eslint .",
     "pretest": "npm run lint",
-    "test": "jest",
+    "test": "node build/src/test/runTest.js",
     "dev": "webpack --watch",
     "webpack": "webpack"
   },
   "devDependencies": {
     "@babel/preset-typescript": "^7.23.3",
     "@types/glob": "^8.1.0",
     "@types/jest": "^29.5.11",
-    "@types/mocha": "^10.0.3",
     "@types/node": "18.x",
     "@types/react": "^18.2.45",
     "@types/react-dom": "^18.2.18",
@@ -88,7 +87,7 @@
     "eslint": "^8.54.0",
     "glob": "^10.3.10",
     "jest": "^29.7.0",
-    "mocha": "^10.2.0",
+    "jest-environment-node": "^29.7.0",
     "postcss-loader": "^7.3.3",
     "postcss-preset-env": "^9.3.0",
     "tailwindcss": "^3.3.6",

package.json

@@ -1,5 +1,4 @@
 import * as path from 'path';
-
 import { runTests } from '@vscode/test-electron';
 
 async function main() {
@@ -19,7 +18,11 @@ async function main() {
 		console.log('inside try block after second var declare');
 
 		// Download VS Code, unzip it and run the integration test
-		await runTests({ extensionDevelopmentPath, extensionTestsPath });
+		await runTests({ 
+			version: '1.85.1', 
+			extensionDevelopmentPath, 
+			extensionTestsPath
+		});
 	} catch (err) {
 		console.error('Failed to run tests', err);
 		process.exit(1);

src/test/runTest.ts

@@ -1,16 +1,18 @@
-import * as assert from 'assert'
-
 // You can import and use all API from the 'vscode' module
 // as well as import your extension to test it
 import * as vscode from 'vscode'
 // const myExtension = require('../extension');
 
-suite('Extension Test Suite', () => {
-	vscode.window.showInformationMessage('Start all tests.');
+// we can either use test() or it() -- matter of style for team/project convention
+
+describe('Extension Test Suite', () => {
+	beforeEach(() => {
+		vscode.window.showInformationMessage('Start all tests.');
+	});
 
-	test('Sample test', () => {
-		assert.strictEqual(-1, [1, 2, 3].indexOf(5)); // false
-		assert.strictEqual(-1, [1, 2, 3].indexOf(0));
-		assert.strictEqual(0, [1, 2, 3].indexOf(1)); // true
+	it('Sample test', () => {
+		expect([1, 2, 3].indexOf(5)).toBe(-1);
+		expect([1, 2, 3].indexOf(0)).toBe(-1);
+		expect([1, 2, 3].indexOf(1)).toBe(0);
 	});
 });

src/test/suite/extension.test.ts

@@ -1,5 +1,4 @@
 import * as path from 'path';
-// import * as Mocha from 'mocha';
 import { glob } from 'glob';
 
 // export async function run(): Promise<void> {
@@ -34,14 +33,26 @@ import { glob } from 'glob';
 import * as jest from 'jest';
 
 export async function run(): Promise<void> {
-	const testsRoot = path.resolve(__dirname, '..');
-	const files = await glob('**/**.test.js', { cwd: testsRoot });
-
 	try {
+		console.log('inside try block of index.ts');
+
+		const testsRoot = path.resolve(__dirname, '..');
+		const files = await glob('**/**.test.js', { cwd: testsRoot });
+	
+		if (files.length === 0) {
+			console.warn('No test files found');
+			return;
+		}
+
+		console.log('test files: ', files);
+
 		return new Promise(async (c, e) => {
 			try {
-				await jest.run();
+				console.log('inside promise block of index.ts before await ')
+				await jest.run([...files]);
+				console.log('inside promise block of index.ts after await')
 				c();
+				console.log('inside promise block of index.ts after c()')
 			} catch (err) {
 				console.error(err);
 				e(err);

src/test/suite/index.ts

@@ -0,0 +1,72 @@
+// import * as assert from 'assert' -- this one is from node
+import { Parser } from '../../parser';
+import * as path from 'path';
+import { beforeEach, expect, test } from '@jest/globals'; 
+
+// You can import and use all API from the 'vscode' module
+// as well as import your extension to test it
+import * as vscode from 'vscode'
+// const myExtension = require('../extension');
+
+describe('Parser Test Suite', () => {
+	beforeEach(() => {
+        vscode.window.showInformationMessage('Start all tests.');
+    });
+
+    let parser, tree, file;
+
+	// UNPARSED TREE TEST
+    describe('It initializes correctly', () => {
+        beforeEach(() => {
+            // declare var and assign it to a test file and make new instance of Parser
+            // both of the paths below work
+            // file = path.join(__dirname, '../test_cases/tc_0/index.js');
+            file = path.join(__dirname, '../../../src/test/test_apps/test_0/index.js');
+            parser = new Parser(file);
+        });
+
+        test('It instantiates an object for the parser class', () => {
+            expect((parser)).toBeInstanceOf(Parser);
+            // assert.typeOf(parser, 'object', 'Value of new instance should be an object');
+            // expect(parser).to.be.an('object');
+        });
+
+        test('It begins with a suitable entry file and a tree that is not yet defined', () => {
+            expect(parser.entryFile).toEqual(file);
+            expect(tree).toBeUndefined();
+            // below is my code
+            // assert.strictEqual(parser.entryFile, file, 'These files are strictly equal');
+            // assert.isUndefined(tree, 'Tree is defined');
+        });
+    });
+
+    // TEST ?: UNPARSED TREE TEST FOR REACT 18(createRoot)
+
+	// TEST 0: ONE CHILD
+    // describe('It works for simple apps', () => {
+    //     before(() => {
+    //         file = path.join(__dirname, '');
+    //         parser = new Parser(file);
+    //         tree = parser.parse();
+    //     });
+
+    //     test('It returns an defined object tree when parsed', () => {
+    //         assert.typeOf(tree, 'object', 'Value of parse() on new instance should be an object');
+    //     });
+    // });
+
+    // TEST 0.5: CHECK IF COMPONENT IS CLIENT OR SERVER (USING HOOKS) => RENDERS A CERTAIN COLOR
+	// TEST 1: NESTED CHILDREN
+	// TEST 2: THIRD PARTY, REACT ROUTER, DESTRUCTURED IMPORTS
+	// TEST 3: IDENTIFIES REDUX STORE CONNECTION
+	// TEST 4: ALIASED IMPORTS
+	// TEST 5: MISSING EXTENSIONS AND UNUSED IMPORTS
+	// TEST 6: BAD IMPORT OF APP2 FROM APP1 COMPONENT
+	// TEST 7: SYNTAX ERROR IN APP FILE CAUSES PARSER ERROR
+	// TEST 8: MULTIPLE PROPS ON ONE COMPONENT
+	// TEST 9: FINDING DIFFERENT PROPS ACROSS TWO OR MORE IDENTICAL COMPONENTS
+	// TEST 10: CHECK CHILDREN WORKS AND COMPONENTS WORK
+	// TEST 11: PARSER DOESN'T BREAK UPON RECURSIVE COMPONENTS
+	// TEST 12: NEXT.JS APPS (pages & app router)
+  	// TEST 13: Variable Declaration Imports and React.lazy Imports
+});

src/test/suite/parser.test.ts

@@ -0,0 +1,6 @@
+// import React from "react";
+export default function App() {
+    return (
+        <div>This is the App.</div>
+    )
+}

src/test/test_cases/tc_0/component/App.jsx

@@ -0,0 +1,15 @@
+// what we are building to test for 
+// we will point to index.js and call new instance of parser passing in file
+
+// expecting: 
+// if the value of new instance is an obj
+// tree is undefined with a proper file
+
+// test case 0 - simple react app with one app component
+
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import App from './components/App.jsx';
+
+const root = createRoot(document.getElementById('root'));
+root.render(<App />);

src/test/test_cases/tc_0/index.js

@@ -12,11 +12,14 @@
       "strict": false,
       "inlineSources": true,
     },
+    "jest": {
+      "tsconfig": "tsconfig.json"
+    },
     "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/**/*.tsx", "src/**/**/*.ts"],
     "exclude": [
       "node_modules",
       ".vscode-test",
       "src/webviews",
-      "src/test/test_apps"
+      "node_modules/@types/mocha/index.d.ts"
     ]
 }