Switch to dev-mode for ui-tests

Fixes #10528

.github/workflows/ui-tests.yml

@@ -14,6 +14,8 @@ jobs:
         run: |
           docker-compose -f "./ui-tests/docker/docker-compose.yml" down || true
           docker-compose -f "./ui-tests/docker/docker-compose.yml" pull
+          /bin/sh ./scripts/build_docker.sh
+          docker-compose -f "./ui-tests/docker/docker-compose.yml" build
           docker-compose -f "./ui-tests/docker/docker-compose.yml" run --rm e2e
 
       - name: Upload UI Test artifacts

.gitignore

@@ -114,3 +114,4 @@ junit.xml
 
 ui-tests/test-output
 ui-tests/jlab_root
+package_json.tar.gz

Dockerfile

@@ -1,57 +1,46 @@
-# Build image
 FROM mambaorg/micromamba:0.14.0 as build
 
 # Install basic tools
-RUN micromamba install -qy -c conda-forge python nodejs yarn=1.21 build
-
-# Install python dependencies - faster build thanks to caching
-COPY setup.cfg /tmp
-
-RUN list_package=$(python -c "from configparser import ConfigParser; c = ConfigParser(); c.read('/tmp/setup.cfg'); print(' '.join(c['options']['install_requires'].strip().splitlines()))") \
-    && micromamba install -qy -c conda-forge $list_package
-
-# Build JupyterLab wheel
-COPY ./builder /tmp/jupyterlab-dev/builder
-COPY ./buildutils /tmp/jupyterlab-dev/buildutils
-COPY ./dev_mode /tmp/jupyterlab-dev/dev_mode
-COPY ./jupyterlab /tmp/jupyterlab-dev/jupyterlab
-COPY ./packages /tmp/jupyterlab-dev/packages
-COPY ./scripts /tmp/jupyterlab-dev/scripts
-COPY ./*.* ./LICENSE /tmp/jupyterlab-dev/
-
-RUN pushd /tmp/jupyterlab-dev \
-    && pip install -e . \
-    && jlpm install \
-    && jlpm run build \
-    && python -m build .
-
-# Runtime image
-FROM mambaorg/micromamba:0.14.0
-
-RUN micromamba install -qy -c conda-forge python \
+RUN micromamba install -qy -c conda-forge python nodejs yarn=1.21 build \
     && useradd --shell /bin/bash jovyan \
     && chown jovyan $HOME
 
+# Install npm packages - faster build thanks to caching
+## package_json.tar.gz contains all package.json files using 
+## `tar cvf package_json.tar.gz package.json packages/*/package.package_json`
+ADD ./package_json.tar.gz /tmp/jupyterlab-dev
+COPY yarn.lock /tmp/jupyterlab-dev
+
+RUN cd /tmp/jupyterlab-dev \
+    && yarn install --ignore-scripts
+
 # Install python dependencies - faster build thanks to caching
 COPY setup.cfg /tmp
 
 RUN list_package=$(python -c "from configparser import ConfigParser; c = ConfigParser(); c.read('/tmp/setup.cfg'); print(' '.join(c['options']['install_requires'].strip().splitlines()))") \
     && micromamba install -qy -c conda-forge $list_package \
-    && micromamba clean --all --yes \
+    && micromamba clean -ay \
     && rm /tmp/setup.cfg
 
+# Install JupyterLab
+COPY ./builder/ /tmp/jupyterlab-dev/builder/
+COPY ./buildutils/ /tmp/jupyterlab-dev/buildutils/
+COPY ./dev_mode/ /tmp/jupyterlab-dev/dev_mode/
+COPY ./jupyterlab/ /tmp/jupyterlab-dev/jupyterlab/
+COPY ./packages/ /tmp/jupyterlab-dev/packages/
+COPY ./scripts/ /tmp/jupyterlab-dev/scripts/
+COPY ./*.* ./LICENSE /tmp/jupyterlab-dev/
+
+RUN pushd /tmp/jupyterlab-dev \
+    && pip install -e .[ui-tests] \
+    && chown -R jovyan /tmp/jupyterlab-dev
+
 USER jovyan
 WORKDIR ${HOME}
 
-# Install JupyterLab
 ENV PATH="/home/micromamba/.local/bin:$PATH"
 
-COPY --from=build /tmp/jupyterlab-dev/dist/jupyterlab*.whl /tmp
-
-RUN pip install /tmp/jupyterlab*.whl \
-    # TODO remove when ipykernel 6 is released
-    && pip install --pre --upgrade ipykernel \
-    && mkdir -p /home/micromamba/jlab_root
+RUN mkdir -p /home/micromamba/jlab_root
 
 COPY ./docker/jupyter_server_config.json /etc/jupyter/
 

docker/jupyter_server_config.json

@@ -5,5 +5,8 @@
     "port": 8888,
     "open_browser": false,
     "root_dir": "/home/micromamba/jlab_root"
+  },
+  "LabApp": {
+    "dev_mode": true
   }
 }

packages/apputils/src/sessioncontext.tsx

@@ -132,7 +132,15 @@ export interface ISessionContext extends IObservableDisposable {
   kernelPreference: ISessionContext.IKernelPreference;
 
   /**
-   * The sensible display name for the kernel, or "No Kernel"
+   * Whether the kernel is "No Kernel" or not.
+   *
+   * #### Notes
+   * As the displayed name is translated, this can be used directly.
+   */
+  readonly hasNoKernel: boolean;
+
+  /**
+   * The sensible display name for the kernel, or translated "No Kernel"
    *
    * #### Notes
    * This is at this level since the underlying kernel connection does not
@@ -478,6 +486,16 @@ export class SessionContext implements ISessionContext {
    */
   readonly specsManager: KernelSpec.IManager;
 
+  /**
+   * Whether the kernel is "No Kernel" or not.
+   *
+   * #### Notes
+   * As the displayed name is translated, this can be used directly.
+   */
+  get hasNoKernel(): boolean {
+    return this.kernelDisplayName === this.noKernelName;
+  }
+
   /**
    * The display name of the current kernel, or a sensible alternative.
    *
@@ -487,8 +505,8 @@ export class SessionContext implements ISessionContext {
    */
   get kernelDisplayName(): string {
     const kernel = this.session?.kernel;
-    if (this._pendingKernelName === this._trans.__('No Kernel')) {
-      return this._trans.__('No Kernel');
+    if (this._pendingKernelName === this.noKernelName) {
+      return this.noKernelName;
     }
     if (
       !kernel &&
@@ -508,7 +526,7 @@ export class SessionContext implements ISessionContext {
         name = this.specsManager.specs?.kernelspecs[name]?.display_name ?? name;
         return name;
       }
-      return this._trans.__('No Kernel');
+      return this.noKernelName;
     }
     if (this._pendingKernelName) {
       return (
@@ -517,7 +535,7 @@ export class SessionContext implements ISessionContext {
       );
     }
     if (!kernel) {
-      return this._trans.__('No Kernel');
+      return this.noKernelName;
     }
     return (
       this.specsManager.specs?.kernelspecs[kernel.name]?.display_name ??
@@ -543,7 +561,7 @@ export class SessionContext implements ISessionContext {
       return 'restarting';
     }
 
-    if (this._pendingKernelName === this._trans.__('No Kernel')) {
+    if (this._pendingKernelName === this.noKernelName) {
       return 'idle';
     }
 
@@ -588,6 +606,13 @@ export class SessionContext implements ISessionContext {
     return this._disposed;
   }
 
+  /**
+   * Get the constant displayed name for "No Kernel"
+   */
+  protected get noKernelName(): string {
+    return this._trans.__('No Kernel');
+  }
+
   /**
    * Dispose of the resources held by the context.
    */
@@ -668,7 +693,7 @@ export class SessionContext implements ISessionContext {
     }
     await this._initStarted.promise;
     this._pendingSessionRequest = '';
-    this._pendingKernelName = this._trans.__('No Kernel');
+    this._pendingKernelName = this.noKernelName;
     return this._shutdownSession();
   }
 
@@ -1216,8 +1241,8 @@ export const sessionContextDialogs: ISessionContext.IDialogs = {
     // If there is no existing kernel, offer the option
     // to keep no kernel.
     let label = trans.__('Cancel');
-    if (sessionContext.kernelDisplayName === trans.__('No Kernel')) {
-      label = trans.__('No Kernel');
+    if (sessionContext.hasNoKernel) {
+      label = sessionContext.kernelDisplayName;
     }
     const buttons = [
       Dialog.cancelButton({ label }),
@@ -1235,10 +1260,7 @@ export const sessionContextDialogs: ISessionContext.IDialogs = {
       return;
     }
     const model = result.value;
-    if (
-      model === null &&
-      sessionContext.kernelDisplayName !== trans.__('No Kernel')
-    ) {
+    if (model === null && !sessionContext.hasNoKernel) {
       return sessionContext.shutdown();
     }
     if (model) {
@@ -1347,7 +1369,7 @@ namespace Private {
       selector,
       options,
       translator,
-      sessionContext.kernelDisplayName
+      !sessionContext.hasNoKernel ? sessionContext.kernelDisplayName : null
     );
     body.appendChild(selector);
     return body;
@@ -1424,7 +1446,7 @@ namespace Private {
     node: HTMLSelectElement,
     options: SessionContext.IKernelSearch,
     translator?: ITranslator,
-    currentKernelDisplayName?: string
+    currentKernelDisplayName: string | null = null
   ): void {
     while (node.firstChild) {
       node.removeChild(node.firstChild);

scripts/build_docker.sh

@@ -0,0 +1,11 @@
+#! /bin/sh
+# This script build the JupyterLab image
+if [ -d ${PWD}/packages ]; then
+    echo Create package.json files archive
+    tar cf /tmp/package_json.tar.gz package.json packages/*/package.json
+    cp /tmp/package_json.tar.gz ${PWD}
+    echo Build JupyterLab docker
+    docker build -f Dockerfile -t jupyterlab-dev ${PWD}
+else
+    echo You need to run this script from the JupyterLab root folder
+fi

setup.cfg

@@ -39,6 +39,7 @@ install_requires =
 
 [options.extras_require]
 test = coverage; pytest>=6.0; pytest-cov; pytest-console-scripts; pytest-check-links>=0.5; jupyterlab_server[test]~=2.2; requests; requests_cache; virtualenv; check-manifest
+ui-tests = ipykernel>=6.0
 
 [options.entry_points]
 console_scripts =

ui-tests/README.md

@@ -16,6 +16,9 @@ import { galata, describe, test } from '@jupyterlab/galata';
 5. If you added visual regression tests, make sure you tested them locally enough number of times to make sure they do not produce false positives due to async nature of UI actions. Use the following steps to test locally (it requires [docker](https://docs.docker.com/engine/) and [docker-compose](https://docs.docker.com/compose/install/)).
 
 ```bash
+# Build the JupyterLab docker to be tested
+/bin/sh ./scripts/build_docker.sh
+
 # run UI tests once to create test captures to use as reference images for your new feature
 docker-compose -f "./ui-tests/docker/docker-compose.yml" run --rm e2e yarn run test:create-references --jlab-base-url=http://jupyterlab:8888
 
@@ -24,8 +27,13 @@ docker-compose -f "./ui-tests/docker/docker-compose.yml" run --rm e2e yarn run t
 
 # run UI tests locally, repeatedly. make sure no test fails. wait for 10-20 successful repeats
 docker-compose -f "./ui-tests/docker/docker-compose.yml" run --rm e2e
+
+# Stop the docker stack
+docker-compose -f "./ui-tests/docker/docker-compose.yml" down
 ```
 
+> You can access the server logs by running `docker logs jupyterlab`
+
 6. Once you are done testing locally, push the new references on your PR and check CI is passing.
 
 7. If your tests are failing or if you want to debug UI tests, you can use the script `yarn run test:debug --include=...` by specifying the particular test suite(s) you want to debug. Check [Galata CLI Options](https://github.com/jupyterlab/galata#command-line-options) for list of available command-line options.

ui-tests/docker/docker-compose.yml

@@ -3,9 +3,8 @@ version: '3.5'
 services:
   lab:
     container_name: jupyterlab
-    build:
-      context: ../..
-      dockerfile: ./Dockerfile
+    # Need to be built running script: scripts/build_docker.sh
+    image: jupyterlab-dev
     command:
       [
         '--ServerApp.token=',
@@ -21,6 +20,9 @@ services:
   e2e:
     build:
       context: ..
+    environment:
+      SERVER_URL: 'jupyterlab:8888'
+      TIMEOUT: 180
     command: ['yarn', 'run', 'test', '--jlab-base-url=http://jupyterlab:8888']
     # See https://playwright.dev/docs/docker/#run-the-image
     ipc: host

ui-tests/docker/run-e2e.sh

@@ -2,4 +2,4 @@
 # Trick to get the galata test outputs writable on the host
 umask 0000
 # Wait for jupyterlab container to be ready
-/opt/galata/wait-for-it.sh jupyterlab:8888 --strict --timeout=10 -- $*
+/opt/galata/wait-for-it.sh ${SERVER_URL} --strict --timeout=${TIMEOUT:-120} -- $*