javascript - WebGL フレームバッファが空白です

Question

次のコードを使用して、WebGL でフレームバッファを作成しました。

this.buffer = ctx.createFramebuffer();
ctx.bindFramebuffer(ctx.FRAMEBUFFER, this.buffer);

this.depthTexture = this.createTexture(ctx, ctx.DEPTH_COMPONENT, 
    ctx.DEPTH_COMPONENT, ctx.UNSIGNED_SHORT);       
ctx.framebufferTexture2D(ctx.FRAMEBUFFER, ctx.DEPTH_ATTACHMENT, 
    ctx.TEXTURE_2D, this.depthTexture, 0);


this.colourTexture = this.createTexture(ctx, ctx.RGBA, ctx.RGBA, ctx.FLOAT);        
ctx.framebufferTexture2D(ctx.FRAMEBUFFER, ctx.COLOR_ATTACHMENT0, 
    ctx.TEXTURE_2D, this.colourTexture, 0);

を使用してそれに描画します

this.ctx.useProgram(this.forwardShader.program);
this.ctx.bindFramebuffer(this.ctx.FRAMEBUFFER, this.framebuffer.buffer);
this.ctx.viewport(0, 0, this.framebuffer.size, this.framebuffer.size);
this.ctx.clear(this.ctx.COLOR_BUFFER_BIT | this.ctx.DEPTH_BUFFER_BIT);

mat4.identity(this.viewMatrix);
mat4.identity(this.modelMatrix);

this.camera.transform(this.viewMatrix);

mat4.translate(this.modelMatrix, this.modelMatrix, [0, 0, -2]);

this.mStack.pushMatrix(this.modelMatrix);

mat4.translate(this.modelMatrix, this.modelMatrix, [0, -1, 0]);
mat4.rotateX(this.modelMatrix, this.modelMatrix, -Math.PI / 2.0);

this.setShaderUniforms();
this.plane.draw(this.forwardShader);

this.mStack.popMatrix(this.modelMatrix);

this.setShaderUniforms();
this.cube.draw(this.forwardShader);

this.ctx.bindFramebuffer(this.ctx.FRAMEBUFFER, null);

を使用して結果をレンダリングします

this.ctx.useProgram(this.renderTextureShader.program);
this.ctx.viewport(0, 0, this.viewportWidth, this.viewportHeight);    
this.ctx.clear(this.ctx.COLOR_BUFFER_BIT | this.ctx.DEPTH_BUFFER_BIT);

this.renderTexture.draw(this.framebuffer.colourTexture, this.renderTextureShader);

これは完全に機能しますが、深度テクスチャをレンダリングするように変更すると、白い画面が表示されます。関連する拡張機能が有効になっていることを確認し、それらを配列に保存しました（明らかに、それらが gc された場合、バグが発生する可能性があります。私が間違っていることに関するフィードバックは素晴らしいでしょう

完全なコードは私のビットバケットにあります