processing/p5.js

WebGL Error Triggered by `noSmooth()` Invocation Between Framebuffer Creation and Drawing on Framebuffer

Open

#6,369 opened on Aug 22, 2023

View on GitHub
 (1 comment) (1 reaction) (0 assignees)JavaScript (3,178 forks)batch import
Area:WebGLBugHelp Wanted

Repository metrics

Stars
 (20,784 stars)
PR merge metrics
 (Avg merge 8d 13h) (45 merged PRs in 30d)

Description

Problem

In WEBGL mode, invoking the noSmooth() function specifically between the creation of a framebuffer and performing drawing operations on said framebuffer results in the following error:

WebGL: INVALID_OPERATION: bindTexture: object does not belong to this context

This issue appears to be browser-specific; it has been observed in Chrome, but not in Firefox.

Reproduction Steps

Here's a minimal example that demonstrates the issue:

let testBuffer;

function setup() {
  createCanvas(400, 400, WEBGL);

  testBuffer = createFramebuffer();

  // 🔴 Using noSmooth() between creating the buffer and drawing on the buffer triggers the error
  noSmooth();

  testBuffer.begin();
  circle(0, 0, 200);
  testBuffer.end();
}

function draw() {
  background(150);
  texture(testBuffer);
  orbitControl();
  box(200);
}

Expected Behavior

Calling noSmooth() between framebuffer creation and drawing should not introduce WebGL errors.

Actual Behavior

An error is thrown, specifically: WebGL: INVALID_OPERATION: bindTexture: object does not belong to this context.

Environment

  • p5.js Version: 1.7.x Beta (cc @davepagurek)
  • Browser: Chrome 116 (Error observed), Firefox 116.0.3 (No error observed)
  • OS: Windows 10

Contributor guide