chore: staging deploy; 9/20/22

client/.nvmrc

@@ -0,0 +1 @@
+v16

client/__tests__/e2e/cellxgeneActions.ts

@@ -30,6 +30,7 @@ export async function drag(testId: any, start: any, end: any, lasso = false) {
   const y2 = elBox.content[0].y + end.y;
   await page.mouse.move(x1, y1);
   await page.mouse.down();
+
   if (lasso) {
     await page.mouse.move(x2, y1);
     await page.mouse.move(x2, y2);
@@ -38,6 +39,7 @@ export async function drag(testId: any, start: any, end: any, lasso = false) {
   } else {
     await page.mouse.move(x2, y2);
   }
+
   await page.mouse.up();
 }
 

client/__tests__/e2e/data.ts

@@ -27,7 +27,7 @@ export const datasets = {
       lasso: [
         {
           "coordinates-as-percent": { x1: 0.1, y1: 0.25, x2: 0.7, y2: 0.75 },
-          count: "1131",
+          count: "1094",
         },
       ],
       categorical: [
@@ -83,7 +83,7 @@ export const datasets = {
           values: ["B cells", "Megakaryocytes"],
         },
       ],
-      count: "357",
+      count: "332",
       categorical: {
         louvain: {
           "B cells": "342",
@@ -98,14 +98,14 @@ export const datasets = {
       },
       lasso: {
         "coordinates-as-percent": { x1: 0.25, y1: 0.05, x2: 0.75, y2: 0.55 },
-        count: "332",
+        count: "357",
       },
     },
     scatter: {
       genes: { x: "S100A8", y: "FCGR3A" },
     },
     pan: {
-      "coordinates-as-percent": { x1: 0.75, y1: 0.75, x2: 0.35, y2: 0.35 },
+      "coordinates-as-percent": { x1: 0.75, y1: 0.75, x2: 0.25, y2: 0.25 },
     },
     features: {
       panzoom: {

client/__tests__/e2e/e2e.test.ts

@@ -350,17 +350,20 @@ describe("graph overlay", () => {
       `${categoryValue}-centroid-label`
     );
 
-    await drag("layout-graph", panCoords.start, panCoords.end, false);
-    const terminalCoordinates = await getElementCoordinates(
-      `${categoryValue}-centroid-label`
-    );
+    await tryUntil(async () => {
+      await drag("layout-graph", panCoords.start, panCoords.end, false);
 
-    expect(terminalCoordinates[0] - initialCoordinates[0]).toBeCloseTo(
-      panCoords.end.x - panCoords.start.x
-    );
-    expect(terminalCoordinates[1] - initialCoordinates[1]).toBeCloseTo(
-      panCoords.end.y - panCoords.start.y
-    );
+      const terminalCoordinates = await getElementCoordinates(
+        `${categoryValue}-centroid-label`
+      );
+
+      expect(terminalCoordinates[0] - initialCoordinates[0]).toBeCloseTo(
+        panCoords.end.x - panCoords.start.x
+      );
+      expect(terminalCoordinates[1] - initialCoordinates[1]).toBeCloseTo(
+        panCoords.end.y - panCoords.start.y
+      );
+    });
   });
 });
 

client/configuration/webpack/webpack.config.dev.js

@@ -27,7 +27,10 @@ const devConfig = {
   output: {
     pathinfo: true,
     filename: "static/js/bundle.js",
-    publicPath: "/", // ensures the static asset calls use "/" as the root and not "/<base_url>/<dataset>"
+    // (thuang): This is needed to make sure static asset url path is '/static/assets/',
+    // so it ignores the base_url (/d, /e) and dataset in the url.
+    // e.g., http://localhost:3000/static/assets/heatmap.svg
+    publicPath: "/",
   },
   module: {
     rules: [
@@ -39,7 +42,6 @@ const devConfig = {
       {
         test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2|otf)$/i,
         loader: "file-loader",
-        include: [nodeModules, fonts],
         options: {
           name: "static/assets/[name].[ext]",
           // (thuang): This is needed to make sure @font url path is '/static/assets/'

client/configuration/webpack/webpack.config.prod.js

@@ -56,11 +56,8 @@ const prodConfig = {
       {
         test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2|otf)$/i,
         loader: "file-loader",
-        include: [nodeModules, fonts],
         options: {
           name: "static/assets/[name]-[contenthash].[ext]",
-          // (thuang): This is needed to make sure @font url path is '../static/assets/'
-          publicPath: "..",
         },
       },
     ],

client/index.html

@@ -20,19 +20,27 @@
       label,
       text,
       div {
-        font-family: "Roboto Condensed", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+        font-family: "Roboto Condensed", "Helvetica Neue", "Helvetica", "Arial",
+          sans-serif;
         font-size: 14px;
         letter-spacing: -0.006em;
       }
       body {
         margin: 0;
         padding: 0;
+        -webkit-font-smoothing: antialiased;
       }
 
       * {
         box-sizing: border-box;
       }
     </style>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,400;0,700;1,400&display=swap"
+      rel="stylesheet"
+    />
   </head>
   <body>
     <script type="text/javascript">