sku-pg
Version:
Skulpt is a Javascript implementation of Python 2.x. Python that runs in your browser!
220 lines (189 loc) • 7.88 kB
HTML
<html>
<!--
Copyright 2008 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<!--
-->
<head>
<!--
This test has not yet been updated to run on IE8. See http://b/hotlist?id=36311
-->
<!--meta http-equiv="X-UA-Compatible" content="IE=edge"-->
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<title>HsvPalette Unit Tests</title>
<script src="../base.js"></script>
<script src="../deps.js"></script>
<script>
goog.require('goog.color');
goog.require('goog.events');
goog.require('goog.math.Rect');
goog.require('goog.style');
goog.require('goog.testing.PropertyReplacer');
goog.require('goog.testing.events');
goog.require('goog.testing.jsunit');
goog.require('goog.ui.HsvPalette');
</script>
</head>
<body>
<div id="sandbox"></div>
<div id="sandboxRtl" dir="rtl"></div>
<script>
var samplePalette;
var eventWasFired = false;
var stubs = new goog.testing.PropertyReplacer();
function setUp() {
samplePalette = new goog.ui.HsvPalette();
}
function tearDown() {
samplePalette.dispose();
stubs.reset();
}
function testRtl() {
samplePalette.render(document.getElementById('sandboxRtl'));
var color = '#ffffff';
samplePalette.inputElement.value = color;
samplePalette.handleInput(null);
var expectedRight = samplePalette.hsImageEl_.offsetWidth -
Math.ceil(samplePalette.hsHandleEl_.offsetWidth / 2);
assertEquals(expectedRight + 'px',
samplePalette.hsHandleEl_.style['right']);
assertEquals('', samplePalette.hsHandleEl_.style['left']);
}
function testOptionalInitialColor() {
var initialColor = '#0000ff';
var customInitialPalette = new goog.ui.HsvPalette(null, initialColor);
assertEquals(initialColor,
goog.color.parse(customInitialPalette.getColor()).hex);
}
function testCustomClassName() {
var customClassName = 'custom-plouf';
var customClassPalette =
new goog.ui.HsvPalette(null, null, customClassName);
customClassPalette.createDom();
assertTrue(goog.dom.classes.has(customClassPalette.getElement(),
customClassName));
}
function testCannotDecorate() {
assertFalse(samplePalette.canDecorate());
}
function testSetColor() {
var color = '#abcdef';
samplePalette.setColor(color);
assertEquals(color, goog.color.parse(samplePalette.getColor()).hex);
}
function testChangeEvent() {
// TODO(user): Add functionality to goog.testing.events to assert
// an event was fired.
goog.events.listen(samplePalette, goog.ui.Component.EventType.ACTION,
function() {eventWasFired = true;});
samplePalette.setColor('#123456');
assertTrue(eventWasFired);
}
function testSetHsv() {
// Start from red.
samplePalette.setColor('#ff0000');
// Setting hue to 0.5 should yield cyan.
samplePalette.setHsv(0.5, null, null);
assertEquals('#00ffff', goog.color.parse(samplePalette.getColor()).hex);
// Setting saturation to 0 should yield white.
samplePalette.setHsv(null, 0, null);
assertEquals('#ffffff',
goog.color.parse(samplePalette.getColor()).hex);
// Setting value/brightness to 0 should yield black.
samplePalette.setHsv(null, null, 0);
assertEquals('#000000', goog.color.parse(samplePalette.getColor()).hex);
}
function testRender() {
samplePalette.render(document.getElementById('sandbox'));
assertTrue(samplePalette.isInDocument());
var elem = samplePalette.getElement();
assertNotNull(elem);
assertEquals(goog.dom.TagName.DIV, elem.tagName);
if (goog.userAgent.IE && !goog.userAgent.isVersionOrHigher('7')) {
assertSameElements('On IE6, the noalpha class must be present',
['goog-hsv-palette', 'goog-hsv-palette-noalpha'],
goog.dom.classes.get(elem));
} else {
assertEquals('The noalpha class must not be present',
'goog-hsv-palette', elem.className);
}
}
function testNoLeftOverListenersAfterDispose() {
var initialListenerCount = goog.events.getTotalListenerCount();
samplePalette.render(document.getElementById('sandbox'));
samplePalette.dispose();
assertEquals(initialListenerCount, goog.events.getTotalListenerCount());
}
function testSwatchTextIsReadable() {
samplePalette.render(document.getElementById('sandbox'));
var swatchElement = samplePalette.swatchElement;
// Text should be black when background is light.
samplePalette.setColor('#ccffff');
assertEquals('#000000',
goog.color.parse(goog.style.getStyle(swatchElement,
'color')).hex);
// Text should be white when background is dark.
samplePalette.setColor('#410800');
assertEquals('#ffffff',
goog.color.parse(goog.style.getStyle(swatchElement,
'color')).hex);
}
function testInputColor() {
samplePalette.render(document.getElementById('sandbox'));
var color = '#001122';
samplePalette.inputElement.value = color;
samplePalette.handleInput(null);
assertEquals(color, goog.color.parse(samplePalette.getColor()).hex);
}
function testHandleMouseMoveValue() {
samplePalette.render(document.getElementById('sandbox'));
stubs.set(goog.dom, 'getPageScroll', function() {
return new goog.math.Coordinate(0, 0);
});
// Raising the value/brightness of a dark red should yield a lighter red.
samplePalette.setColor('#630c00');
goog.style.setPageOffset(samplePalette.valueBackgroundImageElement, 0, 0);
goog.style.setSize(samplePalette.valueBackgroundImageElement, 10, 100);
var boundaries = goog.style.getBounds(
samplePalette.valueBackgroundImageElement, 0, 0);
var event = new goog.events.Event();
event.clientY = -50;
// TODO(user): Use
// goog.testing.events.fireMouseDownEvent(
// samplePalette.valueBackgroundImageElement);
// when google.testing.events support specifying properties of the event
// or find out how tod o it if it already supports it.
samplePalette.handleMouseMoveV_(boundaries, event);
assertEquals('#ff1e00', goog.color.parse(samplePalette.getColor()).hex);
}
function testHandleMouseMoveHueSaturation() {
samplePalette.render(document.getElementById('sandbox'));
stubs.set(goog.dom, 'getPageScroll', function() {
return new goog.math.Coordinate(0, 0);
});
// The following hue/saturation selection should yield a light yellow.
goog.style.setPageOffset(samplePalette.hsImageEl_, 0, 0);
goog.style.setSize(samplePalette.hsImageEl_, 100, 100);
var boundaries = goog.style.getBounds(samplePalette.hsImageEl_);
var event = new goog.events.Event();
event.clientX = 20;
event.clientY = 85;
// TODO(user): Use goog.testing.events when appropriate (see above).
samplePalette.handleMouseMoveHs_(boundaries, event);
// TODO(user): Fix the main code for this, see bug #1324469.
// NOTE(gboyer): It's a little better than before due to the
// goog.style getBoundingClientRect fix, but still not the same. :-(
if (goog.userAgent.IE) {
var expectedColor = '#ffe0b2';
} else {
var expectedColor = '#ffeec4';
}
assertEquals(expectedColor,
goog.color.parse(samplePalette.getColor()).hex);
}
</script>
</body>
</html>