Is it possible to e2e test a Tauri app?

[marcelsby]

I've read the testing docs, but i continue struggling to e2e test my Tauri app.

After reading the docs i've understood that i can use automations like Selenium or Webdriver IO to run my tests, but the provided example is too simple, it does not even touch the Tauri API usage, i know that i can mock this component, but if i want to really e2e test my application the ideal scenery will be if it run like a real Tauri app (the WebView and Rust backend with the IPC doing the bridge between the two).

I've searched a lot but don't found any examples on doing this, do you have any examples or ideas on how to get this done?

If it's not possible then i will have to test my Rust backend Commands and my JS frontend parts separately, doing unit-tests like in each end of my Tauri app?

This is the app that i'm currently working on:

A example of test that i might want to do is: when i click in the select file button, the system file picker opens to select the file and after the selection, the selected file path is shown in the disabled input that lays at the left of select file button. But if i mock this file picking action (that is being handled by Tauri dialog API), how can i grant that my application is really working?

[stoplion]

Did you ever figure it out?

[nooblyf]

i would like to know this as well

[dimitryzub]

Bump

[dimitryzub]

Bump

After my initial response, i managed to make it worked. You need to align to your own UI framework and potential other things.

Important

Sharing as is. At the moment of writing this I forgot how i came up with some things (a lot of back and forth) so I don't share explanation or logic behind. It was pain in a ass. You can throw this code snippets to LLM to better understand how it works.

Step 1: Download msedgedriver.exe

Download link: https://msedgewebdriverstorage.z22.web.core.windows.net/ (i dont remember which version i have. 102 or 103.)

Step 2: Stay strong reading all of this below

Folder structure

e2e/
|-- setup/
|   +-- test-assets/
|   |   |-- gltf_clear_coat_car_paint_test/
|   |   |   |-- ClearCoatCarPaint.bin
|   |   |   |-- ClearCoatCarPaint.gltf
|   |   |   |-- ClearCoatCarPaint_Normal.png
|   |   |   +-- screenshot_large.jpg
|   |   |-- gltf_pegion_small_test/
|   |   |   |-- textures/
|   |   |   |   +-- Material.001_baseColor.png
|   |   |   |-- Material_001_baseColor.png
|   |   |   |-- license.txt
|   |   |   |-- scene.bin
|   |   |   +-- scene.gltf
|   |   |-- obj_autumn_sword_test/
|   |   |   |-- source/
|   |   |   |   +-- sword.obj
|   |   |   +-- textures/
|   |   |   |   |-- all.001_Base_color.png
|   |   |   |   |-- all.001_Emissive.png
|   |   |   |   |-- all.001_Metallic.png
|   |   |   |   |-- all.001_Mixed_AO.png
|   |   |   |   |-- all.001_Normal_OpenGL.png
|   |   |   |   +-- all.001_Roughness.png
|   |   |-- obj_friend_forever_portal_2_test/
|   |   |   |-- source/
|   |   |   |   |-- Portal_FInal.mtl
|   |   |   |   +-- Portal_FInal.obj
|   |   |   +-- textures/
|   |   |   |   |-- Portal1.png
|   |   |   |   +-- Portal_Main.jpg
|   |   |-- obj_male_test/
|   |   |   |-- 01_-_Default1noCulling.JPG
|   |   |   |-- male-02-1noCulling.JPG
|   |   |   |-- male02.mtl
|   |   |   |-- male02.obj
|   |   |   +-- orig_02_-_Defaul1noCulling.JPG
|   |   |-- ray_gun/
|   |   |   |-- textures/
|   |   |   |   |-- Etali_baseColor.png
|   |   |   |   |-- Etali_emissive.png
|   |   |   |   |-- Etali_metallicRoughness.png
|   |   |   |   |-- Etali_normal.png
|   |   |   |   |-- pasted__blinn1_baseColor.png
|   |   |   |   |-- pasted__blinn1_clearcoat_normal.png
|   |   |   |   +-- pasted__blinn1_metallicRoughness.png
|   |   |   |-- license.txt
|   |   |   |-- scene.bin
|   |   |   +-- scene.gltf
|   |   |-- README.md
|   |   |-- ascii_cube_test.stl
|   |   |-- binary_cube_test.stl
|   |   |-- cali_bee_test.stl
|   |   |-- dolphins_be.ply
|   |   |-- pigeon_test.glb
|   |   +-- toy_car_test.glb
|-- specs/
|   |-- 01-vault-setup.spec.cjs
|   |-- 02-asset-lifecycle.spec.cjs
|   |-- 03-populated-vault.spec.cjs
|   |-- 04-navigation.spec.cjs
|   |-- 05-viewer-gui.spec.cjs
|   +-- 06-version-control.spec.cjs
|-- utils/
|   +-- assetModifier.cjs
|-- webdriverio/
|   |-- drivers/
|   |   +-- msedgedriver.exe
|   |-- node_modules/
|   |-- .dev-server.pid
|   |-- check_lingering_drivers.js
|   |-- package.json
|   |-- post-test-teardown.js
|   |-- pre-test-setup.empty.js
|   |-- run-test-wrapper.js
|   +-- wdio.conf.js
+-- README.md

root/package.json:

{
  "name": ".....",
  "version": "0.1.0",
  "description": "",
  "type": "module",
  "scripts": {
    "dev": "vite dev",
    "build": "vite build",
    "preview": "vite preview",
    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
    "kill-port": "node -e \"const { exec } = require('child_process'); const port = 1420; const isWin = process.platform === 'win32'; const cmd = isWin ? `for /f \\\"tokens=5\\\" %a in ('netstat -nao ^| findstr :${port}') do taskkill /PID %a /F` : `lsof -ti :${port} | xargs kill -9`; exec(cmd, (e) => { if (e) console.error('No process to kill or error:', e.message); else console.log('✅ Port', port, 'freed.'); });\"",
    "tauri": "pnpm run kill-port && tauri",
    "test:unit": "vitest run",
    "test:unit:watch": "vitest",
    "test:unit:coverage": "vitest run --coverage",
    "test:e2e": "pnpm --filter .......-e2e-tests test:clean",
    "test:tauri:backend": "cd src-tauri && cargo test",
    "test:tauri:backend:coverage": "cd src-tauri && cargo tarpaulin --out Html --output-dir coverage_report && echo 'Backend coverage report generated in src-tauri/coverage_report/tarpaulin-report.html/index.html'",
    "test:all": "pnpm run test:unit && pnpm run test:tauri:backend && pnpm run test:e2e && echo All tests passed ✅✅✅"
  },
  "license": "MIT",
  "dependencies": {
    "@tauri-apps/api": "^2",
    "@tauri-apps/plugin-dialog": "~2",
    "@tauri-apps/plugin-fs": "~2.2.1",
    "@tauri-apps/plugin-opener": "^2",
    "@tauri-apps/plugin-store": "~2",
    "lucide-svelte": "^0.511.0",
    "three": "^0.176.0",
    "zod": "^3.25.23"
  },
  "devDependencies": {
    "@lucide/svelte": "^0.482.0",
    "@sveltejs/adapter-static": "^3.0.6",
    "@sveltejs/kit": "^2.9.0",
    "@sveltejs/vite-plugin-svelte": "^5.0.0",
    "@tailwindcss/forms": "^0.5.10",
    "@tailwindcss/typography": "^0.5.16",
    "@tauri-apps/cli": "^2",
    "@testing-library/jest-dom": "^6.6.3",
    "@testing-library/svelte": "^5.2.8",
    "@testing-library/user-event": "^14.6.1",
    "@types/three": "^0.176.0",
    "@vitest/coverage-v8": "3.2.2",
    "autoprefixer": "^10.4.20",
    "bits-ui": "^1.5.0",
    "clsx": "^2.1.1",
    "jsdom": "^26.1.0",
    "postcss": "^8.5.3",
    "svelte": "^5.0.0",
    "svelte-check": "^4.0.0",
    "tailwind-merge": "^3.3.0",
    "tailwind-variants": "^0.2.1",
    "tailwindcss": "^3.4.17",
    "tailwindcss-animate": "^1.0.7",
    "typescript": "~5.6.2",
    "vite": "^6.0.3",
    "vitest": "^3.2.2",
    "wdio-devtools-service": "^0.1.6"
  }
}

e2e/package.json

{
 "name": "....",
 "version": "1.0.0",
 "private": true,
 "scripts": {
   "test": "wdio run wdio.conf.js",
   "test:clean": "node run-test-wrapper.js"
 },
 "devDependencies": {
   "@tauri-apps/api": "^2",
   "@wdio/cli": "^8.38.2",
   "@wdio/local-runner": "^8.38.2",
   "@wdio/mocha-framework": "^8.38.2",
   "@wdio/spec-reporter": "^8.38.2",
   "chai": "^5.2.0",
   "wait-on": "^8.0.3",
   "wdio-edgedriver-service": "^3.0.3"
 }
}

// test/e2e/webdriverio/wdio.conf.js
const os = require('node:os');
const path = require('node:path');
const fs = require('node:fs');
const { spawn } = require('node:child_process');

// To hold the tauri-driver process
let tauriDriverProcess;

// --- Configuration ---
const projectRoot = path.resolve(__dirname, '..', '..', '..');
const appName = '....';

// --- WebdriverIO Configuration ---
exports.config = {
    port: 4444,
    specs: [
        '../specs/01-vault-setup.spec.cjs',
        '../specs/02-asset-lifecycle.spec.cjs',
        '../specs/03-populated-vault.spec.cjs',
        '../specs/04-navigation.spec.cjs',
        '../specs/05-viewer-gui.spec.cjs',
        '../specs/06-version-control.spec.cjs'
    ],
    maxInstances: 1,
    capabilities: [
        {
            maxInstances: 1,
            browserName: 'MicrosoftEdge',
            'tauri:options': {
                application: path.join(projectRoot, 'src-tauri', 'target', 'debug', process.platform === 'win32' ? `${appName}.exe` : appName),
            },
            'ms:edgeOptions': {
              'wdio:devtoolsOptions': {
                'perfLoggingPrefs': {
                    'enableNetwork': false,
                    'enablePage': false,
                    'traceCategories': 'browser,devtools.timeline,devtools',
                },
              },
            },
        },
    ],
    logLevel: 'warn', // Keep as 'info' or 'debug' to see detailed WDIO logs
    reporters: ['spec'],
    framework: 'mocha',
    mochaOpts: {
        ui: 'bdd',
        timeout: 600000,
    },

    onPrepare: function() {},

    beforeSession: function () {
        console.log('Starting tauri-driver...');
        const driverPath = path.resolve(os.homedir(), '.cargo', 'bin', 'tauri-driver');
        if (!fs.existsSync(driverPath) && !fs.existsSync(driverPath + '.exe')) {
            throw new Error('tauri-driver not found. Please run `cargo install tauri-driver --locked` and ensure ~/.cargo/bin is in your PATH.');
        }
        tauriDriverProcess = spawn(driverPath, [], { stdio: 'pipe', shell: false });
        
        const currentLogLevel = this.logLevel || 'info';
        if (['info', 'debug', 'trace'].includes(currentLogLevel)) {
            tauriDriverProcess.stdout.on('data', (data) => console.log(`[tauri-driver]: ${data.toString().trim()}`));
            tauriDriverProcess.stderr.on('data', (data) => console.error(`[tauri-driver ERROR]: ${data.toString().trim()}`));
        }
    },

    afterSession: function () {
        console.log('Stopping tauri-driver...');
        if (tauriDriverProcess) {
            tauriDriverProcess.kill();
        }
    },

    beforeTest: async function (test, context) {
       console.log(`\n[TEST STARTING] ${test.parent}: ${test.title}`);
       await browser.waitUntil(
           async () => (await browser.getWindowHandles()).length > 0,
           {
               timeout: 30000,
               timeoutMsg: 'Expected app window to be available'
           }
       );
       const handles = await browser.getWindowHandles();
       if (handles[0]) {
         await browser.switchToWindow(handles[0]);
       }
       await browser.waitUntil(
           async () => await browser.execute(() => document.readyState === 'complete'),
           {
               timeout: 10000,
               timeoutMsg: 'Expected document to be ready'
           }
       );
       await browser.pause(500);
    },

    afterTest: async function(test, context, { error, result, duration, passed, retries }) {
        // Attempt to get browser logs. This might require specific driver capabilities.
        // For Edge, `ms:edgeOptions` with specific logging arguments might be needed if this doesn't work.
        if (browser && typeof browser.getLogs === 'function') {
            try {
                // Common log types: 'browser', 'driver', 'performance'
                const logTypes = await browser.getLogTypes();
                // console.log('Available log types:', logTypes); // See what's available

                if (logTypes.includes('browser')) {
                    const browserLogs = await browser.getLogs('browser');
                    if (browserLogs && browserLogs.length > 0) {
                        console.log(`\n--- Browser Console Logs for "${test.title}" ---`);
                        browserLogs.forEach(log => {
                            const message = log.message.replace(/\\n/g, '\n    ');
                            console.log(`[${log.level || 'UNKNOWN'}] ${new Date(log.timestamp).toISOString()} - ${message}`);
                        });
                        console.log('-----------------------------------------------\n');
                    }
                } else {
                    // console.log('Browser log type not available. Check driver capabilities.');
                }
            } catch (e) {
                console.warn(`Could not retrieve browser logs for type 'browser':`, e.message);
            }
        } else {
            console.log('browser.getLogs is not available in this context.');
        }
    },
};

Without this file, it breaks.

// tests\e2e\webdriverio\check_lingering_drivers.js
const { exec } = require('child_process');

const processesToCheck = [
    { name: 'msedgedriver.exe', displayName: 'msedgedriver.exe' }, // Windows
    { name: 'msedgedriver', displayName: 'msedgedriver (Linux/macOS)' }, // Linux/macOS
];

let lingeringProcessesFound = false;

function checkProcess(procInfo) {
    return new Promise((resolve) => {
        const command = process.platform === 'win32'
            ? `tasklist /FI "IMAGENAME eq ${procInfo.name}" /NH`
            : `pgrep -fl "${procInfo.name}"`; // pgrep is common on Linux/macOS

        exec(command, (error, stdout, stderr) => {
            if (error && process.platform !== 'win32') { // On Linux/macOS, pgrep exits with 1 if not found
                // console.log(`No lingering ${procInfo.displayName} found.`);
                resolve(false);
                return;
            }
            if (stderr && !stderr.toLowerCase().includes('no tasks are running') && !stderr.toLowerCase().includes('info: no tasks running')) { // For Windows tasklist error when no process
                console.warn(`Warning: Error checking for ${procInfo.displayName}: ${stderr.trim()}`);
                resolve(false); // Don't block if there's an error checking, but log it
                return;
            }

            // On Windows, tasklist error.message contains "INFO: No tasks are running..." if not found
            if (error && error.message && (error.message.includes('No tasks are running') || error.message.includes('INFO: No tasks are running'))) {
                // console.log(`No lingering ${procInfo.displayName} found.`);
                resolve(false);
                return;
            }


            if (stdout && stdout.toLowerCase().includes(procInfo.name.toLowerCase().replace('.exe', ''))) {
                console.warn(`WARNING: Found running ${procInfo.displayName} process(es).`);
                lingeringProcessesFound = true;
                resolve(true);
            } else {
                // console.log(`No lingering ${procInfo.displayName} found.`);
                resolve(false);
            }
        });
    });
}

async function main() {
    console.log('Checking for lingering driver processes...');
    const checks = [];
    for (const procInfo of processesToCheck) {
        // Only check platform-appropriate names unless it's a generic name
        if (process.platform === 'win32' && !procInfo.name.endsWith('.exe')) continue;
        if (process.platform !== 'win32' && procInfo.name.endsWith('.exe')) continue;
        checks.push(checkProcess(procInfo));
    }

    await Promise.all(checks);

    if (lingeringProcessesFound) {
        console.error('\nABORTING: Lingering driver process(es) detected. Please close them before running tests.');
        process.exit(1); // Exit with error code
    } else {
        console.log('All clear. No lingering driver processes detected.');
        process.exit(0); // Exit with success
    }
}

main();

Pre-setup, teardown, test runner

// tests/e2e/webdriverio/post-test-teardown.js
const fs = require('node:fs');
const path = require('node:path');
const os = require('node:os');
const { spawnSync } = require('node:child_process');

// --- Configuration ---
const projectRoot = path.resolve(__dirname, '..', '..', '..');
const testVaultDirName = 'e2e-test-vault';
const testVaultBasePath = path.join(projectRoot, 'tests', 'e2e', 'setup');
const actualTestVaultPath = path.join(testVaultBasePath, testVaultDirName);
const pidFilePath = path.join(__dirname, '.dev-server.pid');

const bundleIdentifier = 'com.vertexvault.app';
const appDataBaseDir = process.platform === 'win32'
   ? path.join(os.homedir(), 'AppData', 'Roaming')
   : (process.platform === 'darwin' 
       ? path.join(os.homedir(), 'Library', 'Application Support')
       : path.join(os.homedir(), '.config')); 
const appDataPath = path.join(appDataBaseDir, bundleIdentifier);

const APP_SETTINGS_FILENAME = '.vertexvault.app.settings.dat';
const settingsFilePath = path.join(appDataPath, APP_SETTINGS_FILENAME);
const backupSettingsFilePath = path.join(appDataPath, `${APP_SETTINGS_FILENAME}.bak`);

function killProcessOnPort(port) {
   if (process.platform !== 'win32') {
       console.log('Port-based process killing is only implemented for Windows in this script.');
       return;
   }
   try {
       console.log(`Searching for process on port ${port}...`);
       const netstatCmd = `netstat -aon | findstr "LISTENING" | findstr ":${port}"`;
       const netstatResult = spawnSync(netstatCmd, { encoding: 'utf-8', shell: true });

       if (netstatResult.error || netstatResult.status !== 0 || !netstatResult.stdout) {
           console.log(`No process found listening on port ${port}.`);
           return;
       }

       const lines = netstatResult.stdout.trim().split('\n');
       for (const line of lines) {
           const parts = line.trim().split(/\s+/);
           const pid = parts[parts.length - 1];
           if (pid && pid !== '0') {
               console.log(`Found process with PID ${pid} on port ${port}. Terminating...`);
               spawnSync('taskkill', ['/PID', pid, '/F', '/T']);
               console.log(`Termination command sent to process ${pid}.`);
           }
       }
   } catch (e) {
       console.error(`An error occurred while trying to kill process on port ${port}:`, e);
   }
}

console.log('Running post-test teardown...');

// 1. Stop Vite Dev Server by Port
killProcessOnPort(1420);

// 2. Clean up PID file
if (fs.existsSync(pidFilePath)) {
   try { fs.unlinkSync(pidFilePath); } catch (e) {}
}

// 3. Restore User Settings
console.log('Restoring user settings...');
if (fs.existsSync(settingsFilePath)) {
   try { fs.unlinkSync(settingsFilePath); } catch (e) {}
}
if (fs.existsSync(backupSettingsFilePath)) {
   try {
       fs.renameSync(backupSettingsFilePath, settingsFilePath);
       console.log('User settings restored.');
   } catch (e) {
       console.error('Error restoring settings:', e);
   }
}

// 4. Delete Test Vault
if (fs.existsSync(actualTestVaultPath)) {
   console.log('Deleting test vault...');
   try {
       fs.rmSync(actualTestVaultPath, { recursive: true, force: true });
       console.log('Test vault deleted.');
   } catch (e) {
       console.error('Error deleting test vault:', e);
   }
}

console.log('Post-test teardown complete.');

// tests/e2e/webdriverio/pre-test-setup.empty.js
const { spawn, spawnSync } = require('node:child_process');
const path = require('node:path');
const fs =require('node:fs');
const os = require('node:os');
const waitOn = require('wait-on');

// --- Configuration ---
const projectRoot = path.resolve(__dirname, '..', '..', '..');
const testVaultDirName = 'e2e-test-vault';
const testVaultBasePath = path.join(projectRoot, 'tests', 'e2e', 'setup');
const actualTestVaultPath = path.join(testVaultBasePath, testVaultDirName);
const pidFilePath = path.join(__dirname, '.dev-server.pid');

const bundleIdentifier = 'com.vertexvault.app';
const appDataBaseDir = process.platform === 'win32'
    ? path.join(os.homedir(), 'AppData', 'Roaming')
    : (process.platform === 'darwin' 
        ? path.join(os.homedir(), 'Library', 'Application Support')
        : path.join(os.homedir(), '.config')); 
const appDataPath = path.join(appDataBaseDir, bundleIdentifier);

const APP_SETTINGS_FILENAME = '.vertexvault.app.settings.dat';
const settingsFilePath = path.join(appDataPath, APP_SETTINGS_FILENAME);
const backupSettingsFilePath = path.join(appDataPath, `${APP_SETTINGS_FILENAME}.bak`);

// --- Helper Functions ---
function ensureDirectoryExistence(filePath) {
    const dirname = path.dirname(filePath);
    if (fs.existsSync(dirname)) {
        return true;
    }
    ensureDirectoryExistence(dirname);
    fs.mkdirSync(dirname, { recursive: true });
}

async function main() {
    // --- 0. Create a clean, empty test vault directory ---
    console.log('Preparing a clean, empty test vault directory...');
    if (fs.existsSync(actualTestVaultPath)) {
        fs.rmSync(actualTestVaultPath, { recursive: true, force: true });
        console.log('Removed existing test vault.');
    }
    fs.mkdirSync(actualTestVaultPath, { recursive: true });
    console.log('Created clean test vault at:', actualTestVaultPath);

    // --- 1. Backup User Settings & Ensure Clean State for First Launch ---
    console.log('Backing up user settings and preparing for a true first launch...');
    ensureDirectoryExistence(settingsFilePath);
    if (fs.existsSync(settingsFilePath)) {
        fs.renameSync(settingsFilePath, backupSettingsFilePath);
        console.log('User settings file backed up.');
    }
    // Create an empty settings file to simulate first launch
    fs.writeFileSync(settingsFilePath, JSON.stringify({}, null, 2));
    console.log('Clean settings file created for first launch test.');

    // --- 2. Start Vite Dev Server ---
    console.log('Starting Vite dev server for frontend...');
    const vitePath = path.join(projectRoot, 'node_modules', 'vite', 'bin', 'vite.js');
    const devServerProcess = spawn('node', [vitePath, 'dev'], {
        cwd: projectRoot,
        stdio: 'ignore',
        shell: false,
        detached: true
    });
    devServerProcess.unref();
    fs.writeFileSync(pidFilePath, devServerProcess.pid.toString());
    console.log(`Vite dev server started in background with PID: ${devServerProcess.pid}`);

    // --- 3. Wait for Server to be Ready ---
    try {
        console.log('Waiting for dev server to be ready...');
        await waitOn({
            resources: ['http-get://localhost:1420'],
            timeout: 60000,
            interval: 500,
            verbose: false,
        });
        console.log('Dev server is ready.');
    } catch (error) {
        console.error('Server did not become ready in time.', error);
        spawnSync('taskkill', ['/PID', devServerProcess.pid, '/F', '/T']);
        process.exit(1);
    }

    // --- 4. Build Tauri App ---
    console.log('Building Tauri app for E2E tests (debug mode)...');
    const buildResult = spawnSync('cargo', ['build', '--manifest-path', path.join(projectRoot, 'src-tauri', 'Cargo.toml')], {
        stdio: 'inherit',
        shell: process.platform === 'win32',
        cwd: path.join(projectRoot, 'src-tauri')
    });
    if (buildResult.status !== 0) {
        console.error('Failed to build Tauri app. Exiting.');
        spawnSync('taskkill', ['/PID', devServerProcess.pid, '/F', '/T']);
        process.exit(1);
    }
    console.log('Tauri app built successfully.');
    console.log('Pre-test setup complete.');
}

main().catch(err => {
    console.error("An unexpected error occurred in pre-test setup:", err);
    process.exit(1);
});

// tests/e2e/webdriverio/run-test-wrapper.js
const { spawnSync } = require('node:child_process');

function runCommand(command, args) {
    console.log(`\n> Running: ${command} ${args.join(' ')}\n`);
    const result = spawnSync(command, args, {
        stdio: 'inherit',
        shell: true // shell for better cross-platform compatibility with node commands (subject of change)
    });
    if (result.status !== 0) {
        console.error(`Command failed: ${command} ${args.join(' ')}`);
        // Propagate the exit code
        process.exit(result.status);
    }
}

try {
    // Check for lingering (running) drivers once at the start
    runCommand('node', ['./check_lingering_drivers.js']);

    // Run the setup for an EMPTY vault. The tests will handle populating it
    console.log('\n--- Preparing a clean, empty test environment ---\n');
    runCommand('node', ['./pre-test-setup.empty.js']);
    
    // Run all test suites defined in the wdio.conf.js file
    console.log('\n--- Starting WebdriverIO test suites ---\n');
    runCommand('wdio', ['run', './wdio.conf.js']);

} catch (error) {
    console.error('An error occurred during the test run:', error);
    process.exit(1);
} finally {
    // cleanup phase
    console.log('\n--- Entering final cleanup phase ---\n');
    runCommand('node', ['./post-test-teardown.js']);
}

Test file itself

// tests/e2e/specs/02-asset-lifecycle.spec.cjs
const { expect } = require('@wdio/globals');
const path = require('node:path');
const fs = require('node:fs');

describe('Suite 2: Core Asset Lifecycle', () => {
    const testVaultPath = path.resolve(__dirname, '..', 'setup', 'e2e-test-vault');
    const assetName = 'pigeon_test.glb';
    const assetPathInVault = path.join(testVaultPath, assetName).replace(/\\/g, '/');
    const assetSourcePath = path.resolve(__dirname, '..', 'setup', 'test-assets', assetName);

    before(() => {
        // PRE-REQUISITE: Copy the test asset into the test vault directory.
        fs.copyFileSync(assetSourcePath, assetPathInVault.replace(/\//g, path.sep));
    });

    it('should load an asset, show the viewer, and enable the commit button', async () => {
        // The app should already be on the empty dashboard from the previous test suite.
        const emptyMessage = await $('[data-testid="empty-dashboard-message"]');
        await expect(emptyMessage).toBeDisplayed();

        // 1. Initial asset loading via UI button, with dialog bypassed by E2E hook
        console.log('Step 1: Triggering asset load...');
        const loadAssetButton = await $('[data-testid="asset-loader-button"]');
        await loadAssetButton.waitForDisplayed({ timeout: 5000, timeoutMsg: "Load asset button not found on dashboard" });

        await browser.execute((path) => {
            window.__E2E_ASSET_PATH_TO_LOAD__ = path;
        }, assetPathInVault);
        
        await loadAssetButton.click();

        // 2. Wait for viewer container and initial states...
        console.log('Step 2: Waiting for viewer container and initial states...');
        const assetViewerContainer = await $('[data-testid="three-js-viewer"]');
        const commitButton = await $('[data-testid="commit-changes-button"]');
        
        await assetViewerContainer.waitForExist({ 
            timeout: 10000,
            timeoutMsg: "Viewer container not found"
        });

        await browser.waitUntil(async () => {
            const loadingIndicator = await $('[data-testid="loading-indicator"]');
            return await loadingIndicator.isDisplayed();
        }, {
            timeout: 5000,
            timeoutMsg: 'Loading indicator never appeared',
            interval: 100
        }).catch(() => console.log('Loading indicator may have been too quick to catch'));

        // 3. Wait for loading states to complete...
        console.log('Step 3: Waiting for loading states to complete...');
        await browser.waitUntil(async () => {
            const loadingIndicator = await $('[data-testid="loading-indicator"]');
            return !(await loadingIndicator.isDisplayed());
        }, {
            timeout: 20000,
            interval: 500,
            timeoutMsg: 'Loading indicator remained visible too long'
        });

        // 4. Verify model ready state
        console.log('Step 4: Checking model ready state...');
        await browser.waitUntil(async () => {
            const modelReady = await assetViewerContainer.getAttribute('data-model-ready');
            return modelReady === 'true';
        }, {
            timeout: 15000,
            interval: 500,
            timeoutMsg: 'Model did not become ready'
        });

        // 5. Finally verify commit button is enabled
        console.log('Step 5: Verifying final commit button state...');
        await browser.waitUntil(async () => {
            const isEnabled = await commitButton.isEnabled();
            const currentTitle = await commitButton.getAttribute('title');
            if (!isEnabled) {
                console.log(`Commit button enabled: ${isEnabled}, title: ${currentTitle}`);
            }
            return isEnabled && currentTitle.includes('Commit current changes to this asset');
        }, {
            timeout: 10000,
            interval: 500,
            timeoutMsg: 'Commit button did not become enabled with correct title'
        });

        // 6. Final assertions
        await expect(commitButton).toBeDisplayed();
        await expect(commitButton).toBeEnabled();
        await expect(commitButton).toBeClickable();
        
        console.log('Test passed: Asset loaded and commit button is ready');
    });

    it('should commit the loaded asset and see it on the dashboard', async () => {
        const commitButton = await $('[data-testid="commit-changes-button"]');
        await expect(commitButton).toBeEnabled();

        // 1. Show commit dialog and verify its content
        await commitButton.click();
        
        const dialogTitle = await $('[data-testid="dialog-title"]');
        const dialogDescription = await $('[data-testid="dialog-description"]');
        const dialogInfoBox = await $('[data-testid="dialog-info-box"]');
        await dialogTitle.waitForDisplayed();

        await expect(dialogTitle).toHaveText('Commit Changes');
        await expect(dialogDescription).toHaveTextContaining(`Enter a message for committing changes to: ${assetName}`);
        await expect(dialogInfoBox).toHaveTextContaining('A screenshot of the current 3D view will be captured with this commit.');

        // 2. Enter commit message and commit
        const commitDialogInput = await $('#commit-message');
        await commitDialogInput.setValue('Initial commit');
        const commitDialogButton = await $('button=Commit');
        await commitDialogButton.click();

        // 3. Wait for the commit to process by checking for the new entry in the history panel.
        const historyList = await $('[data-testid="history-list"]');
        await historyList.waitForExist({ timeout: 15000, timeoutMsg: "History list did not appear after commit." });

        // Verify there is now one commit in the list.
        const commitItems = await $$('[data-testid^="commit-item-"]');
        expect(commitItems.length).toBe(1);
        console.log('Commit successful, new entry found in history panel.');
        
        // 4. Verify we are still in the asset viewer, and the commit button remains enabled.
        const viewerSection = await $('[data-testid="asset-viewer-section"]');
        await expect(viewerSection).toBeDisplayed();
        await expect(commitButton).toBeEnabled();
        console.log('Still in asset viewer and commit button is enabled, as expected.');

        // 5. Manually navigate to the dashboard to verify the asset was added
        const assetsNavlink = await $('[data-testid="nav-link-assets"]');
        await assetsNavlink.click();

        // 6. Wait for the dashboard to appear
        const dashboardHeader = await $('[data-testid="asset-library-header"]');
        await dashboardHeader.waitForDisplayed({ timeout: 5000, timeoutMsg: "Could not navigate back to the dashboard" });

        // 7. Verify the asset is now in the dashboard table
        const assetRow = await $(`[data-testid^="asset-row-"]`);
        await assetRow.waitForDisplayed();
        const assetNameCell = await assetRow.$(`td*=${assetName}`);
        await expect(assetNameCell).toBeDisplayed();
        console.log('Test passed: Asset committed and visible on dashboard.');
    });
});

Good luck!

[lifeinchords]

bloop...