Freeing geometry and then drawing with WebGL immediate mode has errors

[davepagurek]

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build Process
• Unit Testing
• Internalization
• Friendly Errors
• Other (specify if possible)

p5.js version

main branch

Web browser and version

Firefox 114

Operating System

MacOS 12.5.1

Steps to reproduce this

Steps:

1. Create a shape with buildGeometry
2. Draw it with model()
3. Free the resources with freeGeometry()
4. Draw a shape with immediate mode

Not all the fills work correctly, and we get the following warning:

https://editor.p5js.org/davepagurek/sketches/ue3faHixD

Output: (the expected output is the same shape twice)

It looks like this is because we are leaving some attributes bound to buffers from the geometry, and once we free the resources, they are no longer valid.

Snippet:

let geom

const drawShape = () => {
  beginShape()
  for (let i = 0; i < 10; i++) {
    const angle = i/10 * TWO_PI
    vertex(100*cos(angle), 100*sin(angle))
  }
  beginContour()
  for (let i = 0; i < 10; i++) {
    const angle = -i/10 * TWO_PI
    vertex(20*cos(angle), 20*sin(angle))
  }
  endContour()
  endShape(CLOSE)
}

function setup() {
  createCanvas(400, 400, WEBGL)
  geom = buildGeometry(drawShape)
}

function draw() {
  background('red')
  
  fill('white')
  stroke('black')
  
  model(geom)
  freeGeometry(geom)
  
  translate(0, 100)
  
  drawShape()
  
  noLoop()
}