Export is completly blank

[M1dnight-ofcl]

Expected behavior

I was expecting it to export my element, but it exported a completly blank image with no errors in console. For context, I am using react if that helps, but it should make sense. Here is my code:

import "./style/style.css";
import { Window } from "../sdk/sdk";
import { useState } from "react";
// import html2canvas from "html2canvas";
import domtoimage from 'dom-to-image';

const RenderImage=()=>{
    const[winData,setWinData]=useState({
        title:"Test Window",
        icon:"Information",
        src:`# Hello!`,
    });
    return(<div id="renderImages">
        <div id="ri_params">
            <h1>Window Parameters</h1>
            <hr />{/*--------------------*/}
            <h2>Window Title</h2>
            <input
                id="windowTitle"
                defaultValue="Test Window"
                onChange={(e)=>{
                    setWinData(prevState=>({
                        ...prevState,
                        title:e.target.value,
                    }))
                }}></input>
            <h2>Window Content</h2>
            <textarea 
                id="windowContents" 
                cols="40" 
                rows="5"
                defaultValue="# Hello!"
                onChange={(e)=>{
                    setWinData(prevState=>({
                        ...prevState,
                        src:e.target.value,
                    }))
                }}></textarea>
        </div>
        <div id="maximizePreview"></div>
        <Window 
            size={{
              "height": "38vmin",
              "width": "58vmin"}} 
            pos={{
              "x":["left","calc(50% - (58vmin / 2) + 10vmin)"],
              "y":["top","calc(50% - (38vmin / 2))"],}}
            includeTitlebarOptions={{
              "min": true,
              "max": true,
              "close": true,
            }}
            customLayer="999"
            id="testwin"
            title={winData.title}
            icon={`/icons/xp/${winData.icon}.png`}
            markdownSource={winData.src}>
        </Window>
        <button id="export" onClick={(e)=>{
            e.preventDefault();
            var win=document.getElementById("win_testwin");
            //! depricated but working
            // html2canvas(win,{
                // backgroundColor:null}).then(canvas=>{
                // // document.body.appendChild(canvas);
                // var image=canvas.toDataURL("image/png").replace("image/png","image/octet-stream");
                // var link=document.createElement('a');
                // link.setAttribute('download','BeansiteXP_Window.png');
                // link.setAttribute('href',image);
                // link.click();
            // });
            // domtoimage.toSvg(win)
            domtoimage.toPng(win)
            .then((dataUrl)=>{
                var link=document.createElement("a");
                link.href=dataUrl;
                link.download="Window";
                link.click();
            }).catch(()=>{console.error("failed to export")});
        }}>Export</button>
    </div>)
};
export default RenderImage;

Actual behavior (stack traces, console logs etc)

Everything works as usual, however, when I click export button, it exports a completely blank image. No errors in console. it just doesn't work.

Library version

2.6.0

Browsers

Originally tested in Opera 112.0.5197.30 but was trested and did not work in Firefox 128.0.3