Merge pull request alexmojaki#406 from alexmojaki/saucelabs

Saucelabs

Author: alexmojaki

.github/workflows/workflow.yml

@@ -1,8 +1,8 @@
-name: Build, test, deploy
+name: CI
 on: [push, pull_request]
 jobs:
   test:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-20.04
     steps:
     - uses: actions/checkout@v2
     - name: Set up Python
@@ -25,10 +25,20 @@ jobs:
         REACT_APP_FIREBASE_STAGING: '1'
         FUTURECODER_LANGUAGE: en
       run: ./scripts/build.sh
+    - name: Saucelabs tunnel
+      uses: saucelabs/sauce-connect-action@v2
+      with:
+          username: ${{ secrets.SAUCE_USERNAME }}
+          accessKey: ${{ secrets.SAUCE_ACCESS_KEY }}
+          tunnelName: github-action-tunnel
+          region: eu-central
     - name: Test
       env:
         FUTURECODER_LANGUAGE: en
         FIREBASE_TOKEN: '1//03I37hFeN4kn3CgYIARAAGAMSNwF-L9IrUvqofZbhOkS8YMtQBhw_bu2TpWYC5MHvnaZDsWPP0KJMypXPyoxogkl8A6p2RxPJQwQ'
+        SAUCE_TUNNEL: github-action-tunnel
+        SAUCE_USERNAME: ${{ secrets.SAUCE_USERNAME }}
+        SAUCE_ACCESS_KEY: ${{ secrets.SAUCE_ACCESS_KEY }}
       run: ./scripts/ci_test.sh
     - name: Upload test artifacts
       uses: actions/upload-artifact@v2

README.md

@@ -1,5 +1,8 @@
 <p align="center">
-  <img src="homepage/static/logo/bordered2.png" width="300px" height="300px" alt="logo">
+      <a href="https://github.com/alexmojaki/futurecoder/blob/master/LICENSE.txt"><img src="https://img.shields.io/github/license/alexmojaki/futurecoder?style=flat" alt="MIT license" align="left"></a>
+      <a href="https://github.com/alexmojaki/futurecoder/actions"><img src="https://github.com/alexmojaki/futurecoder/workflows/CI/badge.svg" alt="Tests status" align="left"></a>
+      <img src="homepage/static/logo/bordered2.png" width="300px" height="300px" alt="logo">
+      <a href="https://saucelabs.com"><img src="https://opensource.saucelabs.com/images/opensauce/powered-by-saucelabs-badge-gray.png?sanitize=true" alt="Testing Powered By SauceLabs" align="right"></a>
 </p>
 
 <h1 align="center"><code>futurecoder</code></h1>

scripts/ci_test.sh

@@ -4,7 +4,5 @@ set -eux
 
 # Run tests in CI, i.e. GitHub Actions
 
-export DISPLAY=:99
-chromedriver --url-base=/wd/hub &
 npm install -g firebase-tools
 firebase emulators:exec "poetry run pytest tests"

tests/test_frontend.py

@@ -1,3 +1,4 @@
+import os
 import sys
 from pathlib import Path
 from time import sleep
@@ -17,30 +18,82 @@
 assets_dir = this_dir / "test_frontend_assets"
 assets_dir.mkdir(exist_ok=True)
 
+sauce_tunnel = os.environ.get("SAUCE_TUNNEL")
 
-def test_frontend():
-    options = Options()
-    options.add_argument("--headless")
-    options.add_argument("--disable-gpu")
-    desired_capabilities = DesiredCapabilities.CHROME
-    desired_capabilities["goog:loggingPrefs"] = {"browser": "ALL"}
-    driver = webdriver.Chrome(
-        options=options, desired_capabilities=desired_capabilities
-    )
+
+def get_driver(caps):
+    if sauce_tunnel:
+        desired_capabilities = {
+            **caps,
+            "sauce:options": {
+                "tunnelName": sauce_tunnel,
+                "name": "futurecoder",
+            },
+        }
+        url = "https://{SAUCE_USERNAME}:{SAUCE_ACCESS_KEY}@ondemand.eu-central-1.saucelabs.com:443/wd/hub".format(
+            **os.environ
+        )
+        driver = webdriver.Remote(
+            command_executor=url,
+            desired_capabilities=desired_capabilities,
+        )
+    else:
+        options = Options()
+        options.add_argument("--headless")
+        options.add_argument("--disable-gpu")
+        desired_capabilities = DesiredCapabilities.CHROME
+        desired_capabilities["goog:loggingPrefs"] = {"browser": "ALL"}
+        driver = webdriver.Chrome(
+            options=options, desired_capabilities=desired_capabilities
+        )
     driver.set_window_size(1024, 768)
     driver.implicitly_wait(5)
+    return driver
+
+
+def params():
+    if not sauce_tunnel:
+        yield None
+        return
+    for os_name, extra_browser, os_versions in [
+        ["Windows", "MicrosoftEdge", ["11", "10"]],
+        ["macOS", "Safari", ["12", "11.00"]],
+    ]:
+        for os_version in os_versions[:1]:  # TODO use all versions
+            for browser in ["Chrome", "Firefox", extra_browser]:
+                caps = dict(
+                    platform=f"{os_name} {os_version}",
+                    version="latest",
+                    browserName=browser,
+                )
+                if browser == "Safari" and os_version == "12":
+                    yield caps | {"version": "15"}
+                else:
+                    yield caps
+                return  # TODO
+
+
+@pytest.mark.parametrize("caps", list(params()))
+def test_frontend(caps):
+    driver = get_driver(caps)
+    status = "failed"
     try:
         _tests(driver)
+        status = "passed"
     finally:
-        driver.save_screenshot(str(assets_dir / "screenshot.png"))
-        (assets_dir / "logs.txt").write_text(
-            "\n".join(entry["message"] for entry in driver.get_log("browser"))
-        )
-        (assets_dir / "page_source.html").write_text(driver.page_source)
-        (assets_dir / "state.json").write_text(
-            driver.execute_script("return JSON.stringify(reduxStore.getState())")
-        )
-        driver.close()
+        if sauce_tunnel:
+            driver.execute_script(f"sauce:job-result={status}")
+        try:
+            driver.save_screenshot(str(assets_dir / "screenshot.png"))
+            (assets_dir / "logs.txt").write_text(
+                "\n".join(entry["message"] for entry in driver.get_log("browser"))
+            )
+            (assets_dir / "page_source.html").write_text(driver.page_source)
+            (assets_dir / "state.json").write_text(
+                driver.execute_script("return JSON.stringify(reduxStore.getState())")
+            )
+        finally:
+            driver.quit()
 
 
 def _tests(driver):