Issue 5404 - :-abp-properties() nested within :-abp-has() should work if the relevant selector refe…

test/browser/elemHideEmulation.js

Index: test/browser/elemHideEmulation.js
===================================================================
--- a/test/browser/elemHideEmulation.js
+++ b/test/browser/elemHideEmulation.js
@@ -384,25 +384,34 @@ function runTestPseudoClassHasSelectorWi
   }).catch(unexpectedError.bind(test)).then(() => test.done());
 }
 
 exports.testPseudoClassHasSelectorWithHasAndWithSuffixSibling = function(test)
 {
   runTestPseudoClassHasSelectorWithHasAndWithSuffixSibling(test, "div:-abp-has(:-abp-has(div.inside)) + div > div");
 };
 
-exports.testPseudoClassHasSelectorWithHasAndWithSuffixSibling2 = function(test)
-{
-  runTestPseudoClassHasSelectorWithHasAndWithSuffixSibling(test, "div:-abp-has(:-abp-has(> div.inside)) + div > div");
-};
-

[hub, 2017/07/11 17:19:34]

you are removing this test because it fails, but :-abp-has(> div.inside) is
meant to be valid.

I based the behaviour on this draft spec 
   https://drafts.csswg.org/selectors/#relational

With the following patch it works:

diff --git a/chrome/content/elemHideEmulation.js
b/chrome/content/elemHideEmulation.js
--- a/chrome/content/elemHideEmulation.js
+++ b/chrome/content/elemHideEmulation.js
@@ -184,16 +184,17 @@
    */
   *getSelectors(prefix, subtree, styles)
   {
     yield [prefix + this._selector, subtree];
   }
 };

 const incompletePrefixRegexp = /[\s>+~]$/;
+const relativeSelector = /^[\s>+~]/;

 function HasSelector(selectors)
 {
   this._innerSelectors = selectors;
 }

 HasSelector.prototype = {
   requiresHiding: true,
@@ -219,18 +220,22 @@
   {
     let actualPrefix = (!prefix || incompletePrefixRegexp.test(prefix)) ?
         prefix + "*" : prefix;
     let elements = subtree.querySelectorAll(actualPrefix);
     for (let element of elements)
     {
       let iter = evaluate(this._innerSelectors, 0, "", element, styles);
       for (let selector of iter)
+      {
+        if (relativeSelector.test(selector))
+          selector = ":scope" + selector;
         if (element.querySelector(selector))
           yield element;
+      }
     }
   }
 };

 function ContainsSelector(textContent)
 {
   this._text = textContent;
 }

 exports.testPseudoClassHasSelectorWithPropSelector = function(test)
 {
   let parent = createElementWithStyle("{}");
   let child = createElementWithStyle("{background-color: #000}", parent);
   applyElemHideEmulation(
     ["div:-abp-has(:-abp-properties(background-color: rgb(0, 0, 0)))"]
   ).then(() =>
   {
     expectVisible(test, child);
     expectHidden(test, parent);
   }).catch(unexpectedError.bind(test)).then(() => test.done());
 };
+
+exports.testPseudoClassHasSelectorWithPropSelector2 = function(test)
+{
+  let parent = createElementWithStyle("{}");
+  let child = createElementWithStyle("{}", parent);
+  insertStyleRule("body #" + parent.id + " > div { background-color: #000}");
+  applyElemHideEmulation(
+    ["div:-abp-has(:-abp-properties(background-color: rgb(0, 0, 0)))"]
+  ).then(() =>
+  {
+    expectVisible(test, child);
+    expectHidden(test, parent);
+  }).catch(unexpectedError.bind(test)).then(() => test.done());
+};