Bug 1847747 - [devtools] Ignore devtools-highlighter-styles/highlighters.css in regular toolbox. r=devtools-reviewers,jdescottes.

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

devtools/client/styleeditor/test/browser_styleeditor_highlight-selector.js

@@ -54,7 +54,6 @@ add_task(async function () {
     selectorEl.ownerDocument.defaultView
   );
   await onHighlighted;
-
   ok(
     await topLevelHighlighterTestFront.isNodeRectHighlighted(
       await getElementNodeRectWithinTarget(["h1"])
@@ -75,6 +74,31 @@ add_task(async function () {
   let isVisible = await topLevelHighlighterTestFront.isHighlighting();
   is(isVisible, false, "The highlighter is now hidden");
 
+  // It looks like we need to show the same highlighter again to trigger Bug 1847747
+  info("Show and hide the highlighter again");
+  onHighlighted = topLevelStylesheetEditor.once("node-highlighted");
+  EventUtils.synthesizeMouseAtCenter(
+    selectorEl,
+    { type: "mousemove" },
+    selectorEl.ownerDocument.defaultView
+  );
+  await onHighlighted;
+  EventUtils.synthesizeMouseAtCenter(
+    querySelectorCodeMirrorCssPropertyNameToken(topLevelStylesheetEditor),
+    { type: "mousemove" },
+    selectorEl.ownerDocument.defaultView
+  );
+
+  await waitFor(async () => !topLevelStylesheetEditor.highlighter.isShown());
+  // wait for a bit so the style editor would have had the time to process
+  // any unwanted stylesheets
+  await wait(1000);
+  ok(
+    !ui.editors.find(e => e._resource.href?.includes("highlighters.css")),
+    "highlighters.css isn't displayed in StyleEditor"
+  );
+  is(ui.editors.length, 2, "No other stylesheet was displayed");
+
   info("Check that highlighting works on the iframe document");
   await ui.selectStyleSheet(iframeStylesheetEditor.styleSheet);
   await waitFor(() => iframeStylesheetEditor.highlighter);

devtools/server/actors/utils/stylesheets-manager.js

@@ -834,7 +834,11 @@ class StyleSheetsManager extends EventEmitter {
     }
     // FIXME(bug 1826538): Make accessiblecaret.css and similar UA-widget
     // sheets system sheets, then remove this special-case.
-    if (href === "resource://content-accessible/accessiblecaret.css") {
+    if (
+      href === "resource://content-accessible/accessiblecaret.css" ||
+      (href === "resource://devtools-highlighter-styles/highlighters.css" &&
+        this._targetActor.sessionContext.type !== "all")
+    ) {
       return false;
     }
     return true;