texture-transparent-pixels-initialized.html

Enable keyboard shortcuts

<!--

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">

<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>

"use strict";

var wtu = WebGLTestUtils;

var gl = null;

var texture;

var textureLoc = null;

var successfullyParsed = false;

function init()

    description('Tests there is no garbage in transparent regions of images uploaded as textures');

    wtu = WebGLTestUtils;

    gl = wtu.create3DContext("example");

    var program = wtu.setupTexturedQuad(gl);

    gl.clearColor(0.5,0.5,0.5,1);

    gl.clearDepth(1);

    textureLoc = gl.getUniformLocation(program, "tex");

    // The input texture has 8 characters; take the leftmost one

    var coeff = 1.0 / 8.0;

    var texCoords = new Float32Array([

        coeff, 1.0,

        0.0, 1.0,

        0.0, 0.0,

        coeff, 1.0,

        0.0, 0.0,

        coeff, 0.0]);

    var vbo = gl.createBuffer();

    gl.bindBuffer(gl.ARRAY_BUFFER, vbo);

    gl.bufferData(gl.ARRAY_BUFFER, texCoords, gl.STATIC_DRAW);

    gl.enableVertexAttribArray(1);

    gl.vertexAttribPointer(1, 2, gl.FLOAT, false, 0, 0);

    texture = wtu.loadTexture(gl, "../../../resources/bug-32888-texture.png", runTest);

// These two declarations need to be global for "shouldBe" to see them

var buf = null;

var idx = 0;

function runTest()

    gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);

    gl.enable(gl.BLEND);

    gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);

    // Bind the texture to texture unit 0

    gl.bindTexture(gl.TEXTURE_2D, texture);

    // Point the uniform sampler to texture unit 0

    gl.uniform1i(textureLoc, 0);

    // Draw the triangles

    wtu.clearAndDrawUnitQuad(gl, [0, 0, 0, 255]);

    // Spot check a couple of 2x2 regions in the upper and lower left

    // corners; they should be the rgb values in the texture.

    var color = [0, 0, 0];

    debug("Checking lower left corner");

    wtu.checkCanvasRect(gl, 1, gl.canvas.height - 3, 2, 2, color,

                        "shouldBe " + color);

    debug("Checking upper left corner");

    wtu.checkCanvasRect(gl, 1, 1, 2, 2, color,

                        "shouldBe " + color);

    finishTest();

</script>

</head>

<body onload="init()">

<canvas id="example" width="32" height="32"></canvas>

<div id="description"></div>

<div id="console"></div>

</body>

</html>