1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
/* 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 a declaration's inactive state doesn't linger on its previous state when
// the declaration it depends on changes. Bug 1593944
const TEST_URI = `
<style>
div {
justify-content: center;
/*! display: flex */
}
</style>
<div>`;
add_task(async function () {
await pushPref("devtools.inspector.inactive.css.enabled", true);
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, view } = await openRuleView();
await selectNode("div", inspector);
const justifyContent = { "justify-content": "center" };
const justifyItems = { "justify-items": "center" };
const displayFlex = { display: "flex" };
const displayGrid = { display: "grid" };
info("Enable display:flex and check that justify-content becomes active");
await checkDeclarationIsInactive(view, 1, justifyContent);
await toggleDeclaration(view, 1, displayFlex);
await checkDeclarationIsActive(view, 1, justifyContent);
info(
"Rename justify-content to justify-items and check that it becomes inactive"
);
await updateDeclaration(view, 1, justifyContent, justifyItems);
await checkDeclarationIsInactive(view, 1, justifyItems);
info(
"Rename display:flex to display:grid and check that justify-items becomes active"
);
await updateDeclaration(view, 1, displayFlex, displayGrid);
await checkDeclarationIsActive(view, 1, justifyItems);
});
|
