From db26ab6de656396af708b48af1feebf9cbd1416d Mon Sep 17 00:00:00 2001
From: felixpalmer <felixpalmer@gmail.com>
Date: Wed, 27 Mar 2024 17:59:07 +0100
Subject: [PATCH] Do not clear when rendering to target in PostProcessEffect
 (#8705)

---
 modules/core/src/effects/post-process-effect.ts | 6 ++++--
 modules/core/src/lib/deck-renderer.ts           | 1 +
 modules/core/src/passes/screen-pass.ts          | 5 +++--
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/modules/core/src/effects/post-process-effect.ts b/modules/core/src/effects/post-process-effect.ts
index e84aaeea2d2..7b294fa9def 100644
--- a/modules/core/src/effects/post-process-effect.ts
+++ b/modules/core/src/effects/post-process-effect.ts
@@ -38,12 +38,14 @@ export default class PostProcessEffect<ShaderPassT extends ShaderPass> implement
 
     for (let index = 0; index < passes.length; index++) {
       const isLastPass = index === passes.length - 1;
-      if (target !== undefined && isLastPass) {
+      const renderToTarget = target !== undefined && isLastPass;
+      if (renderToTarget) {
         outputBuffer = target;
       }
+      const clearCanvas = !renderToTarget || Boolean(params.clearCanvas);
       const moduleSettings = {};
       moduleSettings[this.module.name] = this.props;
-      passes[index].render({inputBuffer, outputBuffer, moduleSettings});
+      passes[index].render({clearCanvas, inputBuffer, outputBuffer, moduleSettings});
 
       const switchBuffer = outputBuffer as Framebuffer;
       outputBuffer = inputBuffer;
diff --git a/modules/core/src/lib/deck-renderer.ts b/modules/core/src/lib/deck-renderer.ts
index 1165a77d2c7..a5776fa420e 100644
--- a/modules/core/src/lib/deck-renderer.ts
+++ b/modules/core/src/lib/deck-renderer.ts
@@ -84,6 +84,7 @@ export default class DeckRenderer {
     const outputBuffer = this.lastPostProcessEffect ? this.renderBuffers[0] : renderOpts.target;
     if (this.lastPostProcessEffect) {
       renderOpts.clearColor = [0, 0, 0, 0];
+      renderOpts.clearCanvas = true;
     }
     const renderStats = layerPass.render({...renderOpts, target: outputBuffer});
 
diff --git a/modules/core/src/passes/screen-pass.ts b/modules/core/src/passes/screen-pass.ts
index 14e48ae9340..5849b4f3b5a 100644
--- a/modules/core/src/passes/screen-pass.ts
+++ b/modules/core/src/passes/screen-pass.ts
@@ -13,6 +13,7 @@ type ScreenPassProps = {
 };
 
 type ScreenPassRenderOptions = {
+  clearCanvas?: boolean;
   inputBuffer: Framebuffer;
   outputBuffer: Framebuffer | null;
   moduleSettings: any;
@@ -47,7 +48,7 @@ export default class ScreenPass extends Pass {
    * @param outputBuffer - Frame buffer that serves as the output render target
    */
   protected _renderPass(device: Device, options: ScreenPassRenderOptions) {
-    const {inputBuffer, outputBuffer} = options;
+    const {clearCanvas, inputBuffer, outputBuffer} = options;
     const texSize = [inputBuffer.width, inputBuffer.height];
     this.model.shaderInputs.setProps(options.moduleSettings);
     this.model.setBindings({texSrc: inputBuffer.colorAttachments[0]});
@@ -55,7 +56,7 @@ export default class ScreenPass extends Pass {
     const renderPass = this.device.beginRenderPass({
       framebuffer: outputBuffer,
       parameters: {viewport: [0, 0, ...texSize]},
-      clearColor: [0, 0, 0, 0],
+      clearColor: clearCanvas ? [0, 0, 0, 0] : false,
       clearDepth: 1
     });