WebGL clears its drawing buffer after each frame by default. When Userback captures the page, the canvas can come out blank or transparent. Setting preserveDrawingBuffer to true keeps the last frame available, so it shows in screenshots.
Fix it in your code
Find where your app creates the WebGL context, usually a call to
getContext.Set
preserveDrawingBuffertotruein the context attributes. For example:
var canvas = document.getElementById('yourCanvas');
var context = canvas.getContext('webgl', {
preserveDrawingBuffer: true });
Save the change, reload the page, and submit a test piece of feedback to check the screenshot.
If you use a 3D library such as three.js, set the same option where the library creates its renderer.
If you can't change the code
Turn on Native Screenshot, which uses the browser's own screenshot feature instead. See Native Screenshot.
Session replays
Session replays don't record canvas, WebGL, or 3D canvas content, even with this setting on. Those areas show as blank in replays.
Learn more