Issue 6034 - :-abp-contains() accept a regular expression

lib/content/elemHideEmulation.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-present eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  * GNU General Public License for more details.
  *
  * You should have received a copy of the GNU General Public License
  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>.
  */
 
 "use strict";
 
-const {filterToRegExp, splitSelector} = require("../common");
+const {textToRegExp, filterToRegExp, splitSelector} = require("../common");
 
 let MIN_INVOCATION_INTERVAL = 3000;
 const MAX_SYNCHRONOUS_PROCESSING_TIME = 50;
 const abpSelectorRegexp = /:-abp-([\w-]+)\(/i;
 
 /** Return position of node from parent.
  * @param {Node} node the node to find the position of.
  * @return {number} One-based index like for :nth-child(), or 0 on error.
  */
 function positionInParent(node)
@@ skipping 84 matching lines @@
     let priority = rule.style.getPropertyPriority(property);
     styles.push(`${property}: ${value}${priority ? " !" + priority : ""};`);
   }
   styles.sort();
   return {
     style: styles.join(" "),
     subSelectors: splitSelector(rule.selectorText)
   };
 }
 
-const regexpRegexp = /^\/(.*)\/([gimuy]*)$/;

[Manish Jethani, 2018/01/10 11:22:15]

We don't have to support all these flags, some of them don't make any sense
anyway.

g - no need, we only want one match anyway
i - OK
m - OK
u - no need, Unicode is supported in filters, i.e. you can use a Unicode
character directly instead of using sequences like "\u{1F47B}"
y - doesn't make sense for a filter

Also see:

https://github.com/gorhill/uBlock/issues/3372#issuecomment-354576078

[hub, 2018/01/10 18:27:22]

let's restrict to "im" for the flags.

+let scopeSupported = null;
+
+function tryQuerySelector(subtree, selector, all)
+{
+  let elements = null;
+  try
+  {
+    elements = all ? subtree.querySelectorAll(selector) :
+      subtree.querySelector(selector);
+    scopeSupported = true;
+  }
+  catch (e)
+  {
+    // Edge doesn't support ":scope"
+    scopeSupported = false;
+  }
+  return elements;
+}
+
+/**
+ * Query selector. If it is relative, will try :scope.
+ * @param {Node} subtree the element to query selector
+ * @param {string} selector the selector to query
+ * @param {bool} [all=false] true to perform querySelectorAll()
+ * @returns {?(Node|NodeList)} result of the query. null in case of error.
+ */
+function scopedQuerySelector(subtree, selector, all)
+{
+  if (selector[0] == ">")
+  {
+    selector = ":scope" + selector;
+    if (scopeSupported)
+    {
+      return all ? subtree.querySelectorAll(selector) :
+        subtree.querySelector(selector);
+    }
+    if (scopeSupported == null)
+      return tryQuerySelector(subtree, selector, all);
+    return null;
+  }
+  return all ? subtree.querySelectorAll(selector) :
+    subtree.querySelector(selector);
+}
+
+function scopedQuerySelectorAll(subtree, selector)
+{
+  return scopedQuerySelector(subtree, selector, true);
+}
+
+const regexpRegexp = /^\/(.*)\/([im]*)$/;
 
 /**
  * Make a regular expression from a text argument. If it can be parsed as a
  * regular expression, parse it and the flags.
  * @param {string} text the text argument.
- * @param {?string} flag the regexp flag passed to the RegExp constructor:
- * it overrides flags passed in the text argument.
- * @return {RegExp} a RegExp object.
+ * @return {?RegExp} a RegExp object or null in case of error.
  */
-function makeRegExpParameter(text, flag)

[Manish Jethani, 2018/01/10 11:22:14]

Shouldn't the parameter be called "flags" (plural)?

[hub, 2018/01/10 18:27:21]

Done.

-{
-  let regexpString = null;
-  let match = regexpRegexp.exec(text);
-  if (match)
-  {
-    regexpString = match[1].replace("\\7B ", "{").replace("\\7D ", "}");
-    if (!flag)

[Manish Jethani, 2018/01/10 11:22:15]

This changes the syntax of PropsSelector so that now it supports flags even
though the flags are ignored (always "i"). Instead we should just use two
separate regular expressions for ContainsSelector and PropsSelector.

[hub, 2018/01/10 18:27:22]

It is just more permissive to allow the regexp syntax with flags, which will be
ignored anyway. I don't think we need to make things more complex by having more
RegExp to parse.

-      flag = match[2];
-  }
-  else
-    regexpString = filterToRegExp(text);
-
-  return new RegExp(regexpString, flag);

[Manish Jethani, 2018/01/10 11:22:14]

We still need to handle the error if any.

[hub, 2018/01/10 18:27:21]

Done.

+function makeRegExpParameter(text)
+{
+  let [, pattern, flags] =
+      regexpRegexp.exec(text) || [undefined, textToRegExp(text)];
+
+  try
+  {
+    return new RegExp(pattern, flags);
+  }
+  catch (e)
+  {
+  }
+  return null;
 }
 
 function* evaluate(chain, index, prefix, subtree, styles)
 {
   if (index >= chain.length)
   {
     yield prefix;
     return;
   }
   for (let [selector, element] of
@@ skipping 23 matching lines @@
    * @param {Node} subtree the subtree we work on.
    * @param {StringifiedStyle[]} styles the stringified style objects.
    */
   *getSelectors(prefix, subtree, styles)
   {
     yield [prefix + this._selector, subtree];
   }
 };
 
 const incompletePrefixRegexp = /[\s>+~]$/;
-const relativeSelectorRegexp = /^[>+~]/;
 
 function HasSelector(selectors)
 {
   this._innerSelectors = selectors;
 }
 
 HasSelector.prototype = {
   requiresHiding: true,
 
   get dependsOnStyles()
@@ skipping 10 matching lines @@
   /**
    * Generator function returning selected elements.
    * @param {string} prefix the prefix for the selector.
    * @param {Node} subtree the subtree we work on.
    * @param {StringifiedStyle[]} styles the stringified style objects.
    */
   *getElements(prefix, subtree, styles)
   {
     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 (selector == null)
+    let elements = scopedQuerySelectorAll(subtree, actualPrefix);
+    if (elements)
+    {
+      for (let element of elements)
+      {
+        let iter = evaluate(this._innerSelectors, 0, "", element, styles);
+        for (let selector of iter)
         {
-          yield null;
-          continue;
-        }
-        if (relativeSelectorRegexp.test(selector))
-          selector = ":scope" + selector;
-        try
-        {
-          if (element.querySelector(selector))
+          if (selector == null)
+            yield null;
+          else if (scopedQuerySelector(element, selector))
             yield element;
         }
-        catch (e)
-        {
-          // :scope isn't supported on Edge, ignore error caused by it.
-        }
+        yield null;
       }
-      yield null;
     }
   }
 };
 
 function ContainsSelector(textContent)
 {
   this._regexp = makeRegExpParameter(textContent);
 }
 
 ContainsSelector.prototype = {
   requiresHiding: true,
 
   *getSelectors(prefix, subtree, stylesheet)
   {
     for (let element of this.getElements(prefix, subtree, stylesheet))
       yield [makeSelector(element, ""), subtree];
   },
 
   *getElements(prefix, subtree, stylesheet)
   {
     let actualPrefix = (!prefix || incompletePrefixRegexp.test(prefix)) ?
         prefix + "*" : prefix;
-    let elements = subtree.querySelectorAll(actualPrefix);
-
-    for (let element of elements)
-    {
-      if (this._regexp && this._regexp.test(element.textContent))
-        yield element;
-      else
-        yield null;

[lainverse, 2018/01/10 09:14:02]

BTW, while we are at it why do we even want to yield null? As I understand
makeSelector will skip it anyway. Similar yield in the other getElements
function.

[lainverse, 2018/01/10 19:10:22]

Checked. makeSelectors returns null if null is passed as selector (and that's
what getSelectors does), then getSelectors yields an array [null, subtree],
"evaluate" yields null when encounters null there later on and processPatterns
skips all null selectors because what else could it do with them anyway? I can
make an assumption that on some sites it leads to hundreds of useless calls just
to do one or two right.

+
+    let elements = scopedQuerySelectorAll(subtree, actualPrefix);
+    if (elements)
+    {
+      for (let element of elements)
+      {
+        if (this._regexp && this._regexp.test(element.textContent))
+          yield element;
+        else
+          yield null;
+      }
     }
   }
 };
 
 function PropsSelector(propertyExpression)
 {
-  this._regexp = makeRegExpParameter(propertyExpression, "i");
+  let regexpString;
+  if (propertyExpression.length >= 2 && propertyExpression[0] == "/" &&
+      propertyExpression[propertyExpression.length - 1] == "/")
+  {
+    regexpString = propertyExpression.slice(1, -1)
+      .replace("\\7B ", "{").replace("\\7D ", "}");
+  }
+  else
+    regexpString = filterToRegExp(propertyExpression);
+
+  this._regexp = new RegExp(regexpString, "i");
 }
 
 PropsSelector.prototype = {
   preferHideWithSelector: true,
   dependsOnStyles: true,
 
   *findPropsSelectors(styles, prefix, regexp)
   {
     for (let style of styles)
       if (regexp.test(style.style))
@@ skipping 326 matching lines @@
           characterData: true,
           subtree: true
         }
       );
       this.document.addEventListener("load", this.onLoad.bind(this), true);
     }
   }
 };
 
 exports.ElemHideEmulation = ElemHideEmulation;