Bug 1507476 - Update Changes panel tests to use helpers for rendered declarations. r=pbro

Depends on D12434

Differential Revision: https://phabricator.services.mozilla.com/D12445

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Razvan Caliman 2018-11-21 08:16:06 +00:00
parent c88c8173d9
commit 12acae9b30
5 changed files with 36 additions and 51 deletions

View file

@ -19,7 +19,6 @@ add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view: ruleView } = await openRuleView();
const { document: doc, store } = selectChangesView(inspector);
const panel = doc.querySelector("#sidebar-panel-changes");
await selectNode("div", inspector);
const rule = getRuleViewRuleEditor(ruleView, 1).rule;
@ -31,7 +30,7 @@ add_task(async function() {
info("Wait for change to be tracked");
await onTrackChange;
let removedDeclarations = panel.querySelectorAll(".diff-remove");
let removedDeclarations = getRemovedDeclarations(doc);
is(removedDeclarations.length, 1, "Only one declaration was tracked as removed");
onTrackChange = waitUntilAction(store, "TRACK_CHANGE");
@ -40,8 +39,8 @@ add_task(async function() {
info("Wait for change to be tracked");
await onTrackChange;
const addedDeclarations = panel.querySelectorAll(".diff-add");
removedDeclarations = panel.querySelectorAll(".diff-remove");
const addedDeclarations = getAddedDeclarations(doc);
removedDeclarations = getRemovedDeclarations(doc);
is(addedDeclarations.length, 0, "No declarations were tracked as added");
is(removedDeclarations.length, 0, "No declarations were tracked as removed");
});

View file

@ -18,15 +18,14 @@ add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view: ruleView } = await openRuleView();
const { document: doc, store } = selectChangesView(inspector);
const panel = doc.querySelector("#sidebar-panel-changes");
await selectNode("div", inspector);
await testAddDuplicateDeclarations(ruleView, store, panel);
await testChangeDuplicateDeclarations(ruleView, store, panel);
await testRemoveDuplicateDeclarations(ruleView, store, panel);
await testAddDuplicateDeclarations(ruleView, store, doc);
await testChangeDuplicateDeclarations(ruleView, store, doc);
await testRemoveDuplicateDeclarations(ruleView, store, doc);
});
async function testAddDuplicateDeclarations(ruleView, store, panel) {
async function testAddDuplicateDeclarations(ruleView, store, doc) {
info(`Test that adding declarations with the same property name and value
are both tracked.`);
@ -42,18 +41,17 @@ async function testAddDuplicateDeclarations(ruleView, store, panel) {
info("Wait for the change to be tracked");
await onTrackChange;
const addDecl = panel.querySelectorAll(".declaration.diff-add");
const addDecl = getAddedDeclarations(doc);
is(addDecl.length, 2, "Two declarations were tracked as added");
is(addDecl.item(0).querySelector(".declaration-value").textContent, "red",
is(addDecl[0].value, "red",
"First declaration has correct property value"
);
is(addDecl.item(0).querySelector(".declaration-value").textContent,
addDecl.item(1).querySelector(".declaration-value").textContent,
is(addDecl[0].value, addDecl[1].value,
"First and second declarations have identical property values"
);
}
async function testChangeDuplicateDeclarations(ruleView, store, panel) {
async function testChangeDuplicateDeclarations(ruleView, store, doc) {
info("Test that changing one of the duplicate declarations won't change the other");
const rule = getRuleViewRuleEditor(ruleView, 1).rule;
const prop = rule.textProps[0];
@ -64,16 +62,12 @@ async function testChangeDuplicateDeclarations(ruleView, store, panel) {
info("Wait for the change to be tracked");
await onTrackChange;
const addDecl = panel.querySelectorAll(".declaration.diff-add");
is(addDecl.item(0).querySelector(".declaration-value").textContent, "black",
"First declaration has changed property value"
);
is(addDecl.item(1).querySelector(".declaration-value").textContent, "red",
"Second declaration has not changed property value"
);
const addDecl = getAddedDeclarations(doc);
is(addDecl[0].value, "black", "First declaration has changed property value");
is(addDecl[1].value, "red", "Second declaration has not changed property value");
}
async function testRemoveDuplicateDeclarations(ruleView, store, panel) {
async function testRemoveDuplicateDeclarations(ruleView, store, doc) {
info(`Test that removing the first of the duplicate declarations
will not remove the second.`);
const rule = getRuleViewRuleEditor(ruleView, 1).rule;
@ -85,12 +79,12 @@ async function testRemoveDuplicateDeclarations(ruleView, store, panel) {
info("Wait for the change to be tracked");
await onTrackChange;
const addDecl = panel.querySelectorAll(".declaration.diff-add");
const removeDecl = panel.querySelectorAll(".declaration.diff-remove");
const addDecl = getAddedDeclarations(doc);
const removeDecl = getRemovedDeclarations(doc);
// Expect no remove operation tracked because it cancels out the original add operation.
is(removeDecl.length, 0, "No declaration was tracked as removed");
is(addDecl.length, 1, "Just one declaration left tracked as added");
is(addDecl.item(0).querySelector(".declaration-value").textContent, "red",
is(addDecl[0].value, "red",
"Leftover declaration has property value of the former second declaration"
);
}

View file

@ -53,15 +53,14 @@ add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view: ruleView } = await openRuleView();
const { document: doc, store } = selectChangesView(inspector);
const panel = doc.querySelector("#sidebar-panel-changes");
await selectNode("div", inspector);
const rule = getRuleViewRuleEditor(ruleView, 1).rule;
const prop = rule.textProps[0];
let onTrackChange;
let removeValue;
let addValue;
let removeDecl;
let addDecl;
for (const { value, add, remove } of VALUE_CHANGE_ITERATIONS) {
onTrackChange = waitUntilAction(store, "TRACK_CHANGE");
@ -71,25 +70,24 @@ add_task(async function() {
info("Wait for the change to be tracked");
await onTrackChange;
addValue = panel.querySelector(".diff-add .declaration-value");
removeValue = panel.querySelector(".diff-remove .declaration-value");
addDecl = getAddedDeclarations(doc);
removeDecl = getRemovedDeclarations(doc);
if (add) {
is(addValue.textContent, add.value,
is(addDecl[0].value, add.value,
`Added declaration has expected value: ${add.value}`);
is(panel.querySelectorAll(".diff-add").length, 1,
"Only one declaration was tracked as added.");
is(addDecl.length, 1, "Only one declaration was tracked as added.");
} else {
ok(!addValue, `Added declaration was cleared`);
is(addDecl.length, 0, "Added declaration was cleared");
}
if (remove) {
is(removeValue.textContent, remove.value,
is(removeDecl[0].value, remove.value,
`Removed declaration has expected value: ${remove.value}`);
is(panel.querySelectorAll(".diff-remove").length, 1,
is(removeDecl.length, 1,
"Only one declaration was tracked as removed.");
} else {
ok(!removeValue, `Removed declaration was cleared`);
is(removeDecl.length, 0, "Removed declaration was cleared");
}
}
});

View file

@ -19,7 +19,6 @@ add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view: ruleView } = await openRuleView();
const { document: doc, store } = selectChangesView(inspector);
const panel = doc.querySelector("#sidebar-panel-changes");
await selectNode("div", inspector);
const rule = getRuleViewRuleEditor(ruleView, 1).rule;
@ -31,8 +30,8 @@ add_task(async function() {
info("Wait for change to be tracked");
await onTrackChange;
const removeName = panel.querySelector(".diff-remove .declaration-name");
const removeValue = panel.querySelector(".diff-remove .declaration-value");
is(removeName.textContent, "color", "Correct declaration name was tracked as removed");
is(removeValue.textContent, "red", "Correct declaration value was tracked as removed");
const removeDecl = getRemovedDeclarations(doc);
is(removeDecl.length, 1, "One declaration was tracked as removed");
is(removeDecl[0].property, "color", "Correct declaration name was tracked as removed");
is(removeDecl[0].value, "red", "Correct declaration value was tracked as removed");
});

View file

@ -21,7 +21,6 @@ add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view: ruleView } = await openRuleView();
const { document: doc, store } = selectChangesView(inspector);
const panel = doc.querySelector("#sidebar-panel-changes");
await selectNode("div", inspector);
const rule = getRuleViewRuleEditor(ruleView, 1).rule;
@ -44,16 +43,12 @@ add_task(async function() {
info("Wait for change to be tracked");
await onTrackChange;
const removeDecl = panel.querySelectorAll(".declaration.diff-remove");
const addDecl = panel.querySelectorAll(".declaration.diff-add");
const removeDecl = getRemovedDeclarations(doc);
const addDecl = getAddedDeclarations(doc);
is(removeDecl.length, 2, "Two declarations tracked as removed");
is(addDecl.length, 1, "One declaration tracked as added");
// Ensure changes to the second declaration were tracked after removing the first one.
is(addDecl.item(0).querySelector(".declaration-name").textContent, "display",
"Added declaration has updated property name"
);
is(addDecl.item(0).querySelector(".declaration-value").textContent, "flex",
"Added declaration has updated property value"
);
is(addDecl[0].property, "display", "Added declaration has updated property name");
is(addDecl[0].value, "flex", "Added declaration has updated property value");
});