mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-08 10:44:56 +00:00
Bug 1851973 - [devtools] Use CustomEvent instead of EventEmitter for unit-change event on color/angle swatch. r=ochameau,devtools-reviewers.
Differential Revision: https://phabricator.services.mozilla.com/D187653
This commit is contained in:
parent
e7ba138c88
commit
66187129be
@ -72,7 +72,7 @@ async function checkSwatchShiftClick(container, win, expectedValue, comment) {
|
||||
const valueNode = container.querySelector(".computed-color");
|
||||
swatch.scrollIntoView();
|
||||
|
||||
const onUnitChange = swatch.once("unit-change");
|
||||
const onUnitChange = once(swatch, "unit-change");
|
||||
EventUtils.synthesizeMouseAtCenter(
|
||||
swatch,
|
||||
{
|
||||
|
@ -108,7 +108,7 @@ async function checkSwatchShiftClick(container, win, expectedValue, comment) {
|
||||
const swatch = container.querySelector(".ruleview-angleswatch");
|
||||
const valueNode = container.querySelector(".ruleview-angle");
|
||||
|
||||
const onUnitChange = swatch.once("unit-change");
|
||||
const onUnitChange = once(swatch, "unit-change");
|
||||
EventUtils.synthesizeMouseAtCenter(
|
||||
swatch,
|
||||
{
|
||||
|
@ -203,7 +203,7 @@ async function checkSwatchShiftClick(view, valueSpan, expectedValue, comment) {
|
||||
info(
|
||||
"Shift-click the color swatch and wait for the color type and ruleview to update"
|
||||
);
|
||||
const onUnitChange = swatchNode.once("unit-change");
|
||||
const onUnitChange = once(swatchNode, "unit-change");
|
||||
|
||||
EventUtils.synthesizeMouseAtCenter(
|
||||
swatchNode,
|
||||
|
@ -732,7 +732,7 @@ TextPropertyEditor.prototype = {
|
||||
);
|
||||
if (this.ruleEditor.isEditable) {
|
||||
for (const angleSpan of this.angleSwatchSpans) {
|
||||
angleSpan.on("unit-change", this._onSwatchCommit);
|
||||
angleSpan.addEventListener("unit-change", this._onSwatchCommit);
|
||||
const title = l10n("rule.angleSwatch.tooltip");
|
||||
angleSpan.setAttribute("title", title);
|
||||
}
|
||||
@ -1174,13 +1174,12 @@ TextPropertyEditor.prototype = {
|
||||
if (this._colorSwatchSpans && this._colorSwatchSpans.length) {
|
||||
for (const span of this._colorSwatchSpans) {
|
||||
this.ruleView.tooltips.getTooltip("colorPicker").removeSwatch(span);
|
||||
span.off("unit-change", this._onSwatchCommit);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.angleSwatchSpans && this.angleSwatchSpans.length) {
|
||||
for (const span of this.angleSwatchSpans) {
|
||||
span.off("unit-change", this._onSwatchCommit);
|
||||
span.removeEventListener("unit-change", this._onSwatchCommit);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -9,7 +9,6 @@ const {
|
||||
} = require("resource://devtools/client/shared/css-angle.js");
|
||||
const { colorUtils } = require("resource://devtools/shared/css/color.js");
|
||||
const { getCSSLexer } = require("resource://devtools/shared/css/lexer.js");
|
||||
const EventEmitter = require("resource://devtools/shared/event-emitter.js");
|
||||
const {
|
||||
appendText,
|
||||
} = require("resource://devtools/client/inspector/shared/utils.js");
|
||||
@ -1489,7 +1488,6 @@ class OutputParser {
|
||||
event.stopPropagation();
|
||||
}
|
||||
});
|
||||
EventEmitter.decorate(swatch);
|
||||
container.appendChild(swatch);
|
||||
}
|
||||
|
||||
@ -1569,8 +1567,6 @@ class OutputParser {
|
||||
swatch.dataset.colorFunction = options.colorFunction;
|
||||
}
|
||||
swatch.addEventListener("mousedown", this.#onColorSwatchMouseDown);
|
||||
EventEmitter.decorate(swatch);
|
||||
|
||||
container.appendChild(swatch);
|
||||
}
|
||||
|
||||
@ -1661,7 +1657,9 @@ class OutputParser {
|
||||
|
||||
swatch.nextElementSibling.textContent = val;
|
||||
swatch.parentNode.dataset.color = val;
|
||||
swatch.emit("unit-change", val);
|
||||
|
||||
const unitChangeEvent = new swatch.ownerGlobal.CustomEvent("unit-change");
|
||||
swatch.dispatchEvent(unitChangeEvent);
|
||||
};
|
||||
|
||||
#onAngleSwatchMouseDown = event => {
|
||||
@ -1676,7 +1674,9 @@ class OutputParser {
|
||||
const val = angle.nextAngleUnit();
|
||||
|
||||
swatch.nextElementSibling.textContent = val;
|
||||
swatch.emit("unit-change", val);
|
||||
|
||||
const unitChangeEvent = new swatch.ownerGlobal.CustomEvent("unit-change");
|
||||
swatch.dispatchEvent(unitChangeEvent);
|
||||
};
|
||||
|
||||
/**
|
||||
|
Loading…
Reference in New Issue
Block a user