﻿<!--
Copyright (c) 2019 The Khronos Group Inc.
Use of this source code is governed by an MIT-style license that can be
found in the LICENSE.txt file.
-->

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WebGL Draw Buffers Conformance Tests</title>
<link rel="stylesheet" href="../../resources/js-test-style.css"/>
<script src="../../js/js-test-pre.js"></script>
<script src="../../js/webgl-test-utils.js"></script>
<script src="../../js/tests/webgl-draw-buffers-utils.js"></script>
</head>
<body>
<div id="description"></div>
<canvas id="canvas" width="64" height="64"> </canvas>
<div id="console"></div>
<script id="vshaderESSL3" type="x-shader/x-vertex">#version 300 es
in vec4 a_position;
void main() {
    gl_Position = a_position;
}
</script>
<script id="vshaderESSL1" type="x-shader/x-vertex">
attribute vec4 a_position;
void main() {
    gl_Position = a_position;
}
</script>
<script id="fshader" type="x-shader/x-fragment">#version 300 es
precision mediump float;
uniform vec4 u_colors[$(numDrawingBuffers)];

// Only one out variable - does not need explicit output layout (ESSL 3 section 4.3.8.2)
out vec4 my_FragData[$(numDrawingBuffers)];
void main() {
$(assignUColorsToFragData)
}
</script>
<script id="fshaderDiscard" type="x-shader/x-fragment">#version 300 es
precision mediump float;
uniform vec4 u_colors[$(numDrawingBuffers)];
uniform float u_zero;

// Only one out variable - does not need explicit output layout (ESSL 3 section 4.3.8.2)
out vec4 my_FragData[$(numDrawingBuffers)];
void main() {
$(assignUColorsToFragData)
    if (u_zero < 1.0) {
        discard;
    }
}
</script>
<script id="fshaderRed" type="x-shader/x-fragment">#version 300 es
precision mediump float;

out vec4 my_FragColor;
void main() {
    my_FragColor = vec4(1, 0, 0, 1);
}
</script>
<script id="fshaderBlueESSL1" type="x-shader/x-fragment">
precision mediump float;

void main() {
    gl_FragColor = vec4(0, 0, 1, 1);
}
</script>
<script id="fshaderBuiltInConstEnabled" type="x-shader/x-fragment">#version 300 es
precision mediump float;

out vec4 my_FragColor;
void main() {
    my_FragColor = (gl_MaxDrawBuffers == $(numDrawingBuffers)) ? vec4(0, 1, 0, 1) : vec4(1, 0, 0, 1);
}
</script>
<script>
"use strict";
description("This test verifies the functionality of Multiple Render Targets.");

debug("");

var wtu = WebGLTestUtils;
var canvas = document.getElementById("canvas");
var gl = wtu.create3DContext(canvas, null, 2);
var drawBuffersUtils;
let fb;

if (!gl) {
  testFailed("WebGL context does not exist");
} else {
  testPassed("WebGL context exists");
  drawBuffersUtils = WebGLDrawBuffersUtils(gl);

  if (testParameters()) {
    runShadersTest();
    runAttachmentTest();
    runDrawTests();
  }

  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");
}

function createDrawBuffersProgram(scriptId, sub) {
  var fsource = wtu.getScript(scriptId);
  fsource = wtu.replaceParams(fsource, sub);
  return wtu.setupProgram(gl, ["vshaderESSL3", fsource], ["a_position"], undefined, true);
}

function runShadersTest() {
  debug("");
  debug("test shaders");

  var sub = {numDrawingBuffers: gl.getParameter(gl.MAX_DRAW_BUFFERS)};
  var program = createDrawBuffersProgram("fshaderBuiltInConstEnabled", sub);
  wtu.setupUnitQuad(gl);
  wtu.clearAndDrawUnitQuad(gl);
  wtu.checkCanvas(gl, [0, 255, 0, 255], "should be green");
  gl.deleteProgram(program);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");
}

function makeArray(size, value) {
  var array = []
  for (var ii = 0; ii < size; ++ii) {
    array.push(value);
  }
  return array;
}

function runAttachmentTest() {
  debug("");
  debug("test attachment enabled");

  var maxDrawingBuffers = gl.getParameter(gl.MAX_DRAW_BUFFERS);
  var maxColorAttachments = gl.getParameter(gl.MAX_COLOR_ATTACHMENTS);

  var tex = gl.createTexture();
  fb = gl.createFramebuffer();
  gl.bindTexture(gl.TEXTURE_2D, tex);
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + maxColorAttachments, gl.TEXTURE_2D, tex, 0);
  wtu.glErrorShouldBe(gl, gl.INVALID_ENUM, "should not be able to attach pass the max attachment point: gl.COLOR_ATTACHMENT0 + " + maxColorAttachments);
  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + maxColorAttachments - 1, gl.TEXTURE_2D, tex, 0);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be able to attach to the max attachment point: gl.COLOR_ATTACHMENT0 + " + (maxColorAttachments - 1));
  gl.drawBuffers(makeArray(maxDrawingBuffers, gl.NONE));
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be able to call drawBuffers with array NONE of size " + maxColorAttachments);
  var bufs = drawBuffersUtils.makeColorAttachmentArray(maxDrawingBuffers);
  gl.drawBuffers(bufs);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be able to call drawBuffers with array attachments of size " + maxColorAttachments);
  bufs[0] = gl.NONE;
  gl.drawBuffers(bufs);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be able to call drawBuffers with mixed array attachments of size " + maxColorAttachments);
  if (maxDrawingBuffers > 1) {
    bufs[0] = gl.COLOR_ATTACHMENT1;
    bufs[1] = gl.COLOR_ATTACHMENT0;
    gl.drawBuffers(bufs);
    wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "should not be able to call drawBuffers with out of order attachments of size " + maxColorAttachments);
    var bufs = drawBuffersUtils.makeColorAttachmentArray(Math.floor(maxDrawingBuffers / 2));
    wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be able to call drawBuffers with short array of attachments of size " + bufs.length);
  }

  gl.deleteFramebuffer(fb);
  gl.deleteTexture(tex);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");

  debug("Testing drawBuffers and getParameter with bindFramebuffer, without drawing.");
  fb = gl.createFramebuffer();
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0)", "gl.COLOR_ATTACHMENT0");
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0+1)", "gl.NONE");
  wtu.shouldGenerateGLError(gl, gl.NO_ERROR, "gl.drawBuffers([gl.NONE])");
  gl.bindFramebuffer(gl.FRAMEBUFFER, null);
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0)", "gl.BACK");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0)", "gl.NONE");

  wtu.shouldGenerateGLError(gl, gl.NO_ERROR, "gl.drawBuffers([gl.NONE,gl.COLOR_ATTACHMENT0+1])");
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0)", "gl.NONE");
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0+1)", "gl.COLOR_ATTACHMENT0+1");

  wtu.shouldGenerateGLError(gl, gl.NO_ERROR, "gl.drawBuffers([gl.COLOR_ATTACHMENT0,gl.COLOR_ATTACHMENT0+1])");
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0)", "gl.COLOR_ATTACHMENT0");
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0+1)", "gl.COLOR_ATTACHMENT0+1");

  wtu.shouldGenerateGLError(gl, gl.NO_ERROR, "gl.deleteFramebuffer(fb)");
  shouldBe("gl.getParameter(gl.DRAW_BUFFER0)", "gl.BACK");
}

function makeColorByIndex(index) {
  var low = (index - 1) % 15 + 1;
  var high = (index - 1) / 15;

  var zeroOrOne = function(v) {
    return v ? 1 : 0;
  };

  var oneOrTwo = function(v) {
    return v ? 2 : 1;
  }

  var makeComponent = function(b0, b1, b2) {
    return Math.floor(255 * zeroOrOne(b0) / oneOrTwo(b1) / oneOrTwo(b2));
  };
  return [
    makeComponent(low & (1 << 0), high & (1 << 0), high & (1 << 4)),
    makeComponent(low & (1 << 1), high & (1 << 1), high & (1 << 5)),
    makeComponent(low & (1 << 2), high & (1 << 2), high & (1 << 6)),
    makeComponent(low & (1 << 3), high & (1 << 3), high & (1 << 7)),
  ];
}

function runDrawTests() {
  debug("");
  debug("--------- draw tests -----------");
  var fb = gl.createFramebuffer();
  var fb2 = gl.createFramebuffer();
  var halfFB1 = gl.createFramebuffer();
  var halfFB2 = gl.createFramebuffer();
  var endsFB = gl.createFramebuffer();
  var middleFB = gl.createFramebuffer();

  var maxDrawingBuffers = gl.getParameter(gl.MAX_DRAW_BUFFERS);
  var maxUsable = drawBuffersUtils.getMaxUsableColorAttachments();
  var half = Math.floor(maxUsable / 2);
  var bufs = drawBuffersUtils.makeColorAttachmentArray(maxUsable);
  var nones = makeArray(maxUsable, gl.NONE);

  [fb, fb2, halfFB1, halfFB2, endsFB, middleFB].forEach(function(fbo) {
    gl.bindFramebuffer(gl.FRAMEBUFFER, fbo);
    gl.drawBuffers(bufs);
  });

  var checkProgram = wtu.setupTexturedQuad(gl);
  var redProgram = wtu.setupProgram(gl, ["vshaderESSL3", "fshaderRed"], ["a_position"]);
  var blueProgramESSL1 = wtu.setupProgram(gl, ["vshaderESSL1", "fshaderBlueESSL1"], ["a_position"]);

  var assignCode = [];
  for (var i = 0; i < maxDrawingBuffers; ++i) {
    assignCode.push("    my_FragData[" + i + "] = u_colors[" + i + "];");
  }

  var drawProgram = createDrawBuffersProgram("fshader",
      {numDrawingBuffers: maxDrawingBuffers, assignUColorsToFragData: assignCode.join("\n")});
  var width = 64;
  var height = 64;
  var attachments = [];
  // Makes 6 framebuffers.
  // fb and fb2 have all the attachments.
  // halfFB1 has the first half of the attachments
  // halfFB2 has the second half of the attachments
  // endsFB has the first and last attachments
  // middleFB has all but the first and last attachments
  for (var ii = 0; ii < maxUsable; ++ii) {
    var tex = gl.createTexture();
    gl.bindTexture(gl.TEXTURE_2D, tex);
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
    gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + ii, gl.TEXTURE_2D, tex, 0);
    gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + ii, gl.TEXTURE_2D, tex, 0);
    gl.bindFramebuffer(gl.FRAMEBUFFER, ii < half ? halfFB1 : halfFB2);
    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + ii, gl.TEXTURE_2D, tex, 0);
    gl.bindFramebuffer(gl.FRAMEBUFFER, (ii == 0 || ii == (maxUsable - 1)) ? endsFB : middleFB);
    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + ii, gl.TEXTURE_2D, tex, 0);
    var location = gl.getUniformLocation(drawProgram, "u_colors[" + ii + "]");
    var color = makeColorByIndex(ii + 1);
    var floatColor = [color[0] / 255, color[1] / 255, color[2] / 255, color[3] / 255];
    gl.uniform4fv(location, floatColor);
    attachments.push({
      texture: tex,
      color: color
    });
  }
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  shouldBe("gl.checkFramebufferStatus(gl.FRAMEBUFFER)", "gl.FRAMEBUFFER_COMPLETE");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  shouldBe("gl.checkFramebufferStatus(gl.FRAMEBUFFER)", "gl.FRAMEBUFFER_COMPLETE");

  var drawAndCheckAttachments = function(testFB, msg, testFn) {
    debug("test clearing " + msg);

    gl.bindFramebuffer(gl.FRAMEBUFFER, testFB);

    attachments.forEach(function(attachment, index) {
      debug("attachment: " + index + " = " + wtu.glEnumToString(gl, gl.getParameter(gl.DRAW_BUFFER0 + index)) +
            ", " + wtu.glEnumToString(gl, gl.getFramebufferAttachmentParameter(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0 + index, gl.FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE)));
    });

    if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE) {
      debug("framebuffer not complete");
      debug("");
      return;
    }

    // Clear all the attachments
    gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
    gl.clearColor(0, 0, 0, 0);
    gl.clear(gl.COLOR_BUFFER_BIT);
    //drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
    //  return [0, 0, 0, 0];
    //});
    //debug("--");

    // Clear some attachments using testFB
    gl.bindFramebuffer(gl.FRAMEBUFFER, testFB);

    gl.clearColor(0, 1, 0, 1);
    gl.clear(gl.COLOR_BUFFER_BIT);
    drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
      return testFn(attachment, index) ? [0, 255, 0, 255] : [0, 0, 0, 0];
    });

    debug("test drawing to " + msg);

    // Draw to some attachments using testFB
    gl.useProgram(drawProgram);
    gl.bindFramebuffer(gl.FRAMEBUFFER, testFB);
    wtu.drawUnitQuad(gl);

    drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
      return testFn(attachment, index) ? attachment.color : [0, 0, 0, 0];
    });
  };

  gl.useProgram(drawProgram);
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  gl.drawBuffers(bufs);
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.drawBuffers(bufs);

  wtu.drawUnitQuad(gl);

  debug("test that each texture got the correct color.");

  drawBuffersUtils.checkAttachmentsForColor(attachments);

  debug("test clearing clears all the textures");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.clearColor(0, 1, 0, 1);
  gl.clear(gl.COLOR_BUFFER_BIT);

  drawBuffersUtils.checkAttachmentsForColor(attachments, [0, 255, 0, 255]);

  debug("test that NONE draws nothing");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.drawBuffers(nones);
  gl.useProgram(redProgram);
  wtu.clearAndDrawUnitQuad(gl);

  drawBuffersUtils.checkAttachmentsForColor(attachments, [0, 255, 0, 255]);

  // GLES3 spec section 3.9.2 Shader Outputs
  debug("test that gl_FragColor only writes to color number zero");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.drawBuffers(bufs);
  gl.useProgram(blueProgramESSL1);

  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");
  wtu.drawUnitQuad(gl);
  wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "Active draw buffers with missing frag outputs.");
  gl.enable(gl.RASTERIZER_DISCARD);
  wtu.drawUnitQuad(gl);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors when RASTERIZER_DISCARD is enabled.");
  gl.disable(gl.RASTERIZER_DISCARD);
  gl.colorMask(false, false, false, false);
  wtu.drawUnitQuad(gl);
  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors when all 4 channels of color mask are disabled.");
  gl.colorMask(false, true, false, false);
  wtu.drawUnitQuad(gl);
  wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "partially diabled color mask shall have no impact.");
  gl.colorMask(true, true, true, true);

  gl.drawBuffers([gl.COLOR_ATTACHMENT0]);
  wtu.drawUnitQuad(gl);

  drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
    return (index == 0) ? [0, 0, 255, 255] : [0, 255, 0, 255];
  });

  // If there is only a single output, the location defaults to zero if not specified.
  // See GLSL ES Spec 3.00.4, Section 4.3.8.2, Output Layout Qualifiers.
  debug("test that an OpenGL ES Shading Language 3.00 shader with a single output color defaults to color number zero");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.drawBuffers(bufs);
  gl.useProgram(redProgram);

  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");
  wtu.drawUnitQuad(gl);
  wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "Active draw buffers with missing frag outputs.");

  gl.drawBuffers([gl.COLOR_ATTACHMENT0]);
  wtu.drawUnitQuad(gl);

  drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
    return (index == 0) ? [255, 0, 0, 255] : [0, 255, 0, 255];
  });

  if (maxUsable > 1) {
    // Prepare for following tests by clearing all attachments to red.
    debug("prepare by clearing all attachments to red");
    gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
    gl.drawBuffers(bufs);
    gl.clearColor(1, 0, 0, 1);
    gl.clear(gl.COLOR_BUFFER_BIT);
    drawBuffersUtils.checkAttachmentsForColor(attachments, [255, 0, 0, 255]);

    var bufs1 = drawBuffersUtils.makeColorAttachmentArray(maxUsable);
    var bufs2 = drawBuffersUtils.makeColorAttachmentArray(maxUsable);
    for (var ii = 0; ii < maxUsable; ++ii) {
      if (ii < half) {
        bufs1[ii] = gl.NONE;
      } else {
        bufs2[ii] = gl.NONE;
      }
    }

    debug("test setting first half to NONE and clearing");

    gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
    gl.drawBuffers(bufs1);
    gl.clearColor(0, 1, 0, 1);
    gl.clear(gl.COLOR_BUFFER_BIT);

    drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
      return index < half ? [255, 0, 0, 255] : [0, 255, 0, 255];
    });

    debug("test setting first half to NONE and drawing");

    gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
    gl.useProgram(drawProgram);
    wtu.drawUnitQuad(gl);

    drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
      return index < half ? [255, 0, 0, 255] : attachment.color;
    });

    debug("test setting second half to NONE and clearing");

    gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
    gl.drawBuffers(bufs);
    gl.clearColor(1, 0, 0, 1);
    gl.clear(gl.COLOR_BUFFER_BIT);
    gl.drawBuffers(bufs2);
    gl.clearColor(0, 0, 1, 1);
    gl.clear(gl.COLOR_BUFFER_BIT);
    drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
      return index < half ? [0, 0, 255, 255] : [255, 0, 0, 255];
    });

    debug("test setting second half to NONE and drawing");

    gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
    gl.useProgram(drawProgram);
    wtu.drawUnitQuad(gl);

    drawBuffersUtils.checkAttachmentsForColorFn(attachments, function(attachment, index) {
      return index < half ? attachment.color : [255, 0, 0, 255];
    });

    gl.bindFramebuffer(gl.FRAMEBUFFER, halfFB1);
    gl.drawBuffers(bufs);
    drawAndCheckAttachments(
      halfFB1, "framebuffer that only has first half of attachments",
      function(attachment, index) {
        return index < half;
      });

    gl.bindFramebuffer(gl.FRAMEBUFFER, halfFB2);
    gl.drawBuffers(bufs);
    drawAndCheckAttachments(
      halfFB2, "framebuffer that only has second half of attachments",
      function(attachment, index) {
        return index >= half;
      });

    if (maxUsable > 2) {
      gl.bindFramebuffer(gl.FRAMEBUFFER, endsFB);
      gl.drawBuffers(bufs);
      drawAndCheckAttachments(
        endsFB, "framebuffer that only has first and last attachments",
        function(attachment, index) {
          return index == 0 || index == (maxUsable - 1);
        });

      gl.bindFramebuffer(gl.FRAMEBUFFER, middleFB);
      gl.drawBuffers(bufs);
      drawAndCheckAttachments(
        middleFB,
        "framebuffer that has all but the first and last attachments",
        function(attachment, index) {
          return index != 0 && index != (maxUsable - 1);
        });
    }
  }

  debug("test switching between fbos keeps drawbuffer state");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  gl.drawBuffers(nones);

  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.drawBuffers(bufs);
  gl.clearColor(1, 0, 0, 1);
  gl.clear(gl.COLOR_BUFFER_BIT);
  drawBuffersUtils.checkAttachmentsForColor(attachments, [255, 0, 0, 255]);

  gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  gl.useProgram(drawProgram);
  wtu.drawUnitQuad(gl);
  drawBuffersUtils.checkAttachmentsForColor(attachments, [255, 0, 0, 255]);

  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.useProgram(drawProgram);
  wtu.drawUnitQuad(gl);
  drawBuffersUtils.checkAttachmentsForColor(attachments);

  debug("test that none of the attachments are written in case the fragment shader discards");
  var discardProgram = createDrawBuffersProgram("fshaderDiscard",
      {numDrawingBuffers: maxDrawingBuffers, assignUColorsToFragData: assignCode.join("\n")});
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.drawBuffers(bufs);
  gl.clearColor(0, 0, 0, 0);
  gl.clear(gl.COLOR_BUFFER_BIT);
  gl.useProgram(discardProgram);
  wtu.drawUnitQuad(gl);
  drawBuffersUtils.checkAttachmentsForColor(attachments, [0, 0, 0, 0]);

  debug("test queries");
  debug("check framebuffer with all attachments on");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  for (var ii = 0; ii < maxUsable; ++ii) {
    shouldBe("gl.getParameter(gl.DRAW_BUFFER0 + " + ii + ")", "gl.COLOR_ATTACHMENT0 + " + ii);
  }

  debug("check framebuffer with all attachments off");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  for (var ii = 0; ii < maxUsable; ++ii) {
    shouldBe("gl.getParameter(gl.DRAW_BUFFER0 + " + ii + ")", "gl.NONE");
  }

  // WebGL generates FRAMEBUFFER_INCOMPLETE_DIMENSIONS when attached images have different sizes.
  // This behavior differs from GLES 3.
  debug("");
  debug("test attachment size mis-match");
  gl.bindTexture(gl.TEXTURE_2D, attachments[0].texture);
  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width * 2, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  shouldBeTrue("gl.checkFramebufferStatus(gl.FRAMEBUFFER) == gl.FRAMEBUFFER_INCOMPLETE_DIMENSIONS");
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  shouldBeTrue("gl.checkFramebufferStatus(gl.FRAMEBUFFER) == gl.FRAMEBUFFER_INCOMPLETE_DIMENSIONS");

  // TODO: Rendering when framebuffer attachments have mismatched size should be tested, maybe in a separate test.

  gl.deleteFramebuffer(fb);
  gl.deleteFramebuffer(fb2);
  gl.deleteFramebuffer(halfFB1);
  gl.deleteFramebuffer(halfFB2);
  attachments.forEach(function(attachment) {
    gl.deleteTexture(attachment.texture);
  });
  gl.deleteProgram(checkProgram);
  gl.deleteProgram(redProgram);
  gl.deleteProgram(drawProgram);
}

function testParameters() {
  debug("");
  debug("check that MAX_DRAW_BUFFERS and MAX_COLOR_ATTACHMENTS are valid");
  var maxDrawBuffers = gl.getParameter(gl.MAX_DRAW_BUFFERS);
  var maxColorAttachments = gl.getParameter(gl.MAX_COLOR_ATTACHMENTS);
  debug("MAX_DRAW_BUFFERS = " + maxDrawBuffers);
  debug("MAX_COLOR_ATTACHMENTS = " + maxColorAttachments);
  if (maxDrawBuffers != maxColorAttachments) {
    testFailed("MAX_DRAW_BUFFERS and MAX_COLOR_ATTACHMENTS should be the same");
    return false;
  }
  if (maxDrawBuffers < 4) {
    testFailed("MAX_DRAW_BUFFERS should be at least 4");
    return false;
  }
  return true;
}

debug("");
var successfullyParsed = true;
</script>
<script src="../../js/js-test-post.js"></script>

</body>
</html>
