Migrate from Mocha/Sinon/Chai to Vitest

package.json

@@ -4,9 +4,7 @@
   "description": "Webpack Encore is a simpler way to integrate Webpack into your application",
   "main": "index.js",
   "scripts": {
-    "test": "yarn run test:main && yarn run test:persistent-cache",
-    "test:main": "mocha --reporter spec test --recursive --ignore test/persistent-cache/*",
-    "test:persistent-cache": "node run-persistent-tests",
+    "test": "vitest",
     "lint": "eslint lib test index.js .eslintrc.js --report-unused-disable-directives --max-warnings=0",
     "travis:lint": "yarn run lint"
   },
@@ -70,12 +68,12 @@
     "file-loader": "^6.0.0",
     "fork-ts-checker-webpack-plugin": "^7.0.0 || ^8.0.0 || ^9.0.0",
     "fs-extra": "^10.0.0",
+    "get-port": "^7.1.0",
     "handlebars": "^4.7.7",
     "handlebars-loader": "^1.7.0",
     "http-server": "^14.1.0",
     "less": "^4.0.0",
     "less-loader": "^11.0.0 || ^12.2.0",
-    "mocha": "^10.0.0",
     "postcss": "^8.3.0",
     "postcss-loader": "^7.0.0 || ^8.1.0",
     "preact": "^10.5.0",
@@ -85,14 +83,14 @@
     "react-dom": "^18.0.0",
     "sass": "^1.17.0",
     "sass-loader": "^16.0.1",
-    "sinon": "^14.0.0",
     "strip-ansi": "^6.0.0",
     "stylus": "^0.63.0",
     "stylus-loader": "^7.0.0 || ^8.1.0",
     "svelte": "^3.50.0 || ^4.2.2",
     "svelte-loader": "^3.1.0",
     "ts-loader": "^9.0.0",
     "typescript": "^5.0.0",
+    "vitest": "^3.0.6",
     "vue": "^3.2.14",
     "vue-loader": "^17.0.0",
     "webpack": "^5.72",

test/.eslintrc.js

@@ -10,6 +10,5 @@
 module.exports = {
     "env": {
         "node": true,
-        "mocha": true
     }
 };

test/WebpackConfig.js → test/WebpackConfig.test.js

@@ -9,7 +9,7 @@
 
 'use strict';
 
-const expect = require('chai').expect;
+import { describe, it, expect, beforeEach, afterEach } from 'vitest';
 const WebpackConfig = require('../lib/WebpackConfig');
 const RuntimeConfig = require('../lib/config/RuntimeConfig');
 const path = require('path');

test/bin/encore.js → test/bin/encore.test.js

@@ -9,22 +9,19 @@
 
 'use strict';
 
-const chai = require('chai');
+import { describe, it, expect, beforeEach, afterEach, chai } from 'vitest';
+import getPort from "get-port";
 chai.use(require('chai-fs'));
-const expect = chai.expect;
 const path = require('path');
 const testSetup = require('../helpers/setup');
 const fs = require('fs-extra');
+const { promisify } = require('util');
 const { exec, execSync, spawn } = require('child_process');
-
+const execAsync = promisify(exec);
 const projectDir = path.resolve(__dirname, '../', '../');
 
-describe('bin/encore.js', function() {
-    // being functional tests, these can take quite long
-    this.timeout(10000);
-
-    it('Basic smoke test', (done) => {
-        testSetup.emptyTmpDir();
+describe('bin/encore.js', { sequential: true, timeout: 10000 }, function() {
+    it('Basic smoke test', async () => {
         const testDir = testSetup.createTestAppDir();
 
         fs.writeFileSync(
@@ -52,23 +49,19 @@
         );
 
         const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
-        exec(`node ${binPath} dev --context=${testDir}`, { cwd: testDir }, (err, stdout, stderr) => {
-            if (err) {
-                throw new Error(`Error executing encore: ${err} ${stderr} ${stdout}`);
-            }
+        try {
+            const { stdout, stderr } = await execAsync(`node ${binPath} dev --context=${testDir}`, { cwd: testDir });
 
             expect(stdout).to.contain('Compiled successfully');
-
             expect(stdout).not.to.contain('Hash: ');
             expect(stdout).not.to.contain('Version: ');
             expect(stdout).not.to.contain('Time: ');
-
-            done();
-        });
+        } catch (err) {
+            throw new Error(`Error executing encore: ${err} ${err.stderr} ${err.stdout}`);
+        }
     });
 
-    it('Smoke test using the --json option', (done) => {
-        testSetup.emptyTmpDir();
+    it('Smoke test using the --json option', async () => {
         const testDir = testSetup.createTestAppDir();
 
         fs.writeFileSync(
@@ -87,10 +80,8 @@
         );
 
         const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
-        exec(`node ${binPath} dev --json --context=${testDir}`, { cwd: testDir }, (err, stdout, stderr) => {
-            if (err) {
-                throw new Error(`Error executing encore: ${err} ${stderr} ${stdout}`);
-            }
+        try {
+            const { stdout, stderr } = await execAsync(`node ${binPath} dev --json --context=${testDir}`, { cwd: testDir });
 
             let parsedOutput = null;
             try {
@@ -101,21 +92,18 @@
 
             expect(parsedOutput).to.be.an('object');
             expect(parsedOutput.modules).to.be.an('array');
-
             // We expect 4 modules there:
             // - webpack/runtime/chunk loaded
             // - webpack/runtime/jsonp chunk loading
             // - webpack/runtime/hasOwnProperty shorthand
             // - ./js/no_require.js
             expect(parsedOutput.modules.length).to.equal(4);
-
-
-            done();
-        });
+        } catch (err) {
+            throw new Error(`Error executing encore: ${err} ${err.stderr} ${err.stdout}`);
+        }
     });
 
-    it('Smoke test using the --profile option', (done) => {
-        testSetup.emptyTmpDir();
+    it('Smoke test using the --profile option', async () => {
         const testDir = testSetup.createTestAppDir();
 
         fs.writeFileSync(
@@ -134,22 +122,19 @@
         );
 
         const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
-        exec(`node ${binPath} dev --profile --context=${testDir}`, { cwd: testDir }, (err, stdout, stderr) => {
-            if (err) {
-                throw new Error(`Error executing encore: ${err} ${stderr} ${stdout}`);
-            }
+        try {
+            const { stdout, stderr } = await execAsync(`node ${binPath} dev --profile --context=${testDir}`, { cwd: testDir });
 
             expect(stdout).to.contain('resolving: ');
             expect(stdout).to.contain('restoring: ');
             expect(stdout).to.contain('integration: ');
             expect(stdout).to.contain('building: ');
-
-            done();
-        });
+        } catch (err) {
+            throw new Error(`Error executing encore: ${err} ${err.stderr} ${err.stdout}`);
+        }
     });
 
-    it('Smoke test using the --keep-public-path option', (done) => {
-        testSetup.emptyTmpDir();
+    it('Smoke test using the --keep-public-path option', async () => {
         const testDir = testSetup.createTestAppDir();
 
         fs.writeFileSync(
@@ -168,17 +153,14 @@
         );
 
         const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
-        exec(`node ${binPath} dev --keep-public-path --context=${testDir}`, { cwd: testDir }, (err, stdout, stderr) => {
-            if (err) {
-                throw new Error(`Error executing encore: ${err} ${stderr} ${stdout}`);
-            }
-
-            done();
-        });
+        try {
+            await execAsync(`node ${binPath} dev --keep-public-path --context=${testDir}`, { cwd: testDir });
+        } catch (err) {
+            throw new Error(`Error executing encore: ${err} ${err.stderr} ${err.stdout}`);
+        }
     });
 
-    it('Display an error when calling an unknown method', (done) => {
-        testSetup.emptyTmpDir();
+    it('Display an error when calling an unknown method', async () => {
         const testDir = testSetup.createTestAppDir();
 
         fs.writeFileSync(
@@ -207,17 +189,18 @@
         );
 
         const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
-        exec(`node ${binPath} dev --context=${testDir}`, { cwd: testDir }, (err, stdout, stderr) => {
+        try {
+            await execAsync(`node ${binPath} dev --context=${testDir}`, { cwd: testDir });
+            throw new Error('Expected command to fail.');
+        } catch (err) {
             expect(err).not.to.be.null;
-            expect(stdout).to.contain('is not a recognized property');
-            expect(stdout).to.contain('or method');
-            expect(stdout).to.contain('Did you mean');
-            done();
-        });
+            expect(err.stdout).to.contain('is not a recognized property');
+            expect(err.stdout).to.contain('or method');
+            expect(err.stdout).to.contain('Did you mean');
+        }
     });
 
-    it('Run the webpack-dev-server successfully', (done) => {
-        testSetup.emptyTmpDir();
+    it('Run the webpack-dev-server successfully', {timeout: 15000}, async () => {
         const testDir = testSetup.createTestAppDir();
 
         fs.writeFileSync(
@@ -246,57 +229,58 @@
 
         const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
         const abortController = new AbortController();
-        const node = spawn('node', [binPath, 'dev-server', `--context=${testDir}`], {
-            cwd: testDir,
-            env: Object.assign({}, process.env, { NO_COLOR: 'true' }),
-            signal: abortController.signal
-        });
-
-        let stdout = '';
-        let stderr = '';
-
-        node.stdout.on('data', (data) => {
-            stdout += data.toString();
-        });
-
-        node.stderr.on('data', (data) => {
-            stderr += data.toString();
-        });
-
-        node.on('error', (error) => {
-            if (error.name !== 'AbortError') {
-                throw new Error('Error executing encore', { cause: error });
-            }
+        const port = await getPort();
+        await new Promise(async (resolve, reject) => {
+            const node = spawn('node', [binPath, 'dev-server', `--context=${testDir}`, `--port=${port}`], {
+                cwd: testDir,
+                env: Object.assign({}, process.env, { NO_COLOR: 'true', FORCE_COLOR: 'false' }),
+                signal: abortController.signal
+            });
+
+            let stdout = '';
+            let stderr = '';
+
+            node.stdout.on('data', (data) => {
+                stdout += data.toString();
+            });
+
+            node.stderr.on('data', (data) => {
+                stderr += data.toString();
+            });
+
+            node.on('error', (error) => {
+                if (error.name !== 'AbortError') {
+                    reject(new Error('Error executing encore', { cause: error }));
+                }
 
-            expect(stdout).to.contain('Running webpack-dev-server ...');
-            expect(stdout).to.contain('Compiled successfully in');
-            expect(stdout).to.contain('webpack compiled successfully');
+                expect(stdout).to.contain('Running webpack-dev-server ...');
+                expect(stdout).to.contain('Compiled successfully in');
+                expect(stdout).to.contain('webpack compiled successfully');
 
-            expect(stderr).to.contain('[webpack-dev-server] Project is running at:');
-            expect(stderr).to.contain('[webpack-dev-server] Loopback: http://localhost:8080/');
-            expect(stderr).to.contain('[webpack-dev-server] Content not from webpack is served from');
+                expect(stderr).to.contain('[webpack-dev-server] Project is running at:');
+                expect(stderr).to.contain(`[webpack-dev-server] Loopback: http://localhost:${port}/`);
+                expect(stderr).to.contain('[webpack-dev-server] Content not from webpack is served from');
 
-            done();
-        });
+                resolve();
+            });
 
-        setTimeout(() => {
+            await new Promise(r => setTimeout(r, 9000));
             abortController.abort();
-        }, 5000);
+        })
     });
 
     describe('Without webpack-dev-server installed', () => {
-        before(() => {
+        beforeEach(() => {
             execSync('yarn remove webpack-dev-server --dev', { cwd: projectDir });
         });
 
-        after(() => {
+        afterEach(() => {
             // Re-install webpack-dev-server and ensure the project is in a clean state
-            execSync('git checkout package.json', { cwd: projectDir });
+            execSync('git checkout package.json yarn.lock', { cwd: projectDir });
             execSync('yarn install', { cwd: projectDir });
         });
 
-        it('Throw an error when trying to use the webpack-dev-server if not installed', done => {
-            testSetup.emptyTmpDir();
+        it('Throw an error when trying to use the webpack-dev-server if not installed', async () => {
             const testDir = testSetup.createTestAppDir();
 
             fs.writeFileSync(
@@ -324,23 +308,18 @@
             );
 
             const binPath = path.resolve(projectDir, 'bin', 'encore.js');
-            exec(
-                `node ${binPath} dev-server --context=${testDir}`,
-                {
-                    cwd: testDir,
-                    env: Object.assign({}, process.env, { NO_COLOR: 'true' })
-                },
-                (err, stdout, stderr) => {
-                    expect(stdout).to.contain('Install webpack-dev-server to use the webpack Development Server');
-                    expect(stdout).to.contain('npm install webpack-dev-server --save-dev');
-                    expect(stderr).to.equal('');
-
-                    expect(stdout).not.to.contain('Running webpack-dev-server ...');
-                    expect(stdout).not.to.contain('Compiled successfully in');
-                    expect(stdout).not.to.contain('webpack compiled successfully');
-
-                    done();
-                });
+             const { stdout, stderr } = await execAsync(`node ${binPath} dev-server --context=${testDir}`, {
+                cwd: testDir,
+                env: Object.assign({}, process.env, { NO_COLOR: 'true' })
+            });
+
+            expect(stdout).to.contain('Install webpack-dev-server to use the webpack Development Server');
+            expect(stdout).to.contain('npm install webpack-dev-server --save-dev');
+            expect(stderr).to.equal('');
+
+            expect(stdout).not.to.contain('Running webpack-dev-server ...');
+            expect(stdout).not.to.contain('Compiled successfully in');
+            expect(stdout).not.to.contain('webpack compiled successfully');
         });
     });
 });