mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-05 08:35:26 +00:00
da1777509d
--HG-- rename : browser/devtools/styleinspector/test/browser_ruleview_computed_01.js => browser/devtools/styleinspector/test/browser_ruleview_computed-lists_01.js rename : browser/devtools/styleinspector/test/browser_ruleview_computed_02.js => browser/devtools/styleinspector/test/browser_ruleview_computed-lists_02.js
75 lines
2.2 KiB
JavaScript
75 lines
2.2 KiB
JavaScript
/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
|
|
/* Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/ */
|
|
|
|
"use strict";
|
|
|
|
// Test that changes are previewed when editing a property value.
|
|
|
|
const TEST_URI = `
|
|
<style type="text/css">
|
|
#testid {
|
|
display:block;
|
|
}
|
|
</style>
|
|
<div id="testid">Styled Node</div><span>inline element</span>
|
|
`;
|
|
|
|
// Format
|
|
// {
|
|
// value : what to type in the field
|
|
// expected : expected computed style on the targeted element
|
|
// }
|
|
const TEST_DATA = [
|
|
{value: "inline", expected: "inline"},
|
|
{value: "inline-block", expected: "inline-block"},
|
|
|
|
// Invalid property values should not apply, and should fall back to default
|
|
{value: "red", expected: "block"},
|
|
{value: "something", expected: "block"},
|
|
|
|
{escape: true, value: "inline", expected: "block"}
|
|
];
|
|
|
|
add_task(function*() {
|
|
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
|
|
let {inspector, view} = yield openRuleView();
|
|
yield selectNode("#testid", inspector);
|
|
|
|
for (let data of TEST_DATA) {
|
|
yield testLivePreviewData(data, view, "#testid");
|
|
}
|
|
});
|
|
|
|
function* testLivePreviewData(data, ruleView, selector) {
|
|
let ruleEditor = getRuleViewRuleEditor(ruleView, 1);
|
|
let propEditor = ruleEditor.rule.textProps[0].editor;
|
|
|
|
info("Focusing the property value inplace-editor");
|
|
let editor = yield focusEditableField(ruleView, propEditor.valueSpan);
|
|
is(inplaceEditor(propEditor.valueSpan), editor,
|
|
"The focused editor is the value");
|
|
|
|
info("Enter a value in the editor");
|
|
EventUtils.sendString(data.value, ruleView.styleWindow);
|
|
if (data.escape) {
|
|
EventUtils.synthesizeKey("VK_ESCAPE", {});
|
|
} else {
|
|
EventUtils.synthesizeKey("VK_RETURN", {});
|
|
}
|
|
|
|
// Wait for the modifyproperties request to complete before
|
|
// checking the computed style.
|
|
for (let rule of ruleView._elementStyle.rules) {
|
|
if (rule._applyingModifications) {
|
|
yield rule._applyingModifications;
|
|
}
|
|
}
|
|
|
|
// While the editor is still focused in, the display should have
|
|
// changed already
|
|
is((yield getComputedStyleProperty(selector, null, "display")),
|
|
data.expected,
|
|
"Element should be previewed as " + data.expected);
|
|
}
|