Make the URL hit by jest smoke tests configurable (#1420)

* Make the URL hit by jest smoke tests configurable

* Fix typo

* Make names consistent

client/__tests__/e2e/config.js

@@ -1,6 +1,6 @@
 export const jest_env = process.env.JEST_ENV;
 export const appPort = process.env.CXG_SERVER_PORT;
-export const appUrlBase = `http://localhost:${appPort}`;
+export const appUrlBase = process.env.CXG_URL_BASE || `http://localhost:${appPort}`;
 export const DEV = jest_env === "dev";
 export const DEBUG = jest_env === "debug";
 export const DATASET = "pbmc3k";

client/__tests__/e2e/e2e.test.js

@@ -11,8 +11,7 @@ let browser, page, utils, cxgActions;
 const data = datasets[DATASET];
 
 beforeAll(async () => {
-  const browserViewport = { width: 1280, height: 960 };
+  [browser, page, utils, cxgActions] = await setupTestBrowser();
-  [browser, page, utils, cxgActions] = await setupTestBrowser(browserViewport);
 });
 
 beforeEach(async () => {
@@ -33,7 +32,6 @@ describe("did launch", () => {
 describe("metadata loads", () => {
   test("categories and values from dataset appear", async () => {
     for (const label in data.categorical) {
-      await utils.waitByID(`category-${label}`);
       const categoryName = await utils.getOneElementInnerText(`[data-testid="category-${label}"]`);
       expect(categoryName).toMatch(label);
       await utils.clickOn(`${label}:category-expand`);
@@ -52,6 +50,7 @@ describe("metadata loads", () => {
       await utils.waitByID(`histogram-${label}`);
     }
   });
+
 });
 
 describe("cell selection", () => {

client/__tests__/e2e/e2eAnnotations.test.js

@@ -9,8 +9,7 @@ let browser, page, utils, actions;
 const data = datasets[DATASET];
 
 beforeAll(async () => {
-  const browserViewport = {width: 1280, height: 960};
+  [browser, page, utils, actions] = await setupTestBrowser();
-  [browser, page, utils, actions] = await setupTestBrowser(browserViewport);
 });
 
 afterAll(() => {

client/__tests__/e2e/e2eJestConfig.json

@@ -3,7 +3,6 @@
   "testMatch": [
     "**/__tests__/**/?(*.)(spec|test).js?(x)"
   ],
-  "testURL": "http://localhost/",
   "setupFiles": [
     "../setupMissingGlobals.js"
   ]

client/__tests__/e2e/testBrowser.js

@@ -3,12 +3,24 @@ import { DEBUG, DEV } from "./config";
 import { puppeteerUtils } from "./puppeteerUtils";
 import { cellxgeneActions } from "./cellxgeneActions";
 
-export async function setupTestBrowser(browserViewport) {
+export async function setupTestBrowser() {
+  const browserViewport = { width: 1280, height: 960 };
   const browserParams = DEV
-    ? { headless: false, slowMo: 5 }
+    ? {
+      headless: false,
+      slowMo: 5,
+      args: [ `--window-size=${browserViewport.width},${browserViewport.height}`]
+    }
     : DEBUG
-      ? { headless: false, slowMo: 100, devtools: true }
+      ? {
-      : {};
+        headless: false,
+        slowMo: 100,
+        devtools: true,
+        args: [ `--window-size=${browserViewport.width + 560},${browserViewport.height}`]
+      }
+      : {
+        args: [ `--window-size=${browserViewport.width},${browserViewport.height}`]
+      };
   const browser = await puppeteer.launch(browserParams);
   const page = await browser.pages().then(pages => pages[0]);
   await page.setViewport(browserViewport);

client/package-lock.json

@@ -5762,29 +5762,6 @@
       "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=",
       "dev": true
     },
-    "csp-html-webpack-plugin": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/csp-html-webpack-plugin/-/csp-html-webpack-plugin-4.0.0.tgz",
-      "integrity": "sha512-1YqQefNG0SrZisysThlly2bgs4Ab/W91xOM17S8wd+6vTo3E0OdL+y4IAR0MKpthRluNGzFB3QhPqdOhkXAExg==",
-      "dev": true,
-      "requires": {
-        "cheerio": "^1.0.0-rc.3",
-        "lodash": "^4.17.15",
-        "memory-fs": "^0.5.0"
-      },
-      "dependencies": {
-        "memory-fs": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
-          "integrity": "sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==",
-          "dev": true,
-          "requires": {
-            "errno": "^0.1.3",
-            "readable-stream": "^2.0.1"
-          }
-        }
-      }
-    },
     "css-loader": {
       "version": "3.4.2",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-3.4.2.tgz",

client/package.json

@@ -106,7 +106,6 @@
     "testMatch": [
       "**/__tests__/**/?(*.)(spec|test).js?(x)"
     ],
-    "testURL": "http://localhost/",
     "setupFiles": [
       "./__tests__/setupMissingGlobals.js"
     ],

dev_docs/developer_scripts.md

@@ -112,3 +112,5 @@ Methods used to test the client javascript code
 * `make e2e` Runs backend tests without starting the server. You will need to
   start the rest api separately with the pbmc3k.h5ad file. Note you can use
   the `JEST_ENV` environment variable to change how JEST runs in the browser.
+  The test runs against `localhost:5005` by default. You can use the
+  `CXG_URL_BASE` env variable to test non-localhost deployments of cellxgene.