# Visualization tests **URL:** \ **Category:** Questions\ **Created:** [June 20, 2023, 6:18am UTC](https://forum.babylonjs.com/t/visualization-tests/41753 "2023-06-20T06:18:12Z")\ **Posts on this page:** 17\ **Page:** 1
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 6:18am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/1 "2023-06-20T06:18:12Z")
@Evgeni_Popov @RaananW @sebavan Hello! How do you guys take the screenshots for the visualization tests? Do you use the Screenshot function in the debug layer? Capture with RTT? Code snippet? Do you go to fullscreen, screenshot the whole screen and you resize the screenshot afterwards to 600x400 or is there something I am not aware of how to make the screenshot in fullscreen directly to 600x400 more easily? Must it be 600x400 or can I use a fullscreen FullHD screenshot? Thank you very much! My first try looks like this 🙈 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/4/a/4a0187d31a78bd74a71ff81cd5778ab444c7c684.png) EDIT: Guys, would someone please give me detailed information how to create a new Visualization test from A to Z? The documentation is outdated and even after I created a 600x400 png (fullscreen screenshot + photoshop - I don’t even know if I need to center the image 🙈 ), edited the config, I couldn’t get the tests running (wrong url in the docs). Enlighten me please! 🙏 Thank you! ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 20, 2023, 10:48am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/2 "2023-06-20T10:48:27Z")
It can’t be simpler: 1. Create a playground 2. Add the playground the config.json - [Babylon.js/packages/tools/tests/test/visualization/config.json at master · BabylonJS/Babylon.js · GitHub](https://github.com/BabylonJS/Babylon.js/blob/master/packages/tools/tests/test/visualization/config.json) 3. run visualization tests with the `-u` parameter. This will generate the screenshot for you. You can run your test only, but running `npm run test:visualization -- -i "webgl2" -t "Your Test Name" -u` I guess you are referring to this page that is outdated: [Validation tests | Babylon.js Documentation (babylonjs.com)](https://doc.babylonjs.com/contribute/toBabylon/validationTests). You are totally right. I’ll take it as a task to update it. ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 10:53am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/3 "2023-06-20T10:53:08Z")
> [@RaananW](#): > > This will generate the screenshot for you. This rocks! 🤘 Thanks a lot for the information! ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 20, 2023, 10:55am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/4 "2023-06-20T10:55:46Z")
---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 11:09am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/5 "2023-06-20T11:09:35Z")
I love this ❤ webgl2 without problems, but failed to create the screenshot on webgpu: **Evaluation failed: TypeError: navigator.gpu.getPreferredCanvasFormat is not a function** ```auto at new WebGPUEngine (../dev/core/src/Engines/webgpuEngine.ts:361:76) at __puppeteer_evaluation_script__ :52:24 at ExecutionContext._evaluateInternal (node_modules/puppeteer/src/common/ExecutionContext.ts:273:13) at async ExecutionContext.evaluate (node_modules/puppeteer/src/common/ExecutionContext.ts:140:12) ``` I just changed the -i parameter to webgpu and ofcourse edited the webgpu config. Do I need to do anything else? ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 20, 2023, 11:14am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/6 "2023-06-20T11:14:36Z")
oh, that’s probably related to the puppeteer version. can you try fetching/merging from master and running npm install? ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 20, 2023, 11:15am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/7 "2023-06-20T11:15:19Z")
and the screenshot should probably be the same. there is no reason to generate two. so if this test is running on webgl2 - this should also fit the screenshot of webgpu ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 11:22am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/8 "2023-06-20T11:22:54Z")
> [@RaananW](#): > > `npm run test:visualization -- -i "webgl2" -t "Your Test Name" -u` I was curios whether it’s just an issue on Mac so I’ve tried that on PC just right now. I have the most recent version of the repo, did an `npm i`, but no luck. Same error. ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 11:24am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/9 "2023-06-20T11:24:01Z")
> [@RaananW](#): > > there is no reason to generate two 🧐 yerrr! putting the same image in the webgpu folder 😉 ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 20, 2023, 11:24am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/10 "2023-06-20T11:24:19Z")
quick question for @Evgeni_Popov - did you have this issue when using vis-tests? ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 11:29am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/11 "2023-06-20T11:29:31Z")
Sacre bleu!!! I just added the png and modified the config file and now: ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/f/3/f38a6ca7c122b0f2d12b4520feab37d93489aa97.png) [https://dev.azure.com/babylonjs/ContinousIntegration/\_build/results?buildId=26008&view=results](https://dev.azure.com/babylonjs/ContinousIntegration/_build/results?buildId=26008&view=results) ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 20, 2023, 11:31am UTC](https://forum.babylonjs.com/t/visualization-tests/41753/12 "2023-06-20T11:31:09Z")
that’s node.js init on azure… every time there is a new version of node azure goes a little crazy. I re-ran the tests, I hope it will pass this time. ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 12:07pm UTC](https://forum.babylonjs.com/t/visualization-tests/41753/13 "2023-06-20T12:07:10Z")
We use Azure Devops at work as well so I am already immune against these quirks 😂 ---
**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\ **Post date:** [June 20, 2023, 12:52pm UTC](https://forum.babylonjs.com/t/visualization-tests/41753/14 "2023-06-20T12:52:44Z")
When testing for WebGPU, I have to manually change the path to Chrome in **jest-puppeteer.config.js** because it seems the Chrome version embedded with puppeteer does not support WebGPU. So, I’m doing something like: ```auto const browserPath = process.env.BROWSER_PATH || "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe"; ``` If I want to test with Canary instead, I use the path **C:/Users/micro/AppData/Local/Google/Chrome SxS/Application/chrome.exe**. Note that the image does not need to be copied in `ReferenceImages/webgpu/`: as your test is declared in `config.json`, the picture must be copied in `ReferenceImages/`. This [part of the doc](https://doc.babylonjs.com/contribute/toBabylon/validationTests#creating-new-lists) is still relevant (except for the url) to explain what is a test list and that pictures are related to a list. A test list is orthogonal to the engine you use to launch the tests: you can test `webgpu.json` with WebGL2 and `config.json` with WebGPU. By default, when using WebGL2, it’s `config.json` that is used, and `webgpu.json` for WebGPU. But you can change this by editing **tests/test/visualization/visualization.webgl2.test.ts** or **visualization.webgpu.test.ts** : the second parameter of the `evaluateTests` call is the name of the list, without the _.json_ part. In any case, I think we are going to add all the tests from _webgpu.json_ to _config.json_, now that the WebGPU engine is up to date. ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 2:34pm UTC](https://forum.babylonjs.com/t/visualization-tests/41753/15 "2023-06-20T14:34:59Z")
Thank you very much! ---
**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\ **Post date:** [June 20, 2023, 2:36pm UTC](https://forum.babylonjs.com/t/visualization-tests/41753/16 "2023-06-20T14:36:14Z")
> [@Evgeni\_Popov](#): > > Note that the image does not need to be copied in `ReferenceImages/webgpu/`: as your test is declared in `config.json`, the picture must be copied in `ReferenceImages` Yes, this is obvious. 🕶 EDIT: Just to be precise, I was trying to figure out what and where to put before I got your answers, so the image may have appeared in one of my commits in the webgpu folder as well. ---
**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\ **Post date:** [June 27, 2023, 3:04pm UTC](https://forum.babylonjs.com/t/visualization-tests/41753/17 "2023-06-27T15:04:56Z")