Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
/* Any copyright is dedicated to the Public Domain.
"use strict";
// Autosuggestion and color picker popups shouldn't remove overridden and invalid styles
const TEST_URI = `
<style type="text/css">
#testid {
/* Invalid property */
something: random;
/* Overridden property */
background-color: blue;
background-color: beige;
}
</style>
<div id="testid">labubu</div>`;
add_task(async function () {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view } = await openRuleView();
await selectNode("#testid", inspector);
const ruleEditor = getRuleViewRuleEditorAt(view, 1);
await focusNewRuleViewProperty(ruleEditor);
info("Type in color: to activate the autosuggestion popup");
const onRuleviewChanged = view.once("ruleview-changed");
for (const key of "color:") {
EventUtils.synthesizeKey(key, {}, view.styleWindow);
}
await onRuleviewChanged;
ok("Check autosuggestion popup does not remove overridden visuals");
assertOverriddenVisuals(view);
info(
"Open color picker popup to test that it doesn't remove overridden/invalid classes"
);
const colorPicker = view.tooltips.getTooltip("colorPicker");
const onColorTooltipReady = colorPicker.once("ready");
view.element.querySelectorAll(".inspector-colorswatch")[1].focus();
EventUtils.synthesizeKey("VK_RETURN", {}, view.styleWindow);
await onColorTooltipReady;
ok(
"Check opening color picker while autosuggestion popup is active does not remove overridden visuals"
);
assertOverriddenVisuals(view);
info(
"Close the color picker popup to test that it doesn't remove overridden/invalid classes"
);
const onModified = view.once("ruleview-changed");
colorPicker.hide();
await onModified;
info(
"Check overridden/invalid classes are still present after closing color picker popup"
);
assertOverriddenVisuals(view);
});
function assertOverriddenVisuals(view) {
ok(
getTextProperty(view, 1, {
something: "random",
}).editor.element.classList.contains("ruleview-invalid"),
`"something: random" is still invalid`
);
ok(
getTextProperty(view, 1, {
"background-color": "blue",
}).editor.element.classList.contains("ruleview-overridden"),
`"background-color: blue" is still overridden`
);
}