Send CSS.styleSheetChanged when a stylesheet is mutated

Sending CSS.styleSheetChanged allows DevTools to pick up the latest
styles from the mutated stylesheet.

Fixed: 1096371
Change-Id: I9acdee212309e2f6f98cdf8bdbbecf9046fd01f0
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2253739Reviewed-by: Peter Marshall <petermarshall@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Cr-Commit-Position: refs/heads/master@{#780240}

third_party/blink/renderer/core/inspector/inspector_css_agent.cc

@@ -2228,6 +2228,7 @@ void InspectorCSSAgent::DidMutateStyleSheet(CSSStyleSheet* css_style_sheet) {
   if (!style_sheet)
     return;
   style_sheet->MarkForSync();
+  StyleSheetChanged(style_sheet);
 }
 
 void InspectorCSSAgent::StyleSheetChanged(

third_party/blink/web_tests/http/tests/devtools/elements/styles-4/cssom-constructed-expected.txt

@@ -11,4 +11,5 @@ div { ((index):1 -> :1:6)
 div { (user agent stylesheet)
     display: block;
 
+StyleSheetChanged triggered
 

third_party/blink/web_tests/http/tests/devtools/elements/styles-4/cssom-constructed.js

@@ -15,10 +15,20 @@
       document.adoptedStyleSheets = [s];
   `);
 
-  ElementsTestRunner.selectNodeAndWaitForStyles('inspected', dump);
+  ElementsTestRunner.selectNodeAndWaitForStyles('inspected', modify);
 
-  async function dump() {
+  async function modify() {
     await ElementsTestRunner.dumpSelectedElementStyles(true);
-    TestRunner.completeTest();
+
+    TestRunner.cssModel.addEventListener(SDK.CSSModel.Events.StyleSheetChanged, onStyleSheetChanged, this);
+
+    function onStyleSheetChanged(event) {
+      TestRunner.addResult('StyleSheetChanged triggered');
+      TestRunner.completeTest();
+    }
+
+    await TestRunner.evaluateInPagePromise(`
+      s.insertRule('div {color: green}');
+    `);
   }
 })();