1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/browser/devtools/shared/test/browser_spectrum.js Wed Dec 31 06:09:35 2014 +0100 1.3 @@ -0,0 +1,122 @@ 1.4 +/* vim: set ts=2 et sw=2 tw=80: */ 1.5 +/* Any copyright is dedicated to the Public Domain. 1.6 + http://creativecommons.org/publicdomain/zero/1.0/ */ 1.7 + 1.8 +// Tests that the spectrum color picker works correctly 1.9 + 1.10 +const TEST_URI = "chrome://browser/content/devtools/spectrum-frame.xhtml"; 1.11 +const {Spectrum} = devtools.require("devtools/shared/widgets/Spectrum"); 1.12 + 1.13 +let doc; 1.14 + 1.15 +function test() { 1.16 + waitForExplicitFinish(); 1.17 + addTab(TEST_URI, () => { 1.18 + doc = content.document; 1.19 + startTests(); 1.20 + }); 1.21 +} 1.22 + 1.23 +function endTests() { 1.24 + doc = null; 1.25 + gBrowser.removeCurrentTab(); 1.26 + finish(); 1.27 +} 1.28 + 1.29 +function startTests() { 1.30 + testCreateAndDestroyShouldAppendAndRemoveElements(); 1.31 +} 1.32 + 1.33 +function testCreateAndDestroyShouldAppendAndRemoveElements() { 1.34 + let containerElement = doc.querySelector("#spectrum"); 1.35 + ok(containerElement, "We have the root node to append spectrum to"); 1.36 + is(containerElement.childElementCount, 0, "Root node is empty"); 1.37 + 1.38 + let s = new Spectrum(containerElement, [255, 126, 255, 1]); 1.39 + s.show(); 1.40 + ok(containerElement.childElementCount > 0, "Spectrum has appended elements"); 1.41 + 1.42 + s.destroy(); 1.43 + is(containerElement.childElementCount, 0, "Destroying spectrum removed all nodes"); 1.44 + 1.45 + testPassingAColorAtInitShouldSetThatColor(); 1.46 +} 1.47 + 1.48 +function testPassingAColorAtInitShouldSetThatColor() { 1.49 + let initRgba = [255, 126, 255, 1]; 1.50 + 1.51 + let s = new Spectrum(doc.querySelector("#spectrum"), initRgba); 1.52 + s.show(); 1.53 + 1.54 + let setRgba = s.rgb; 1.55 + 1.56 + is(initRgba[0], setRgba[0], "Spectrum initialized with the right color"); 1.57 + is(initRgba[1], setRgba[1], "Spectrum initialized with the right color"); 1.58 + is(initRgba[2], setRgba[2], "Spectrum initialized with the right color"); 1.59 + is(initRgba[3], setRgba[3], "Spectrum initialized with the right color"); 1.60 + 1.61 + s.destroy(); 1.62 + testSettingAndGettingANewColor(); 1.63 +} 1.64 + 1.65 +function testSettingAndGettingANewColor() { 1.66 + let s = new Spectrum(doc.querySelector("#spectrum"), [0, 0, 0, 1]); 1.67 + s.show(); 1.68 + 1.69 + let colorToSet = [255, 255, 255, 1]; 1.70 + s.rgb = colorToSet; 1.71 + let newColor = s.rgb; 1.72 + 1.73 + is(colorToSet[0], newColor[0], "Spectrum set with the right color"); 1.74 + is(colorToSet[1], newColor[1], "Spectrum set with the right color"); 1.75 + is(colorToSet[2], newColor[2], "Spectrum set with the right color"); 1.76 + is(colorToSet[3], newColor[3], "Spectrum set with the right color"); 1.77 + 1.78 + s.destroy(); 1.79 + testChangingColorShouldEmitEvents(); 1.80 +} 1.81 + 1.82 +function testChangingColorShouldEmitEvents() { 1.83 + let s = new Spectrum(doc.querySelector("#spectrum"), [255, 255, 255, 1]); 1.84 + s.show(); 1.85 + 1.86 + s.once("changed", (event, rgba, color) => { 1.87 + EventUtils.sendMouseEvent({type: "mouseup"}, s.dragger, doc.defaultView); 1.88 + 1.89 + ok(true, "Changed event was emitted on color change"); 1.90 + is(rgba[0], 128, "New color is correct"); 1.91 + is(rgba[1], 64, "New color is correct"); 1.92 + is(rgba[2], 64, "New color is correct"); 1.93 + is(rgba[3], 1, "New color is correct"); 1.94 + is("rgba(" + rgba[0] + ", " + rgba[1] + ", " + rgba[2] + ", " + rgba[3] + ")", color, "RGBA and css color correspond"); 1.95 + 1.96 + s.destroy(); 1.97 + testSettingColorShoudUpdateTheUI(); 1.98 + }); 1.99 + 1.100 + executeSoon(() => { 1.101 + EventUtils.synthesizeMouse(s.dragger, s.dragger.offsetWidth/2, s.dragger.offsetHeight/2, {}, content); 1.102 + }); 1.103 +} 1.104 + 1.105 +function testSettingColorShoudUpdateTheUI() { 1.106 + let s = new Spectrum(doc.querySelector("#spectrum"), [255, 255, 255, 1]); 1.107 + s.show(); 1.108 + let dragHelperOriginalPos = [s.dragHelper.style.top, s.dragHelper.style.left]; 1.109 + let alphaHelperOriginalPos = s.alphaSliderHelper.style.left; 1.110 + 1.111 + s.rgb = [50, 240, 234, .2]; 1.112 + s.updateUI(); 1.113 + 1.114 + ok(s.alphaSliderHelper.style.left != alphaHelperOriginalPos, "Alpha helper has moved"); 1.115 + ok(s.dragHelper.style.top !== dragHelperOriginalPos[0], "Drag helper has moved"); 1.116 + ok(s.dragHelper.style.left !== dragHelperOriginalPos[1], "Drag helper has moved"); 1.117 + 1.118 + s.rgb = [240, 32, 124, 0]; 1.119 + s.updateUI(); 1.120 + is(s.alphaSliderHelper.style.left, - (s.alphaSliderHelper.offsetWidth/2) + "px", 1.121 + "Alpha range UI has been updated again"); 1.122 + 1.123 + s.destroy(); 1.124 + executeSoon(endTests); 1.125 +}