Add UI tests with voila-fps

Author: davidbrochart

.github/workflows/ui-tests.yml

@@ -48,6 +48,8 @@ jobs:
         run: |
           python -m pip install --upgrade pip jupyterlab~=3.0 numpy bqplot matplotlib ipympl==0.8.0 ipyvolume scipy
           python -m pip install ".[test]"
+          python -m pip install fps[uvicorn]
+          python -m pip install fps_plugins/voila
           jlpm
           jlpm build
           jupyter labextension develop . --overwrite
@@ -59,6 +61,7 @@ jobs:
           cd ui-tests
           # Mount a volume to overwrite the server configuration
           jlpm start 2>&1 > /tmp/jupyterlab_server.log &
+          jlpm start-fps 2>&1 > /tmp/fps_server.log &
 
       - name: Install browser
         run: |
@@ -108,6 +111,8 @@ jobs:
           # Save PR number for comment publication
           echo "${{ github.event.number }}" > ./benchmark-results/NR
 
+          jlpm run test-fps
+
       - name: Upload Playwright Test assets
         if: always()
         uses: actions/upload-artifact@v2
@@ -135,5 +140,7 @@ jobs:
       - name: Print JupyterLab logs
         if: always()
         run: |
+          echo "Voila log:"
           cat /tmp/jupyterlab_server.log
-
+          echo "Voila-FPS log:"
+          cat /tmp/fps_server.log

fps_plugins/voila/fps_voila/routes.py

@@ -44,6 +44,7 @@ def render_template(self, name, **kwargs):
 
 class FPSVoilaHandler(_VoilaHandler):
     is_fps = True
+    request = Config()
     fps_arguments = {}
     html = []
 
@@ -134,7 +135,11 @@ async def shutdown_kernel(kernel_id):
 
 @router.get("/notebooks/{path:path}")
 async def get_root(path, voila_template: Optional[str] = None, voila_theme: Optional[str] = None):
-        return StreamingResponse(_get(fps_voila_handler, path))
+    fps_voila_handler.request.query = request.query_params
+    fps_voila_handler.request.path = request.url.path
+    fps_voila_handler.request.host = f"{request.url.hostname}:{request.url.port}"
+    fps_voila_handler.request.headers = request.headers
+    return StreamingResponse(_get(fps_voila_handler, path))
 
 @router.get("/")
 async def get_root(request: Request, voila_template: Optional[str] = None, voila_theme: Optional[str] = None):
@@ -148,13 +153,21 @@ async def get_root(request: Request, voila_template: Optional[str] = None, voila
             fps_voila_tree_handler.request.path = request.url.path
             return _get_tree(fps_voila_tree_handler, "/")
     else:
+        fps_voila_handler.request.query = request.query_params
+        fps_voila_handler.request.path = request.url.path
+        fps_voila_handler.request.host = f"{request.url.hostname}:{request.url.port}"
+        fps_voila_handler.request.headers = request.headers
         return StreamingResponse(_get(fps_voila_handler, ""))
 
 @router.get("/voila/render/{path:path}")
 async def get_path(request: Request, path):
     if C.notebook_path:
         raise HTTPException(status_code=404, detail="Not found")
     else:
+        fps_voila_handler.request.query = request.query_params
+        fps_voila_handler.request.path = request.url.path
+        fps_voila_handler.request.host = f"{request.url.hostname}:{request.url.port}"
+        fps_voila_handler.request.headers = request.headers
         return StreamingResponse(_get(fps_voila_handler, path))
 
 @router.get("/voila/tree{path:path}")

ui-tests/package.json

@@ -5,11 +5,13 @@
   "private": true,
   "scripts": {
     "start": "voila ../notebooks --no-browser",
+    "start-fps": "voila ../notebooks --no-browser --fps --port=8867",
     "start:detached": "yarn run start-jlab&",
-    "test": "playwright test",
-    "test:debug": "PWDEBUG=1 playwright test",
+    "test": "playwright test --project voila",
+    "test-fps": "playwright test --project voila-fps",
+    "test:debug": "PWDEBUG=1 playwright test --project voila",
     "test:report": "http-server ./playwright-report -a localhost -o",
-    "test:update": "playwright test --update-snapshots"
+    "test:update": "playwright test --project voila --update-snapshots"
   },
   "author": "Project Jupyter",
   "license": "BSD-3-Clause",

ui-tests/playwright.config.js

@@ -1,20 +1,36 @@
 const baseConfig = require('@jupyterlab/galata/lib/playwright-config');
 
 module.exports = {
-  ...baseConfig,
-  timeout: 240000,
+  projects: [
+    {
+      ...baseConfig,
+      name: 'voila',
+      timeout: 240000,
+      use: {
+        baseURL: 'http://localhost:8866/voila/',
+        video: 'retain-on-failure'
+      },
+      // Try one retry as some tests are flaky
+      retries: 1
+    },
+    {
+      ...baseConfig,
+      name: 'voila-fps',
+      timeout: 240000,
+      use: {
+        baseURL: 'http://localhost:8867/voila/',
+        video: 'retain-on-failure'
+      },
+      // Try one retry as some tests are flaky
+      retries: 1
+    }
+  ],
   reporter: [
     [process.env.CI ? 'dot' : 'list'],
     [
       '@jupyterlab/galata/lib/benchmarkReporter',
       { outputFile: 'voila-benchmark.json' }
     ],
     ['html']
-  ],
-  use: {
-    baseURL: 'http://localhost:8866/voila/',
-    video: 'retain-on-failure'
-  },
-  // Try one retry as some tests are flaky
-  retries: 1
+  ]
 };

voila/handler.py

@@ -44,25 +44,25 @@ async def _get(self: "_VoilaHandler", path=None):
 
     # Adding request uri to kernel env
     kernel_env = os.environ.copy()
+    kernel_env[ENV_VARIABLE.SCRIPT_NAME] = self.request.path
+    kernel_env[
+        ENV_VARIABLE.PATH_INFO
+    ] = ''  # would be /foo/bar if voila.ipynb/foo/bar was supported
+    kernel_env[ENV_VARIABLE.QUERY_STRING] = str(self.request.query)
+    kernel_env[ENV_VARIABLE.SERVER_SOFTWARE] = 'voila/{}'.format(__version__)
+    host, port = split_host_and_port(self.request.host.lower())
+    kernel_env[ENV_VARIABLE.SERVER_PORT] = str(port) if port else ''
+    kernel_env[ENV_VARIABLE.SERVER_NAME] = host
+    # Add HTTP Headers as env vars following rfc3875#section-4.1.18
+    if len(self.voila_configuration.http_header_envs) > 0:
+        for header_name in self.request.headers:
+            config_headers_lower = [header.lower() for header in self.voila_configuration.http_header_envs]
+            # Use case insensitive comparison of header names as per rfc2616#section-4.2
+            if header_name.lower() in config_headers_lower:
+                env_name = f'HTTP_{header_name.upper().replace("-", "_")}'
+                kernel_env[env_name] = self.request.headers.get(header_name)
     if not self.is_fps:
-        kernel_env[ENV_VARIABLE.SCRIPT_NAME] = self.request.path
-        kernel_env[
-            ENV_VARIABLE.PATH_INFO
-        ] = ''  # would be /foo/bar if voila.ipynb/foo/bar was supported
-        kernel_env[ENV_VARIABLE.QUERY_STRING] = str(self.request.query)
-        kernel_env[ENV_VARIABLE.SERVER_SOFTWARE] = 'voila/{}'.format(__version__)
         kernel_env[ENV_VARIABLE.SERVER_PROTOCOL] = str(self.request.version)
-        host, port = split_host_and_port(self.request.host.lower())
-        kernel_env[ENV_VARIABLE.SERVER_PORT] = str(port) if port else ''
-        kernel_env[ENV_VARIABLE.SERVER_NAME] = host
-        # Add HTTP Headers as env vars following rfc3875#section-4.1.18
-        if len(self.voila_configuration.http_header_envs) > 0:
-            for header_name in self.request.headers:
-                config_headers_lower = [header.lower() for header in self.voila_configuration.http_header_envs]
-                # Use case insensitive comparison of header names as per rfc2616#section-4.2
-                if header_name.lower() in config_headers_lower:
-                    env_name = f'HTTP_{header_name.upper().replace("-", "_")}'
-                    kernel_env[env_name] = self.request.headers.get(header_name)
 
     template_arg = self.get_argument("voila-template", None)
     theme_arg = self.get_argument("voila-theme", None)