processing/p5.js

beginClip() is accidentally being applied to framebuffers

Closed this issue · 0 comments

Most appropriate sub-area of p5.js?

  • WebGL

p5.js version

1.9.1

Web browser and version

Chrome 124 (not Firefox, weirdly!)

Operating system

MacOS 14.2.1

Steps to reproduce this

Steps:

  1. Start clipping to a shape
  2. Draw something to a framebuffer. The clip shouldn't be applied to the framebuffer's context.
  3. Stop clipping
  4. Draw the framebuffer to the main canvas
  5. The framebuffer should appear unclipped, since its framebuffer context was never clipped, and clipping was not applied when drawing it to the main canvas.

Snippet:

let fbo

function setup() {
  createCanvas(400, 400, WEBGL);
  fbo = createFramebuffer()
}

function draw() {
  background(220);
  push()
  beginClip()
  circle(0, 0, 200)
  endClip()
    
  fbo.draw(() => {
    console.log(drawingContext.isEnabled(drawingContext.STENCIL_TEST))
    fill('red')
    noStroke()
    plane(width, height)
  })
  pop()
  
  imageMode(CENTER)
  image(fbo, 0, 0)
  
  noLoop()
}

The expected output is a full red canvas, but instead we get an empty canvas.