Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Errors
- This test failed 1 times in the preceding 30 days. quicksearch this test
- Manifest: devtools/client/inspector/rules/test/browser_part1.toml
/* Any copyright is dedicated to the Public Domain.
"use strict";
// Test that classes can be added in the class panel
// This array contains the list of test cases. Each test case contains these properties:
// - {String} textEntered The text to be entered in the field
// - {Boolean} expectNoMutation Set to true if we shouldn't wait for a DOM mutation
// - {Array} expectedClasses The expected list of classes to be applied to the DOM and to
// be found in the class panel
const TEST_ARRAY = [
{
textEntered: "",
expectNoMutation: true,
expectedClasses: [],
},
{
textEntered: "class",
expectedClasses: ["class"],
},
{
textEntered: "class",
expectNoMutation: true,
expectedClasses: ["class"],
},
{
textEntered: "a a a a a a a a a a",
expectedClasses: ["class", "a"],
},
{
textEntered: "class2 class3",
expectedClasses: ["class", "a", "class2", "class3"],
},
{
textEntered: " ",
expectNoMutation: true,
expectedClasses: ["class", "a", "class2", "class3"],
},
{
textEntered: " class4",
expectedClasses: ["class", "a", "class2", "class3", "class4"],
},
{
textEntered: " \t class5 \t \t\t ",
expectedClasses: ["class", "a", "class2", "class3", "class4", "class5"],
},
];
add_task(async function () {
await addTab("data:text/html;charset=utf-8,");
const { inspector, view } = await openRuleView();
info("Open the class panel");
view.showClassPanel();
const textField = inspector.panelDoc.querySelector(
"#ruleview-class-panel .add-class"
);
ok(textField, "The input field exists in the class panel");
textField.focus();
let onMutation;
for (const { textEntered, expectNoMutation, expectedClasses } of TEST_ARRAY) {
if (!expectNoMutation) {
onMutation = inspector.once("markupmutation");
}
info(`Enter the test string in the field: ${textEntered}`);
for (const key of textEntered.split("")) {
const onPreviewMutation = inspector.once("markupmutation");
EventUtils.synthesizeKey(key, {}, view.styleWindow);
await onPreviewMutation;
}
info("Submit the change and wait for the textfield to become empty");
const onEmpty = waitForFieldToBeEmpty(textField);
EventUtils.synthesizeKey("VK_RETURN", {}, view.styleWindow);
if (!expectNoMutation) {
info("Wait for the DOM to change");
await onMutation;
}
await onEmpty;
info("Check the state of the DOM node");
const className = await getContentPageElementAttribute("body", "class");
const expectedClassName = expectedClasses.length
? expectedClasses.join(" ")
: null;
is(className, expectedClassName, "The DOM node has the right className");
info("Check the content of the class panel");
checkClassPanelContent(
view,
expectedClasses.map(name => {
return { name, state: true };
})
);
}
});
function waitForFieldToBeEmpty(textField) {
return waitForSuccess(() => !textField.value);
}