michael@0: /* vim: set ts=2 et sw=2 tw=80: */
michael@0: /* Any copyright is dedicated to the Public Domain.
michael@0: http://creativecommons.org/publicdomain/zero/1.0/ */
michael@0:
michael@0: "use strict";
michael@0:
michael@0: const PAGE_CONTENT = [
michael@0: '',
michael@0: ''
michael@0: ].join("\n");
michael@0:
michael@0: const ORIGINAL_COLOR = "rgb(255, 0, 153)"; // #f09
michael@0: const EXPECTED_COLOR = "rgb(255, 255, 85)"; // #ff5
michael@0:
michael@0: // Test opening the eyedropper from the color picker. Pressing escape
michael@0: // to close it, and clicking the page to select a color.
michael@0:
michael@0: let test = asyncTest(function*() {
michael@0: yield addTab("data:text/html,rule view eyedropper test");
michael@0: content.document.body.innerHTML = PAGE_CONTENT;
michael@0: let {toolbox, inspector, view} = yield openRuleView();
michael@0:
michael@0: let element = content.document.querySelector("div");
michael@0: inspector.selection.setNode(element, "test");
michael@0: yield inspector.once("inspector-updated");
michael@0:
michael@0: let property = getRuleViewProperty(view, "div", "background-color");
michael@0: let swatch = property.valueSpan.querySelector(".ruleview-colorswatch");
michael@0: ok(swatch, "Color swatch is displayed for the bg-color property");
michael@0:
michael@0: let dropper = yield openEyedropper(view, swatch);
michael@0:
michael@0: let tooltip = view.colorPicker.tooltip;
michael@0: ok(tooltip.isHidden(),
michael@0: "color picker tooltip is closed after opening eyedropper");
michael@0:
michael@0: yield testESC(swatch, dropper);
michael@0:
michael@0: dropper = yield openEyedropper(view, swatch);
michael@0:
michael@0: ok(dropper, "dropper opened");
michael@0:
michael@0: yield testSelect(swatch, dropper);
michael@0: });
michael@0:
michael@0:
michael@0: function testESC(swatch, dropper) {
michael@0: let deferred = promise.defer();
michael@0:
michael@0: dropper.once("destroy", () => {
michael@0: let color = swatch.style.backgroundColor;
michael@0: is(color, ORIGINAL_COLOR, "swatch didn't change after pressing ESC");
michael@0:
michael@0: deferred.resolve();
michael@0: });
michael@0:
michael@0: inspectPage(dropper, false).then(pressESC);
michael@0:
michael@0: return deferred.promise;
michael@0: }
michael@0:
michael@0: function testSelect(swatch, dropper) {
michael@0: let deferred = promise.defer();
michael@0:
michael@0: dropper.once("destroy", () => {
michael@0: let color = swatch.style.backgroundColor;
michael@0: is(color, EXPECTED_COLOR, "swatch changed colors");
michael@0:
michael@0: // the change to the content is done async after rule view change
michael@0: executeSoon(() => {
michael@0: let element = content.document.querySelector("div");
michael@0: is(content.window.getComputedStyle(element).backgroundColor,
michael@0: EXPECTED_COLOR,
michael@0: "div's color set to body color after dropper");
michael@0:
michael@0: deferred.resolve();
michael@0: });
michael@0: });
michael@0:
michael@0: inspectPage(dropper);
michael@0:
michael@0: return deferred.promise;
michael@0: }
michael@0:
michael@0:
michael@0: /* Helpers */
michael@0:
michael@0: function openEyedropper(view, swatch) {
michael@0: let deferred = promise.defer();
michael@0:
michael@0: let tooltip = view.colorPicker.tooltip;
michael@0:
michael@0: tooltip.once("shown", () => {
michael@0: let tooltipDoc = tooltip.content.contentDocument;
michael@0: let dropperButton = tooltipDoc.querySelector("#eyedropper-button");
michael@0:
michael@0: tooltip.once("eyedropper-opened", (event, dropper) => {
michael@0: deferred.resolve(dropper)
michael@0: });
michael@0: dropperButton.click();
michael@0: });
michael@0:
michael@0: swatch.click();
michael@0: return deferred.promise;
michael@0: }
michael@0:
michael@0: function inspectPage(dropper, click=true) {
michael@0: let target = content.document.body;
michael@0: let win = content.window;
michael@0:
michael@0: EventUtils.synthesizeMouse(target, 10, 10, { type: "mousemove" }, win);
michael@0:
michael@0: return dropperLoaded(dropper).then(() => {
michael@0: EventUtils.synthesizeMouse(target, 20, 20, { type: "mousemove" }, win);
michael@0: if (click) {
michael@0: EventUtils.synthesizeMouse(target, 20, 20, {}, win);
michael@0: }
michael@0: });
michael@0: }
michael@0:
michael@0: function dropperLoaded(dropper) {
michael@0: if (dropper.loaded) {
michael@0: return promise.resolve();
michael@0: }
michael@0:
michael@0: return dropper.once("load");
michael@0: }
michael@0:
michael@0: function pressESC() {
michael@0: EventUtils.synthesizeKey("VK_ESCAPE", { });
michael@0: }