@gjsify/webgl 0.1.1 → 0.1.3

package/lib/esm/canvas-webgl-widget.js

@@ -3,6 +3,7 @@ import GLib from "gi://GLib?version=2.0";
 import Gtk from "gi://Gtk?version=4.0";
 import { HTMLCanvasElement as OurHTMLCanvasElement } from "./html-canvas-element.js";
 import { attachEventControllers } from "@gjsify/event-bridge";
+import { Event } from "@gjsify/dom-events";
 const CanvasWebGLWidget = GObject.registerClass(
   { GTypeName: "GjsifyCanvasWebGLWidget" },
   class CanvasWebGLWidget2 extends Gtk.GLArea {
@@ -26,6 +27,9 @@ const CanvasWebGLWidget = GObject.registerClass(
         this.disconnect(initId);
         this.make_current();
         this._canvas = new OurHTMLCanvasElement(this);
+        if (globalThis.document?.body) {
+          globalThis.document.body.appendChild(this._canvas);
+        }
         const gl = this._canvas.getContext("webgl");
         if (gl) {
           for (const cb of this._readyCallbacks) {
@@ -35,6 +39,14 @@ const CanvasWebGLWidget = GObject.registerClass(
         }
         return true;
       });
+      this.connect("resize", () => {
+        if (this._canvas) {
+          this._canvas.dispatchEvent(new Event("resize"));
+        }
+        if (this._frameCallback) {
+          this.requestAnimationFrame(this._frameCallback);
+        }
+      });
       this.connect("unrealize", () => {
         if (this._renderTag !== null) {
           this.disconnect(this._renderTag);

package/lib/esm/conformance/attribs.spec.js

@@ -0,0 +1,296 @@
+import { describe, it, expect, beforeEach, on } from "@gjsify/unit";
+import { makeProgram, makeTestFBO, destroyTestFBO } from "../test-utils.js";
+import { createGLSetup } from "./setup.js";
+var attribs_spec_default = async () => {
+  await on("Display", async () => {
+    const setup = createGLSetup();
+    if (!setup) {
+      console.warn("WebGL context not available \u2014 skipping conformance/attribs tests");
+      return;
+    }
+    const { gl, glArea, win } = setup;
+    glArea.make_current();
+    await describe("conformance/attribs/gl-vertex-attrib: vertexAttrib round-trip", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("vertexAttrib1f stores value in slot 0 and defaults to [x,0,0,1]", async () => {
+        gl.vertexAttrib1f(0, 5);
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v instanceof Float32Array).toBeTruthy();
+        expect(v[0]).toBe(5);
+        expect(v[1]).toBe(0);
+        expect(v[2]).toBe(0);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib2f stores two values and defaults the rest to [_,_,0,1]", async () => {
+        gl.vertexAttrib2f(0, 6, 7);
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(6);
+        expect(v[1]).toBe(7);
+        expect(v[2]).toBe(0);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib3f stores three values and defaults last to 1", async () => {
+        gl.vertexAttrib3f(0, 7, 8, 9);
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(7);
+        expect(v[1]).toBe(8);
+        expect(v[2]).toBe(9);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib4f stores all four values", async () => {
+        gl.vertexAttrib4f(0, 6, 7, 8, 9);
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(6);
+        expect(v[1]).toBe(7);
+        expect(v[2]).toBe(8);
+        expect(v[3]).toBe(9);
+      });
+      await it("vertexAttrib1fv with array round-trips correctly", async () => {
+        gl.vertexAttrib1fv(0, [1]);
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(1);
+        expect(v[1]).toBe(0);
+        expect(v[2]).toBe(0);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib1fv with Float32Array round-trips correctly", async () => {
+        gl.vertexAttrib1fv(0, new Float32Array([-1]));
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(-1);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib2fv with array round-trips correctly", async () => {
+        gl.vertexAttrib2fv(0, [1, 2]);
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(1);
+        expect(v[1]).toBe(2);
+        expect(v[2]).toBe(0);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib3fv with Float32Array round-trips correctly", async () => {
+        gl.vertexAttrib3fv(0, new Float32Array([1, -2, 3]));
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(1);
+        expect(v[1]).toBe(-2);
+        expect(v[2]).toBe(3);
+        expect(v[3]).toBe(1);
+      });
+      await it("vertexAttrib4fv with Float32Array round-trips correctly", async () => {
+        gl.vertexAttrib4fv(0, new Float32Array([1, 2, -3, 4]));
+        const v = gl.getVertexAttrib(0, gl.CURRENT_VERTEX_ATTRIB);
+        expect(v[0]).toBe(1);
+        expect(v[1]).toBe(2);
+        expect(v[2]).toBe(-3);
+        expect(v[3]).toBe(4);
+      });
+      await it("setting attrib values generates no GL error", async () => {
+        const numAttribs = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);
+        for (let i = 0; i < numAttribs; i++) {
+          gl.vertexAttrib4f(i, i * 0.1, i * 0.2, i * 0.3, i * 0.4);
+        }
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+      });
+    });
+    await describe("conformance/attribs/gl-vertex-attrib: out-of-range index", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("getVertexAttrib with out-of-range index generates INVALID_VALUE", async () => {
+        const numAttribs = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);
+        gl.getVertexAttrib(numAttribs, gl.CURRENT_VERTEX_ATTRIB);
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+      });
+      await it("vertexAttrib1fv with out-of-range index generates INVALID_VALUE", async () => {
+        const numAttribs = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);
+        gl.vertexAttrib1fv(numAttribs, [1]);
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+      });
+      await it("vertexAttrib4fv with out-of-range index generates INVALID_VALUE", async () => {
+        const numAttribs = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);
+        gl.vertexAttrib4fv(numAttribs, new Float32Array([1, 2, 3, 4]));
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+      });
+      await it("vertexAttrib4f with out-of-range index generates INVALID_VALUE", async () => {
+        const numAttribs = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);
+        gl.vertexAttrib4f(numAttribs, 1, 2, 3, 4);
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+      });
+    });
+    await describe("conformance/attribs/gl-enable-vertex-attrib", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("drawArrays with enabled attrib that has no buffer bound generates INVALID_OPERATION", async () => {
+        const vsSrc = `attribute vec4 vPosition; void main() { gl_Position = vPosition; }`;
+        const fsSrc = `void main() { gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); }`;
+        const prog = makeProgram(gl, vsSrc, fsSrc);
+        gl.useProgram(prog);
+        const vertexObject = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject);
+        gl.bufferData(
+          gl.ARRAY_BUFFER,
+          new Float32Array([0, 0.5, 0, -0.5, -0.5, 0, 0.5, -0.5, 0]),
+          gl.STATIC_DRAW
+        );
+        gl.enableVertexAttribArray(0);
+        gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
+        gl.enableVertexAttribArray(3);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.drawArrays(gl.TRIANGLES, 0, 3);
+        expect(gl.getError()).toBe(gl.INVALID_OPERATION);
+        gl.disableVertexAttribArray(0);
+        gl.disableVertexAttribArray(3);
+        gl.deleteBuffer(vertexObject);
+        gl.deleteProgram(prog);
+      });
+    });
+    await describe("conformance/attribs/gl-bindAttribLocation-repeated", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("getAttribLocation returns the bound location after linkProgram", async () => {
+        const vsSrc = `attribute vec4 vPosition; void main() { gl_Position = vPosition; }`;
+        const fsSrc = `void main() { gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); }`;
+        function setup2(attribIndex) {
+          const vs = gl.createShader(gl.VERTEX_SHADER);
+          gl.shaderSource(vs, vsSrc);
+          gl.compileShader(vs);
+          const fs = gl.createShader(gl.FRAGMENT_SHADER);
+          gl.shaderSource(fs, fsSrc);
+          gl.compileShader(fs);
+          const prog = gl.createProgram();
+          gl.attachShader(prog, vs);
+          gl.attachShader(prog, fs);
+          gl.bindAttribLocation(prog, attribIndex, "vPosition");
+          gl.linkProgram(prog);
+          expect(gl.getProgramParameter(prog, gl.LINK_STATUS)).toBeTruthy();
+          expect(gl.getAttribLocation(prog, "vPosition")).toBe(attribIndex);
+          gl.deleteShader(vs);
+          gl.deleteShader(fs);
+          return prog;
+        }
+        const p0 = setup2(0);
+        const p3 = setup2(3);
+        const p1 = setup2(1);
+        const p3b = setup2(3);
+        gl.deleteProgram(p0);
+        gl.deleteProgram(p3);
+        gl.deleteProgram(p1);
+        gl.deleteProgram(p3b);
+      });
+    });
+    await describe("conformance/attribs/attribute-weirdness", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      const W = 2, H = 2;
+      const VDATA = new Int16Array([
+        0,
+        0,
+        0,
+        0,
+        4,
+        0,
+        1,
+        0,
+        0,
+        4,
+        0,
+        1,
+        4,
+        4,
+        1,
+        1
+      ]);
+      function renderAttribWeirdness(flipAttributes, flipLocations) {
+        const fbo = makeTestFBO(gl, W, H);
+        const attrs = [
+          "attribute vec2 a_pos;",
+          "attribute vec2 a_texture_pos;"
+        ];
+        if (flipAttributes) attrs.reverse();
+        const vsSrc = [
+          "precision mediump float;",
+          attrs[0],
+          attrs[1],
+          "varying vec2 v_pos0;",
+          "void main() {",
+          "  v_pos0 = a_texture_pos;",
+          "  gl_Position = vec4(a_pos - 1.0, 0.0, 1.0);",
+          "}"
+        ].join("\n");
+        const fsSrc = [
+          "precision mediump float;",
+          "varying vec2 v_pos0;",
+          "void main() {",
+          "  gl_FragColor = vec4(v_pos0.x, 0.0, 0.0, 1.0);",
+          "}"
+        ].join("\n");
+        gl.clearColor(0, 0, 0, 0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        const prog = makeProgram(gl, vsSrc, fsSrc);
+        gl.useProgram(prog);
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, VDATA, gl.STATIC_DRAW);
+        let aPos = gl.getAttribLocation(prog, "a_pos");
+        let aTexPos = gl.getAttribLocation(prog, "a_texture_pos");
+        gl.enableVertexAttribArray(aPos);
+        gl.enableVertexAttribArray(aTexPos);
+        if (flipLocations) {
+          const tmp = aPos;
+          aPos = aTexPos;
+          aTexPos = tmp;
+        }
+        gl.vertexAttribPointer(aPos, 2, gl.SHORT, false, 8, 0);
+        gl.vertexAttribPointer(aTexPos, 2, gl.SHORT, false, 8, 4);
+        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+        const pixels = new Uint8Array(W * H * 4);
+        gl.readPixels(0, 0, W, H, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
+        destroyTestFBO(gl, fbo);
+        return pixels;
+      }
+      await it("normal order: all alpha values are 255 (quad covers canvas)", async () => {
+        const pixels = renderAttribWeirdness(false, false);
+        let ok = true;
+        for (let i = 3; i < W * H * 4; i += 4) {
+          if (pixels[i] !== 255) {
+            ok = false;
+            break;
+          }
+        }
+        expect(ok).toBe(true);
+      });
+      await it("flipped attribute declarations: all alpha values are still 255", async () => {
+        const pixels = renderAttribWeirdness(true, false);
+        let ok = true;
+        for (let i = 3; i < W * H * 4; i += 4) {
+          if (pixels[i] !== 255) {
+            ok = false;
+            break;
+          }
+        }
+        expect(ok).toBe(true);
+      });
+      await it("swapped location assignments: quad does not cover canvas (some alpha \u2260 255)", async () => {
+        const pixels = renderAttribWeirdness(false, true);
+        let hasNonAlpha = false;
+        for (let i = 3; i < W * H * 4; i += 4) {
+          if (pixels[i] !== 255) {
+            hasNonAlpha = true;
+            break;
+          }
+        }
+        expect(hasNonAlpha).toBe(true);
+      });
+    });
+    win.destroy();
+  });
+};
+export {
+  attribs_spec_default as default
+};

package/lib/esm/conformance/buffers.spec.js

@@ -0,0 +1,203 @@
+import { describe, it, expect, beforeEach, on } from "@gjsify/unit";
+import { makeProgram, makeTestFBO, destroyTestFBO, readPixel, pixelClose } from "../test-utils.js";
+import { createGLSetup } from "./setup.js";
+var buffers_spec_default = async () => {
+  await on("Display", async () => {
+    const setup = createGLSetup();
+    if (!setup) {
+      console.warn("WebGL context not available \u2014 skipping conformance/buffers tests");
+      return;
+    }
+    const { gl, glArea, win } = setup;
+    glArea.make_current();
+    await describe("conformance/buffers/buffer-bind-test", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("should be able to bind and unbind an ARRAY_BUFFER", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.deleteBuffer(buf);
+      });
+      await it("should be able to bind and unbind an ELEMENT_ARRAY_BUFFER", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, buf);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.deleteBuffer(buf);
+      });
+      await it("binding ARRAY_BUFFER to ELEMENT_ARRAY_BUFFER target should generate INVALID_OPERATION", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, buf);
+        expect(gl.getError()).toBe(gl.INVALID_OPERATION);
+        gl.deleteBuffer(buf);
+      });
+      await it("binding ELEMENT_ARRAY_BUFFER to ARRAY_BUFFER target should generate INVALID_OPERATION", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, buf);
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        expect(gl.getError()).toBe(gl.INVALID_OPERATION);
+        gl.deleteBuffer(buf);
+      });
+    });
+    await describe("conformance/buffers/buffer-data-and-buffer-sub-data", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("bufferData with no buffer bound generates INVALID_OPERATION", async () => {
+        gl.bufferData(gl.ARRAY_BUFFER, 4, gl.STATIC_DRAW);
+        expect(gl.getError()).toBe(gl.INVALID_OPERATION);
+      });
+      await it("bufferData with negative size generates INVALID_VALUE", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.getError();
+        gl.bufferData(gl.ARRAY_BUFFER, -4, gl.STATIC_DRAW);
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferData with null data generates INVALID_VALUE", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.getError();
+        gl.bufferData(gl.ARRAY_BUFFER, null, gl.STATIC_DRAW);
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferData with size 0 succeeds and sets buffer size to 0", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, 0, gl.STATIC_DRAW);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        expect(gl.getBufferParameter(gl.ARRAY_BUFFER, gl.BUFFER_SIZE)).toBe(0);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferData with ArrayBuffer sets correct buffer size", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, new ArrayBuffer(4), gl.STATIC_DRAW);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        expect(gl.getBufferParameter(gl.ARRAY_BUFFER, gl.BUFFER_SIZE)).toBe(4);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferData with numeric size 4 sets buffer size to 4", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, 4, gl.STATIC_DRAW);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        expect(gl.getBufferParameter(gl.ARRAY_BUFFER, gl.BUFFER_SIZE)).toBe(4);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferSubData before bufferData generates INVALID_VALUE", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferSubData(gl.ARRAY_BUFFER, 0, new ArrayBuffer(1));
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferSubData with negative offset generates INVALID_VALUE", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, 128, gl.STATIC_DRAW);
+        gl.getError();
+        gl.bufferSubData(gl.ARRAY_BUFFER, -10, new ArrayBuffer(64));
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferSubData that overflows buffer generates INVALID_VALUE", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, 128, gl.STATIC_DRAW);
+        gl.getError();
+        gl.bufferSubData(gl.ARRAY_BUFFER, 65, new ArrayBuffer(64));
+        expect(gl.getError()).toBe(gl.INVALID_VALUE);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferSubData within bounds succeeds", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, 128, gl.STATIC_DRAW);
+        gl.getError();
+        gl.bufferSubData(gl.ARRAY_BUFFER, 10, new ArrayBuffer(64));
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.bufferSubData(gl.ARRAY_BUFFER, 10, new Float32Array(0));
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+      await it("bufferSubData with non-ArrayBuffer throws TypeError", async () => {
+        const buf = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
+        gl.bufferData(gl.ARRAY_BUFFER, 128, gl.STATIC_DRAW);
+        gl.getError();
+        expect(() => gl.bufferSubData(gl.ARRAY_BUFFER, 0, 42)).toThrow();
+        expect(() => gl.bufferSubData(gl.ARRAY_BUFFER, 0, "5.5")).toThrow();
+        expect(() => gl.bufferSubData(gl.ARRAY_BUFFER, 10, null)).toThrow();
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+        gl.deleteBuffer(buf);
+      });
+    });
+    await describe("conformance/buffers/element-array-buffer-delete-recreate", async () => {
+      beforeEach(async () => {
+        glArea.make_current();
+      });
+      await it("drawElements succeeds after deleting and recreating the element array buffer", async () => {
+        const vsSrc = `attribute vec2 position; void main() { gl_Position = vec4(position, 0.0, 1.0); }`;
+        const fsSrc = `precision mediump float; void main() { gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0); }`;
+        const prog = makeProgram(gl, vsSrc, fsSrc);
+        gl.useProgram(prog);
+        const fbo = makeTestFBO(gl, 2, 2);
+        const vertexBuffer = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
+        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
+          -1,
+          -1,
+          1,
+          -1,
+          -1,
+          1,
+          1,
+          1
+        ]), gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(0);
+        gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 0, 0);
+        let indexBuffer = gl.createBuffer();
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
+        gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint8Array([0, 1, 2, 3]), gl.STATIC_DRAW);
+        gl.deleteBuffer(indexBuffer);
+        indexBuffer = gl.createBuffer();
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
+        gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint8Array([0, 1, 2, 3]), gl.STATIC_DRAW);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        gl.drawElements(gl.TRIANGLE_STRIP, 4, gl.UNSIGNED_BYTE, 0);
+        expect(gl.getError()).toBe(gl.NO_ERROR);
+        const pixel = readPixel(gl, 1, 1);
+        expect(pixelClose(pixel, [0, 255, 0, 255])).toBeTruthy();
+        destroyTestFBO(gl, fbo);
+        gl.deleteBuffer(vertexBuffer);
+        gl.deleteBuffer(indexBuffer);
+        gl.deleteProgram(prog);
+      });
+    });
+    win.destroy();
+  });
+};
+export {
+  buffers_spec_default as default
+};