Babylonjs TestTools docs/info?

Anupam_Das · January 16, 2024, 5:31pm

We’re getting into the rabbit hole of automated testing finally and I figured why not just used the stuff you all have set up already and extend off of that.

looks like ur using.

Im just curious what each of these does and where in the build pipeline they are used. Even just a brief writeup may be helpful.

github.com

BabylonJS/Babylon.js/blob/master/packages/tools/testTools/src/visualizationUtils.ts

/* eslint-disable no-console */
/* eslint-disable @typescript-eslint/naming-convention */
declare const BABYLON: typeof window.BABYLON;

export const evaluateInitEngineForVisualization = async (engineName: string, useReverseDepthBuffer: string | number, useNonCompatibilityMode: string | number, baseUrl: string) => {
    engineName = engineName ? engineName.toLowerCase() : "webgl2";
    if (window.engine) {
        window.engine.dispose();
        window.engine = null;
    }
    if (engineName === "webgl") {
        engineName = "webgl1";
    }

    BABYLON.SceneLoader.ShowLoadingScreen = false;
    BABYLON.SceneLoader.ForceFullSceneLoadingForIncremental = true;

    BABYLON.Tools.ScriptBaseUrl = baseUrl;

    window.forceUseReverseDepthBuffer = useReverseDepthBuffer === 1 || useReverseDepthBuffer === "true";

This file has been truncated. show original

Im a little new to testing but it looks like its using a combination of selenium and jest image diff (to evaluate against a ground truth image )

github.com

BabylonJS/Babylon.js/blob/master/scripts/jest-imagediff-reporter.js

const fs = require("fs");
const path = require("path");

const DIFF_DIRECTORY = path.join(__dirname, "..", "jest-screenshot-report");

class ImageDiffReporter {
    /* istanbul ignore next - test coverage in child process */
    onRunStart() {
        try {
            fs.statSync(DIFF_DIRECTORY);
        } catch (e) {
            fs.mkdirSync(DIFF_DIRECTORY, { recursive: true });
        }

        // cleanup
        const files = fs.readdirSync(DIFF_DIRECTORY);

        if (files.length > 0) {
            files.forEach(function (filename) {
                if (fs.statSync(DIFF_DIRECTORY + "/" + filename).isDirectory()) {

This file has been truncated. show original

I also know there was some usage of playwright in the past but I dont know if thats actively being used anymore? @RaananW

Just trying to put all the pieces together at this point…

-Anupam

RaananW · January 16, 2024, 5:37pm

We are using playwright a well. For now experimental only, but you can see the implementation here - Babylon.js/packages/tools/tests/test/playwright/visualizationPlaywright.utils.ts at master · BabylonJS/Babylon.js (github.com)

The repo you shared (the webpack-es6 one) also has an implementation of a simple playwright tester. It all depends on your use case and what you want to test. also What platforms you want to test on.

Small note - Selenium is only used for integration tests to test on Safari.

Anupam_Das · January 17, 2024, 1:03am

thanks for the note. This is useful. Well testing is a super broad topic but for starters we want to test for visual regressions as we upgrade to new versions of our API. Essentially diff against a ground truth image and report if a threshold was exceeded. I like Playwright, as it seems to make multi-platform testing much easier.

Topic		Replies	Views
QA Testing tools for 3D Web Application Questions	3	307	May 16, 2023
Automatic testing Questions	12	2915	July 20, 2022
Testing babylon Questions	2	177	February 1, 2024
Trouble with @babylonjs es6 modules and jest and typescript Bugs	23	3622	February 11, 2022
Tests failures with 4.2.0-alpha.2 Questions	12	869	March 14, 2020

Babylonjs TestTools docs/info?

Related Topics