glam/es5/tests/renderer/forward-test.js

Experimental WebGL Engine

'use strict';

var _tape = require('tape');

var _tape2 = _interopRequireDefault(_tape);

var _forward = require('../../lib/renderer/forward');

var _forward2 = _interopRequireDefault(_forward);

var _geo3dBox = require('geo-3d-box');

var _geo3dBox2 = _interopRequireDefault(_geo3dBox);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

(0, _tape2.default)("Forward Renderer", function (t) {

	t.test("Adds a canvas", function (t) {
		t.plan(3);

		var renderer = (0, _forward2.default)();
		var canvases = document.querySelectorAll('canvas');

		t.equals(canvases.length, 1, "It auto-creates a canvas");
		t.equals(renderer.canvas, canvases[0], "It added the canvas to the DOM");

		renderer.destroy();

		var canvasesAfter = document.querySelectorAll('canvas');

		t.equals(canvasesAfter.length, 0, "It destroys the canvas");
	});

	t.test("Can be passed a canvas", function (t) {
		t.plan(3);

		var canvas = document.createElement('canvas');
		var renderer = (0, _forward2.default)({
			canvas: canvas,
			autoAddCanvas: false
		});
		var canvasesEmpty = document.querySelectorAll('canvas');

		t.equals(canvasesEmpty.length, 0, "It does not auto-create or add a canvas");
		t.equals(renderer.canvas, canvas, "It does set the canvas as the current");

		document.body.appendChild(canvas);

		renderer.destroy();

		var canvasesAfter = document.querySelectorAll('canvas');

		t.equals(canvasesAfter.length, 1, "It does not destroy the canvas");
	});

	t.test("It does resize the canvas", function (t) {

		t.plan(6);
		var div = document.createElement('div');

		div.style.width = "100px";
		div.style.height = "50px";

		document.body.appendChild(div);

		var renderer = (0, _forward2.default)({
			parentEl: div
		});

		t.equals(renderer.canvas.width, 100, "canvas is initially sized");
		t.equals(renderer.canvas.height, 50, "canvas is initially sized");

		div.style.width = "66px";
		div.style.height = "33px";

		window.dispatchEvent(new Event('resize'));

		t.equals(renderer.canvas.width, 66, "canvas gets resized on window resize");
		t.equals(renderer.canvas.height, 33, "canvas gets resized on window resize");

		renderer.destroy();

		div.style.width = "55px";
		div.style.height = "44px";

		window.dispatchEvent(new Event('resize'));

		t.equals(renderer.canvas.width, 66, "canvas does not resize after destroying the renderer");
		t.equals(renderer.canvas.height, 33, "canvas does not resize after destroying the renderer");
	});

	t.test("It can set the canvas size", function (t) {
		t.plan(2);

		var renderer = (0, _forward2.default)({
			autoResizeCanvas: false,
			width: 77,
			height: 55
		});

		t.equals(renderer.canvas.width, 77, "canvas width is correct");
		t.equals(renderer.canvas.height, 55, "canvas height is correct");

		renderer.destroy();
	});
});