<!DOCTYPE HTML>
<title>WebGL test: Hidden depth/stencil passes without a depth/stencil buffer respectively</title>
<script src='/tests/SimpleTest/SimpleTest.js'></script>
<link rel='stylesheet' href='/tests/SimpleTest/test.css'>
<script src='webgl-util.js'></script>
<body>
<script id='vs' type='x-shader/x-vertex'>
  void main(void) {
    gl_PointSize = 1.0; // Note that this is undefined if we don't write to it!
    gl_Position = vec4(vec3(0), 1);
  }
</script>

<script id='fs' type='x-shader/x-fragment'>
  precision mediump float;

  void main(void) {
    gl_FragColor = vec4(0, 1, 0, 1);
  }
</script>
<script>

function ColorString(arr) {
  return '[' + arr[0] + ', ' + arr[1] + ', ' + arr[2] + ', ' + arr[3] + ']';
}

function DrawAndCheck(gl, infoPrefix, refColorStr) {
  gl.viewport(0, 0, 1, 1);

  gl.clearColor(1, 0, 0, 1);
  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
  gl.drawArrays(gl.POINTS, 0, 1);

  var pixel = new Uint8Array(4);
  gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixel);
  var pixelStr = ColorString(pixel);

  ok(pixelStr == refColorStr, infoPrefix + pixelStr + ' should be ' + refColorStr);
}

function TestCurrent(gl, attribs, infoPrefix) {
  infoPrefix = infoPrefix + JSON.stringify(attribs) + ': ';

  var CLEAR_COLOR = ColorString([255, 0, 0, 255]);
  var DRAW_COLOR = ColorString([0, 255, 0, 255]);

  gl.disable(gl.DEPTH_TEST);
  gl.disable(gl.STENCIL_TEST);

  DrawAndCheck(gl, infoPrefix + 'initial: ', DRAW_COLOR);

  if (!attribs.depth) {
    gl.enable(gl.DEPTH_TEST);
    gl.depthFunc(gl.NEVER);

    gl.disable(gl.STENCIL_TEST);

    // Depth test is enabled, and should pass NEVER.
    // Since there is no depth buffer, the depth test is not run.
    // Stencil test is disabled.
    DrawAndCheck(gl, infoPrefix + 'no-depth: ', DRAW_COLOR);
  }

  if (!attribs.stencil) {
    gl.disable(gl.DEPTH_TEST);

    gl.enable(gl.STENCIL_TEST);
    gl.stencilFunc(gl.NEVER, 0, 0);

    // Depth test is disabled.
    // Stencil test is enabled, and should pass NEVER.
    // Since there is no stencil buffer, the stencil test is not run.
    DrawAndCheck(gl, infoPrefix + 'no-stencil: ', DRAW_COLOR);
  }
}

function TestBackbuffer(requestedAttribs) {
  var canvas = document.createElement('canvas');
  canvas.width = 1;
  canvas.height = 1;
  var gl = canvas.getContext('experimental-webgl', requestedAttribs);
  if (!gl) {
    ok(true, 'WebGL doesn\'t work, skipping test.');
    return;
  }

  ok(gl.drawingBufferWidth == 1 && gl.drawingBufferHeight == 1,
     'backbuffer should be 1x1');

  var prog = WebGLUtil.createProgramByIds(gl, 'vs', 'fs');
  gl.useProgram(prog);

  var attribs = {
    depth: gl.getContextAttributes().depth,
    stencil: gl.getContextAttributes().stencil,
  };
  TestCurrent(gl, attribs, 'Backbuffer: ');
}

function TestUserFB() {
  var canvas = document.createElement('canvas');
  var gl = canvas.getContext('experimental-webgl');
  if (!gl) {
    ok(true, 'WebGL doesn\'t work, skipping test.');
    return;
  }

  var prog = WebGLUtil.createProgramByIds(gl, 'vs', 'fs');
  gl.useProgram(prog);

  var rb = gl.createRenderbuffer();
  gl.bindRenderbuffer(gl.RENDERBUFFER, rb);
  gl.renderbufferStorage(gl.RENDERBUFFER, gl.RGBA4, 1, 1);

  var fb = gl.createFramebuffer();
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.RENDERBUFFER, rb);

  var depthRB = gl.createRenderbuffer();
  gl.bindRenderbuffer(gl.RENDERBUFFER, depthRB);
  gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, 1, 1);

  var stencilRB = gl.createRenderbuffer();
  gl.bindRenderbuffer(gl.RENDERBUFFER, stencilRB);
  gl.renderbufferStorage(gl.RENDERBUFFER, gl.STENCIL_INDEX8, 1, 1);

  do {
    gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthRB);
    gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.STENCIL_ATTACHMENT, gl.RENDERBUFFER, null);
    var status = gl.checkFramebufferStatus(gl.FRAMEBUFFER);
    if (status != gl.FRAMEBUFFER_COMPLETE) {
      ok(true, 'Depth-only user FB is incomplete. This is allowed.');
      break;
    }

    TestCurrent(gl, {depth: true, stencil: false}, 'Depth-only user FB');
  } while (false);

  do {
    gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, null);
    gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.STENCIL_ATTACHMENT, gl.RENDERBUFFER, stencilRB);
    var status = gl.checkFramebufferStatus(gl.FRAMEBUFFER);
    if (status != gl.FRAMEBUFFER_COMPLETE) {
      ok(true, 'Stencil-only user FB is incomplete. This is allowed.');
      break;
    }

    TestCurrent(gl, {depth: false, stencil: true}, 'Stencil-only user FB');
  } while (false);
}

(function(){
  TestBackbuffer({depth: true, stencil: false});
  TestBackbuffer({depth: false, stencil: true});
  TestUserFB();
})();

</script>
</body>
