[REF] web, *: create jQuery ':hasVisibility' and ':hasOpacity' selectors

* web_editor, web_tour

jQuery has the built-in ':visible' selector. This is however not enough
as this only checks if the element and its parents have a visible
'display' property. Ironically, if the element has the 'visibility'
property set to 'hidden', it will be considered ':visible' by jQuery.

This commit creates the ':hasVisibility' and ':hasOpacity' selectors
which respectively check if the element and its parents have a visible
'visibility' property and a visible 'opacity' property.

1 files changed, 22 insertions, 0 deletions

diff --git a/addons/web/static/src/js/libs/jquery.js b/addons/web/static/src/js/libs/jquery.js
index ace99a0f8d3..8722025663e 100644
--- a/addons/web/static/src/js/libs/jquery.js
+++ b/addons/web/static/src/js/libs/jquery.js
@@ -41,6 +41,28 @@ $.extend($.expr[':'], {
     data: function (element, index, matches) {
         return $(element).data(matches[3]);
     },
+    hasVisibility: function (element, index, matches) {
+        var $element = $(element);
+        if ($(element).css('visibility') === 'hidden') {
+            return false;
+        }
+        var $parent = $element.parent();
+        if (!$parent.length || $element.is('html')) {
+            return true;
+        }
+        return $parent.is(':hasVisibility');
+    },
+    hasOpacity: function (element, index, matches) {
+        var $element = $(element);
+        if (parseFloat($(element).css('opacity')) <= 0.01) {
+            return false;
+        }
+        var $parent = $element.parent();
+        if (!$parent.length || $element.is('html')) {
+            return true;
+        }
+        return $parent.is(':hasOpacity');
+    },
 });
 
 // jQuery functions extensions