Bug 1886616 - add a CSS intervention for www.six-group.com to show invisible select box values; r=denschub,webcompat-reviewers

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

browser/extensions/webcompat/data/injections.js

@@ -1190,6 +1190,20 @@ const AVAILABLE_INJECTIONS = [
       ],
     },
   },
+  {
+    id: "bug1886616",
+    platform: "all",
+    domain: "www.six-group.com",
+    bug: "1886616",
+    contentScripts: {
+      matches: ["*://www.six-group.com/*/market-data/etf/etf-explorer.html*"],
+      css: [
+        {
+          file: "injections/css/bug1886616-www.six-group.com-select-fix.css",
+        },
+      ],
+    },
+  },
 ];
 
 module.exports = AVAILABLE_INJECTIONS;

browser/extensions/webcompat/injections/css/bug1886616-www.six-group.com-select-fix.css

@@ -0,0 +1,15 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/**
+ * www.six-group.com - Selected input values are hidden
+ * Bug #1886616 - https://bugzilla.mozilla.org/show_bug.cgi?id=1886616
+ * WebCompat issue #129271 - https://webcompat.com/issues/129271
+ *
+ * The page is hiding CSS content, which is not interoperable. In this
+ * case, it causes their select dropdown's values to be hidden.
+ */
+select {
+  content: normal;
+}

browser/extensions/webcompat/moz.build

@@ -73,6 +73,7 @@ FINAL_TARGET_FILES.features["webcompat@mozilla.org"]["injections"]["css"] += [
     "injections/css/bug1849388-kucharkaprodceru.cz-scroll-fix.css",
     "injections/css/bug1868345-tvmovie.de-scroll-fix.css",
     "injections/css/bug1884842-foodora.cz-height-fix.css",
+    "injections/css/bug1886616-www.six-group.com-select-fix.css",
     "injections/css/bug1895994-softtrans.ro-unlock-scrolling.css",
     "injections/css/bug1896571-gracobaby.ca-unlock-scrolling.css",
 ]

mobile/android/android-components/components/feature/webcompat/src/main/assets/extensions/webcompat/data/injections.js

@@ -1190,6 +1190,20 @@ const AVAILABLE_INJECTIONS = [
       ],
     },
   },
+  {
+    id: "bug1886616",
+    platform: "all",
+    domain: "www.six-group.com",
+    bug: "1886616",
+    contentScripts: {
+      matches: ["*://www.six-group.com/*/market-data/etf/etf-explorer.html*"],
+      css: [
+        {
+          file: "injections/css/bug1886616-www.six-group.com-select-fix.css",
+        },
+      ],
+    },
+  },
 ];
 
 module.exports = AVAILABLE_INJECTIONS;

mobile/android/android-components/components/feature/webcompat/src/main/assets/extensions/webcompat/injections/css/bug1886616-www.six-group.com-select-fix.css

@@ -0,0 +1,15 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/**
+ * www.six-group.com - Selected input values are hidden
+ * Bug #1886616 - https://bugzilla.mozilla.org/show_bug.cgi?id=1886616
+ * WebCompat issue #129271 - https://webcompat.com/issues/129271
+ *
+ * The page is hiding CSS content, which is not interoperable. In this
+ * case, it causes their select dropdown's values to be hidden.
+ */
+select {
+  content: normal;
+}

testing/webcompat/client.py

@@ -5,9 +5,12 @@
 import asyncio
 import contextlib
 import time
+from base64 import b64decode
+from io import BytesIO
 from urllib.parse import quote
 
 import webdriver
+from PIL import Image
 from webdriver.bidi.modules.script import ContextTarget
 
 
@@ -757,3 +760,12 @@ class Client:
           """,
             args=[element],
         )
+
+    def is_one_solid_color(self, element, max_fuzz=8):
+        # max_fuzz is needed as screenshots can have slight color bleeding/fringing
+        shotb64 = element.screenshot()
+        shot = Image.open(BytesIO(b64decode(shotb64))).convert("RGB")
+        for min, max in shot.getextrema():
+            if max - min > max_fuzz:
+                return False
+        return True

testing/webcompat/interventions/tests/test_1886616_www_six-group_com.py

@@ -0,0 +1,41 @@
+import pytest
+from webdriver.error import NoSuchElementException
+
+URL = "https://www.six-group.com/en/market-data/etf/etf-explorer.html"
+COOKIES_CSS = "#onetrust-consent-sdk"
+SELECT_CSS = "select[name='Dropdown']:has(option[value='active'])"
+
+
+async def select_value_is_visible(client):
+    try:
+        cookies = client.await_css(COOKIES_CSS, is_displayed=True, timeout=5)
+        client.remove_element(cookies)
+    except NoSuchElementException:
+        pass
+
+    select = client.await_css(SELECT_CSS, is_displayed=True)
+    assert select
+    # remove the border and background from the select, so only the text
+    # should influence the screenshot.
+    client.execute_script(
+        """
+        arguments[0].style.border = 'none';
+        arguments[0].style.background = '#fff';
+    """,
+        select,
+    )
+    return not client.is_one_solid_color(select)
+
+
+@pytest.mark.asyncio
+@pytest.mark.with_interventions
+async def test_enabled(client):
+    await client.navigate(URL)
+    assert await select_value_is_visible(client)
+
+
+@pytest.mark.asyncio
+@pytest.mark.without_interventions
+async def test_disabled(client):
+    await client.navigate(URL)
+    assert not await select_value_is_visible(client)

testing/webcompat/requirements.txt

@@ -1,3 +1,4 @@
 asyncio==3.4.3
+pillow==10.3.0
 pytest-asyncio==0.16.0
 urllib3==1.26