Get some trounble when using drawBuffers in WebGL2
<p>I want to combine my deferred renderer and forward renderer together. In order to share the same depth buffer, I use a single frame buffer object with 4 color attachments, COLOR_ATTACHMENT0-2 for G-buffer rendering, COLOR_ATTACHMENT3 for deferred shading and forward rendering, here's the pesudo code:</p>

<pre><code>//**Gbufffer part**
Bind G-Buffer FBO
gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1, gl.COLOR_ATTACHMENT2]);
draw the G buffer

//**Lighting part**
Bind Lighting buffer FBO

//**Shading part**
Bind G-Buffer FBO
gl.drawBuffers([gl.COLOR_ATTACHMENT3]);

//**Forward rendring part**
//Still use the G-Buffer FBO and COLOR_ATTACHMENT3
draw forward material
</code></pre>

<p>when using this, I got a mistake in firefox:</p>

<p><strong>Error: WebGL: drawBuffers: <code>buffers[i]</code> must be NONE or COLOR_ATTACHMENTi.</strong></p>

<p>when lauching in Chrome, I got this:</p>

<p><strong>FrameBufferObject.ts:151 WebGL: INVALID_OPERATION: drawBuffers: COLOR_ATTACHMENTi_EXT or NONE</strong></p>

<p>What's wrong with my code? This really confuse me...THX.</p>