From 693696fb708e5ecb515a59a4761b15abb08d2e14 Mon Sep 17 00:00:00 2001
From: Daisuke Akatsuka <daisuke@birchill.co.jp>
Date: Fri, 18 Oct 2019 01:34:49 +0000
Subject: [PATCH] Bug 1588962: Add a test whether reflect the rule change.
 r=rcaliman

Depends on D49534

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

--HG--
extra : moz-landing-system : lando
---
 .../compatibility/test/browser/browser.ini    |  1 +
 ...browser_compatibility_event_rule-change.js | 38 +++++++++++++++++++
 2 files changed, 39 insertions(+)
 create mode 100644 devtools/client/inspector/compatibility/test/browser/browser_compatibility_event_rule-change.js

diff --git a/devtools/client/inspector/compatibility/test/browser/browser.ini b/devtools/client/inspector/compatibility/test/browser/browser.ini
index 9ebf3a9f0686..9b7a7ed3c99c 100644
--- a/devtools/client/inspector/compatibility/test/browser/browser.ini
+++ b/devtools/client/inspector/compatibility/test/browser/browser.ini
@@ -12,4 +12,5 @@ support-files =
 
 [browser_compatibility_css-property_issue.js]
 [browser_compatibility_event_new-node.js]
+[browser_compatibility_event_rule-change.js]
 [browser_compatibility_preference.js]
diff --git a/devtools/client/inspector/compatibility/test/browser/browser_compatibility_event_rule-change.js b/devtools/client/inspector/compatibility/test/browser/browser_compatibility_event_rule-change.js
new file mode 100644
index 000000000000..28886c4ae9f7
--- /dev/null
+++ b/devtools/client/inspector/compatibility/test/browser/browser_compatibility_event_rule-change.js
@@ -0,0 +1,38 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test whether the content of the issue list will be changed when the rules are changed
+// on the rule view.
+
+const TEST_URI = `<div style="border-block-color: lime;"></div>`;
+
+add_task(async function() {
+  info("Enable 3 pane mode");
+  await pushPref("devtools.inspector.three-pane-enabled", true);
+
+  await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
+
+  const { inspector, panel } = await openCompatibilityView();
+  await selectNode("div", inspector);
+
+  info("Check the initial issue");
+  await assertIssueList(panel, [{ property: "border-block-color" }]);
+
+  info("Check the issue after toggling the property");
+  const view = inspector.getPanel("ruleview").view;
+  const rule = getRuleViewRuleEditor(view, 0).rule;
+  await _togglePropStatus(view, rule.textProps[0]);
+  await assertIssueList(panel, []);
+
+  info("Check the issue after toggling the property again");
+  await _togglePropStatus(view, rule.textProps[0]);
+  await assertIssueList(panel, [{ property: "border-block-color" }]);
+});
+
+async function _togglePropStatus(view, textProp) {
+  const onRuleViewRefreshed = view.once("ruleview-changed");
+  textProp.editor.enable.click();
+  await onRuleViewRefreshed;
+}