Update jupytercad and add visual regression tests

.github/workflows/build.yml

@@ -76,6 +76,73 @@ jobs:
           jupyter labextension list 2>&1 | grep -ie "@jupytercad/jupytercad-freecad.*OK"
           python -m jupyterlab.browser_check --no-browser-test
 
+  integration-tests:
+    name: Integration tests
+    needs: build
+    runs-on: ubuntu-latest
+
+    env:
+      PLAYWRIGHT_BROWSERS_PATH: ${{ github.workspace }}/pw-browsers
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Conda environment with Micromamba
+        uses: mamba-org/setup-micromamba@v1
+        with:
+          micromamba-version: '1.5.5-0'
+          environment-name: cad
+          create-args: >-
+            python=3.10
+            jupyterlab=4
+            freecad=0.21.2
+
+      - name: Download extension package
+        uses: actions/download-artifact@v3
+        with:
+          name: extension-artifacts
+
+      - name: Install the extension
+        shell: bash -l {0}
+        run: |
+          set -eux
+          pip install "jupyterlab>=4.0.0,<5" "jupytercad>=1.0.0a3" jupytercad_freecad*.whl
+
+      - name: Install dependencies
+        shell: bash -l {0}
+        working-directory: ui-tests
+        env:
+          PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1
+        run: jlpm install
+
+      - name: Set up browser cache
+        uses: actions/cache@v3
+        with:
+          path: |
+            ${{ github.workspace }}/pw-browsers
+          key: ${{ runner.os }}-${{ hashFiles('ui-tests/yarn.lock') }}
+
+      - name: Install browser
+        shell: bash -l {0}
+        run: npx playwright install chromium
+        working-directory: ui-tests
+
+      - name: Execute integration tests
+        shell: bash -l {0}
+        working-directory: ui-tests
+        run: |
+          npx playwright test
+
+      - name: Upload Playwright Test report
+        if: always()
+        uses: actions/upload-artifact@v3
+        with:
+          name: jupytercad-playwright-tests
+          path: |
+            ui-tests/test-results
+            ui-tests/playwright-report
+
   check_links:
     name: Check Links
     runs-on: ubuntu-latest

.gitignore

@@ -119,3 +119,7 @@ dmypy.json
 
 # Yarn cache
 .yarn/
+
+**/ui-tests/test-results/
+**/ui-tests/playwright-report/
+**/*/.jupyter_ystore.db

package.json

@@ -122,6 +122,8 @@
         "node_modules",
         "dist",
         "coverage",
+        "ui-tests",
+        "**/build/",
         "**/*.d.ts"
     ],
     "eslintConfig": {

pyproject.toml

@@ -29,7 +29,7 @@ classifiers = [
 dependencies = [
     "jupyter_ydoc>=1.1.0,<2",
     "y-py>=0.6.0,<0.7",
-    "jupytercad_core>=1.0.0a1,<2",
+    "jupytercad_core>=1.0.0a3,<2",
 ]
 dynamic = ["version", "description", "authors", "urls", "keywords"]
 

src/plugins.ts

@@ -108,6 +108,7 @@ const activate = async (
     app.shell.activateById('jupytercad::leftControlPanel');
     app.shell.activateById('jupytercad::rightControlPanel');
   });
+  console.log('jupytercad:fcplugin is activated!');
 };
 
 export const fcplugin: JupyterFrontEndPlugin<void> = {

ui-tests/jupyter_server_test_config.py

@@ -0,0 +1,13 @@
+"""Server configuration for integration tests.
+
+!! Never use this configuration in production because it
+opens the server to the world and provide access to JupyterLab
+JavaScript objects through the global window variable.
+"""
+
+from jupyterlab.galata import configure_jupyter_server
+
+configure_jupyter_server(c)  # noqa F821
+c.LabApp.collaborative = True  # noqa F821
+# Uncomment to set server log level to debug level
+# c.ServerApp.log_level = "DEBUG"

ui-tests/package.json

@@ -0,0 +1,20 @@
+{
+    "name": "jupytercad-freecad-ui-tests",
+    "version": "1.0.0",
+    "description": "jupytercad-freecad Integration Tests",
+    "private": true,
+    "scripts": {
+        "start": "jupyter lab --config jupyter_server_test_config.py",
+        "test": "npx playwright test",
+        "test:update": "npx playwright test --update-snapshots",
+        "test:debug": "PWDEBUG=1 npx playwright test"
+    },
+    "devDependencies": {
+        "@jupyterlab/galata": "^5.0.8",
+        "@playwright/test": "^1.32.0",
+        "@types/klaw-sync": "^6.0.1"
+    },
+    "dependencies": {
+        "klaw-sync": "^6.0.0"
+    }
+}

ui-tests/playwright.config.js

@@ -0,0 +1,24 @@
+/**
+ * Configuration for Playwright using default from @jupyterlab/galata
+ */
+const baseConfig = require('@jupyterlab/galata/lib/playwright-config');
+
+module.exports = {
+  ...baseConfig,
+  webServer: {
+    command: 'jlpm start',
+    url: 'http://localhost:8888/lab',
+    timeout: 120 * 1000,
+    reuseExistingServer: false
+  },
+  retries: 0,
+  use: {
+    ...baseConfig.use,
+    trace: 'off'
+  },
+  expect: {
+    toMatchSnapshot: {
+      maxDiffPixelRatio: 0.02
+    }
+  }
+};