Use esbuild for all webviews (#14458)

* Use esbuild for bundling widget scripts * Rename file * Use esbuild for everything but DF viewer * Fix typo * oops * Fix data explorer to use esbuild as well * add comments * fix formatting * Fix linters * oops * Reduce noise in logs * Always compile * Disable caching * Reduce logging * Remove unwanated items * oops * Fix post install * Add comments * Caching of output * oops * oops * Skip caching * Faster npm installs * Faster tests * Faster yet again * Revert
microsoft · Oct 6, 2023 · ed15def · ed15def
1 parent 5bf5b91
commit ed15def
Show file tree

Hide file tree

Showing 31 changed files with 2,001 additions and 389 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1 @@
+build/*
diff --git a/.github/actions/build-vsix/action.yml b/.github/actions/build-vsix/action.yml
@@ -9,7 +9,7 @@ outputs:
 runs:
   using: 'composite'
   steps:
-    - run: npm ci --prefer-offline
+    - run: npm ci --prefer-offline --no-audit
       env:
         npm_config_build_from_source: true
       shell: bash

diff --git a/.github/workflows/build-test.yml b/.github/workflows/build-test.yml
@@ -137,10 +137,16 @@ jobs:
           path: ~/.npm
           key: ${{runner.os}}-${{env.CACHE_NPM_DEPS}}-${{hashFiles('package-lock.json')}}
 
+      - name: Cache the out/ directory
+        uses: actions/cache@v3
+        with:
+          path: ./out
+          key: ${{runner.os}}-${{env.CACHE_OUT_DIRECTORY}}-${{hashFiles('src/**')}}
+
       # This is faster than running `npm ci`, we do not want to build zmq, etc.
       # Let that happen in other jobs, this job needs to be fast
       - name: npm ci
-        run: npm ci --ignore-scripts
+        run: npm ci --ignore-scripts --prefer-offline --no-audit
 
       - name: npm run postinstall
         run: npm run postinstall
@@ -172,12 +178,6 @@ jobs:
       - name: Run gulp prePublishNonBundle
         run: npm run prePublishNonBundle
 
-      - name: Cache the out/ directory
-        uses: actions/cache@v3
-        with:
-          path: ./out
-          key: ${{runner.os}}-${{env.CACHE_OUT_DIRECTORY}}-${{hashFiles('src/**')}}
-
       - name: Check dependencies
         run: npm run checkDependencies
 
@@ -244,16 +244,14 @@ jobs:
       # This is faster than running `npm ci`, we do not want to build zmq, etc.
       # Let that happen in other jobs, this job needs to be fast
       - name: npm ci
-        run: npm ci --ignore-scripts
+        run: npm ci --ignore-scripts --prefer-offline --no-audit
 
       - name: npm run postinstall
         run: npm run postinstall
 
       - name: Compile if not cached
         run: npm run prePublishNonBundle
         if: steps.out-cache.outputs.cache-hit != 'true'
-        env:
-          CI_JUPYTER_FAST_COMPILATION: 'true'
 
       - name: Run TypeScript unit tests
         id: test_unittests
@@ -604,7 +602,7 @@ jobs:
       # Let that happen in other jobs, this job needs to be super fast for linting
       - name: npm ci
         if: matrix.jupyterConnection != 'web'
-        run: npm ci --ignore-scripts
+        run: npm ci --ignore-scripts --prefer-offline --no-audit
 
       - name: npm run postinstall
         if: matrix.jupyterConnection != 'web'
@@ -615,52 +613,53 @@ jobs:
         run: sudo apt-get install imagemagick x11-xserver-utils
 
         # This step is slow.
-      - name: Compile if not cached
+      - name: Compile # if not cached
         run: npm run prePublishNonBundle
-        if: steps.out-cache.outputs.cache-hit != 'true'
+        # Do not cache for web tests, as the code generated in the compiled code is different for each matrix in web tests
+        # Rememeber the compiled code contains injected tests, and the injected tests are different for each matrix in the web
+        # if: steps.out-cache.outputs.cache-hit != 'true' && matrix.jupyterConnection != 'web'
         env:
-          CI_JUPYTER_FAST_COMPILATION: 'true'
           VSC_JUPYTER_CI_TEST_GREP: ${{ matrix.tags }}
 
       # Used by tests for non-python kernels.
       # Test are enabled via env variable `VSC_JUPYTER_CI_RUN_NON_PYTHON_NB_TEST`
       - name: Install Julia
-        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@iw' && matrix.tags != '@webview|@export|@lsp|@variableViewer' && matrix.tags != '@kernelInstall'
         uses: julia-actions/setup-julia@v1
         with:
           version: ${{env.JULIA_VERSION}}
 
       - name: Install Julia Kernel
-        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@iw' && matrix.tags != '@webview|@export|@lsp|@variableViewer' && matrix.tags != '@kernelInstall'
         shell: bash
         run: |
           julia -e '
             using Pkg
             Pkg.add("IJulia")'
 
       - name: Install Dot.net
-        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@iw' && matrix.tags != '@webview|@export|@lsp|@variableViewer' && matrix.tags != '@kernelInstall'
         uses: actions/[email protected]
         with:
           dotnet-version: ${{env.DOTNET_VERSION}}
 
       - name: Install .NET Interactive
-        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@iw' && matrix.tags != '@webview|@export|@lsp|@variableViewer' && matrix.tags != '@kernelInstall'
         shell: bash -l {0}
         run: dotnet tool install -g --add-source "https://pkgs.dev.azure.com/dnceng/public/_packaging/dotnet-tools/nuget/v3/index.json" Microsoft.dotnet-interactive
 
       - name: Install .NET Kernel
-        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.os != 'windows-latest' && matrix.tags != '^[^@]+$|@mandatory' && matrix.tags != '@widgets' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@iw' && matrix.tags != '@webview|@export|@lsp|@variableViewer' && matrix.tags != '@kernelInstall'
         shell: bash -l {0}
         run: dotnet interactive jupyter install
 
       - name: Create Virtual Env for Tests
         uses: ./.github/actions/create-venv-for-tests
-        if: matrix.python != 'conda' && matrix.python != 'noPython' && matrix.os != 'windows-latest' && matrix.jupyterConnection != 'remote' && matrix.tags != '^[^@]+$|@mandatory' && matrix.ipywidgetsVersion != '8' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.python != 'conda' && matrix.python != 'noPython' && matrix.os != 'windows-latest' && matrix.jupyterConnection != 'remote' && matrix.tags != '^[^@]+$|@mandatory' && matrix.ipywidgetsVersion != '8' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@webview|@export|@lsp|@variableViewer'
 
       - name: Create Virtual Env for Tests (ipywidgets 8)
         uses: ./.github/actions/create-venv-for-tests
-        if: matrix.python != 'conda' && matrix.python != 'noPython' && matrix.os != 'windows-latest' && matrix.jupyterConnection != 'remote' && matrix.tags != '^[^@]+$|@mandatory' && matrix.ipywidgetsVersion == '8' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote'
+        if: matrix.python != 'conda' && matrix.python != 'noPython' && matrix.os != 'windows-latest' && matrix.jupyterConnection != 'remote' && matrix.tags != '^[^@]+$|@mandatory' && matrix.ipywidgetsVersion == '8' && matrix.jupyterConnection != 'web' && matrix.jupyterConnection != 'remote' && matrix.tags != '@debugger' && matrix.tags != '@webview|@export|@lsp|@variableViewer'
         with:
           IPyWidgetVersion: '8'
 
@@ -921,8 +920,6 @@ jobs:
       - name: Compile if not cached
         run: npm run prePublishNonBundle
         if: steps.out-cache.outputs.cache-hit != 'true'
-        env:
-          CI_JUPYTER_FAST_COMPILATION: 'true'
 
       # It isn't possible to specify a regex for artifact names, so we have to download each artifact manually.
       # The name pattern is ${{env.COVERAGE_REPORTS}}-${{runner.os}}, and possible values for runner.os are `Linux`, `Windows`, or `macOS`.

diff --git a/.gitignore b/.gitignore
@@ -58,3 +58,9 @@ src/test/datascience/.venv*
 *.nls.*.json
 *.i18n.json
 l10n/
+
+# Compilation of less to css
+src/webviews/webview-side/interactive-common/variableExplorerGrid.css
+src/webviews/webview-side/interactive-common/variableExplorerGrid.css.map
+src/webviews/webview-side/react-common/seti/seti.css
+src/webviews/webview-side/react-common/seti/seti.css.map
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -16,8 +16,6 @@
             "env": {
                 // Disable this to turoff on redux & console logging during debugging
                 "VSC_JUPYTER_FORCE_LOGGING": "1",
-                // Enable this to try out new experiments locally
-                "VSC_JUPYTER_LOAD_EXPERIMENTS_FROM_FILE": "1",
                 // Enable this to log telemetry to the output during debugging
                 "XVSC_JUPYTER_LOG_TELEMETRY": "1",
                 // Enable this to log IPYWIDGET messages
@@ -68,8 +66,6 @@
             "env": {
                 // Disable this to turoff on redux & console logging during debugging
                 "VSC_JUPYTER_FORCE_LOGGING": "1",
-                // Enable this to try out new experiments locally
-                "VSC_JUPYTER_LOAD_EXPERIMENTS_FROM_FILE": "1",
                 // Enable this to log telemetry to the output during debugging
                 "XVSC_JUPYTER_LOG_TELEMETRY": "1",
                 // Enable this to log IPYWIDGET messages
@@ -229,8 +225,6 @@
                 "VSC_JUPYTER_CI_TEST_INVERT_GREP": "", // Initialize this to invert the grep (exclude tests with value defined in grep).
                 "CI_PYTHON_PATH": "", // Update with path to real python interpereter used for testing.
                 "VSC_JUPYTER_CI_RUN_NON_PYTHON_NB_TEST": "", // Initialize this to run tests again Julia & other kernels.
-                "VSC_JUPYTER_WEBVIEW_TEST_MIDDLEWARE": "true", // Initialize to create the webview test middleware
-                "VSC_JUPYTER_LOAD_EXPERIMENTS_FROM_FILE": "true",
                 // "TF_BUILD": "", // Set to anything to force full logging
                 "TEST_FILES_SUFFIX": "*.vscode.test,*.vscode.common.test",
                 "VSC_JUPYTER_REMOTE_NATIVE_TEST": "false", // Change to `true` to run the Native Notebook tests with remote jupyter connections.
@@ -263,8 +257,6 @@
             "env": {
                 "VSC_JUPYTER_FORCE_LOGGING": "1",
                 "CI_PYTHON_PATH": "/usr/local/bin/python", // Update with path to real python interpereter used for testing.
-                "VSC_JUPYTER_WEBVIEW_TEST_MIDDLEWARE": "true", // Initialize to create the webview test middleware
-                "VSC_JUPYTER_LOAD_EXPERIMENTS_FROM_FILE": "true",
                 "TEST_FILES_SUFFIX": "*.vscode.test,*.vscode.common.test",
                 "VSC_JUPYTER_REMOTE_NATIVE_TEST": "true", // Change to `true` to run the Native Notebook tests with remote jupyter connections.
                 "VSC_JUPYTER_NON_RAW_NATIVE_TEST": "false", // Change to `true` to run the Native Notebook tests with non-raw kernels (i.e. local jupyter server).
@@ -299,7 +291,6 @@
                 "TEST_FILES_SUFFIX": "*.vscode.test,*.vscode.common.test",
                 "VSC_JUPYTER_NON_RAW_NATIVE_TEST": "false",
                 "VSC_JUPYTER_REMOTE_NATIVE_TEST": "false",
-                "VSC_JUPYTER_LOAD_EXPERIMENTS_FROM_FILE": "true",
                 "VSC_JUPYTER_CI_TEST_DO_NOT_INSTALL_PYTHON_EXT": "true"
             },
             "sourceMaps": true,

diff --git a/.vscode/tasks.json b/.vscode/tasks.json
@@ -19,15 +19,15 @@
             }
         },
         {
-            "label": "Compile Web Views",
+            "label": "Compile Viewers",
             "type": "npm",
-            "script": "compile-webviews-watch",
+            "script": "compile-viewers-watch",
             "isBackground": true,
             "group": {
                 "kind": "build",
                 "isDefault": true
             },
-            "problemMatcher": ["$ts-webpack-watch"]
+            "problemMatcher": ["$esbuild-watch"]
         },
         {
             "label": "Compile Web Extension",

diff --git a/.vscodeignore b/.vscodeignore
@@ -9,6 +9,7 @@ docs/**
 .editorconfig
 .env
 .eslintrc
+.eslintignore
 .gitattributes
 .gitignore
 .gitmodules

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -58,7 +58,7 @@ For incremental builds you can use the following commands depending on your need
 
 ```shell
 npm run compile
-npm run compile-webviews-watch # For Interactive Window, Plot Viewer, Data Frame Viewer, and Notebooks (not the one based on VS Code)
+npm run compile-viewers-watch # For Plot, Data Frame, Variable & IPyWidget Viewer
 ```
 
 Sometimes you will need to run `npm run clean` and even `rm -r out`.

diff --git a/build/ci/postInstall.js b/build/ci/postInstall.js
@@ -325,6 +325,22 @@ function ensureOrigNBFormatIsOptional() {
         fs.writeFileSync(filePath, source.replace(stringToReplace, 'orig_nbformat?: number;'));
     }
 }
+
+function commentOutInvalidExport() {
+    // Others have run into the same problem https://github.com/uber/baseweb/issues/4129
+    const stringToReplace = 'import { bpfrpt_proptype_WindowScroller } from "../WindowScroller.js";';
+    const filePath = path.join(
+        __dirname,
+        '..',
+        '..',
+        'node_modules/react-virtualized/dist/es/WindowScroller/utils/onScroll.js'
+    );
+    const source = fs.readFileSync(filePath, 'utf8');
+    if (source.includes(stringToReplace)) {
+        fs.writeFileSync(filePath, source.replace(stringToReplace, ''));
+    }
+}
+
 fixUIFabricForTS49();
 fixJupyterLabRenderers();
 makeVariableExplorerAlwaysSorted();
@@ -336,6 +352,7 @@ fixStripComments();
 verifyMomentIsOnlyUsedByJupyterLabCoreUtils();
 fixUiFabricCompilationIssues();
 ensureOrigNBFormatIsOptional();
+commentOutInvalidExport();
 downloadZmqBinaries()
     .then(() => process.exit(0))
     .catch((ex) => {