Puppeteer with ThreeJS - How can I make the background transparent?

I tried to give renderer alpha: true and it doesn’t work as I wanted it to be

puppeteer code

import puppeteer from 'puppeteer';
import path from 'path';

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  const filePath = path.resolve('index.html');
  await page.goto(`file://${filePath}`);

  await page.setViewport({ width: 512, height: 512 });
  await page.evaluate(() => document.body.style.background = 'transparent');
  await page.screenshot({path: 'example.png', omitBackground: true});

  await browser.close();
<!DOCTYPE html>
<html lang="en">

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
        body {
            margin: 0;

        canvas {
            display: block;

    <script src="https://cdn.jsdelivr.net/npm/three@0.132.2/build/three.min.js"></script>
        // Setting up stuff
        const scene = new THREE.Scene();
        const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        const renderer = new THREE.WebGLRenderer({ alpha: true }); // Set alpha to true for transparency
        renderer.setSize(window.innerWidth, window.innerHeight);
        renderer.setClearColor(0x00000000, 0); // Set clear color to transparent

        // Funny little green cube
        const geometry = new THREE.BoxGeometry();
        const material = new THREE.MeshBasicMaterial({ color: 0x00ff00, transparent: true, opacity: 0.5 });
        const cube = new THREE.Mesh(geometry, material);

        // Move the cam a little
        camera.position.z = 5;

        // Render
        function animate() {

            // Rotate the cube
            cube.rotation.x += 0.01;
            cube.rotation.y += 0.01;

            renderer.render(scene, camera);



When I try to screenshot this in puppeteer, I get this

The background is white, how can i make the background transparent?

The code is right it should be transparent is there something behind the canvas?

Oh, I found the solution, it was because i was not passing omitBackground: true when i screenshot the page, it makes the background transparent

await page.screenshot({path: 'example.png', omitBackground: true});

does this

await page.screenshot({path: 'example.png'});

does this