Update tests

.editorconfig

@@ -19,7 +19,8 @@ insert_final_newline = true
 
 # Set properties for JavaScript files:
 [*.js]
-indent_style = tab
+indent_style = space
+indent_size = 2
 
 # Set properties for TypeScript files:
 [*.ts]

jest-environment.js

@@ -1,17 +1,26 @@
+/**
+ * @license BSD-3-Clause
+ *
+ * Copyright (c) 2019 Project Jupyter Contributors.
+ * Distributed under the terms of the 3-Clause BSD License.
+ */
+
 // Based on from https://yarnpkg.com/en/package/@rws-air/jestscreenshot
 
-const PuppeteerEnvironment = require("jest-environment-puppeteer");
-const JestScreenshot = require("@rws-air/jestscreenshot");
-require("jest-circus");
+const PuppeteerEnvironment = require('jest-environment-puppeteer');
+const JestScreenshot = require('@rws-air/jestscreenshot');
 
 class CustomEnvironment extends PuppeteerEnvironment {
+  async setup() {
+    await super.setup();
+  }
   async teardown() {
     await this.global.page.waitFor(2000);
     await super.teardown();
   }
 
   async handleTestEvent(event, state) {
-    if (event.name === "test_fn_failure") {
+    if (event.name === 'test_fn_failure') {
       const testName = state.currentlyRunningTest.name;
 
       const jestScreenshot = new JestScreenshot({
@@ -25,4 +34,7 @@ class CustomEnvironment extends PuppeteerEnvironment {
   }
 }
 
+/**
+ * Exports.
+ */
 module.exports = CustomEnvironment;

jest-puppeteer.config.js

@@ -1,10 +1,23 @@
-module.exports = {
+/**
+ * @license BSD-3-Clause
+ *
+ * Copyright (c) 2019 Project Jupyter Contributors.
+ * Distributed under the terms of the 3-Clause BSD License.
+ */
+
+const config = {
   launch: {
-    headless: process.env.HEADLESS !== "false"
+    headless: process.env.HEADLESS !== 'false',
+    slowMo: process.env.SLOWMO === 'true'
   },
   // https://github.com/smooth-code/jest-puppeteer/tree/master/packages/jest-dev-server#options
   server: {
-    command: "jupyter lab --port 8080 --no-browser",
+    command: "jupyter lab --port 8080 --no-browser --LabApp.token=''",
     port: 8080
   }
 };
+
+/**
+ * Exports.
+ */
+module.exports = config;

jest.config.js

@@ -1,17 +1,36 @@
-const { defaults: tsjPreset } = require("ts-jest/presets");
+/**
+ * @license BSD-3-Clause
+ *
+ * Copyright (c) 2019 Project Jupyter Contributors.
+ * Distributed under the terms of the 3-Clause BSD License.
+ */
 
-module.exports = {
-  rootDir: "src",
+const { defaults: tsjPreset } = require('ts-jest/presets');
+
+const config = {
+  rootDir: '.',
 
   // Needed for jest-screenshots
-  // https://yarnpkg.com/en/package/@rws-air/jestscreenshot
-  testRunner: "jest-circus/runner",
+  testRunner: 'jest-circus/runner',
 
-  globalSetup: "jest-environment-puppeteer/setup",
-  globalTeardown: "jest-environment-puppeteer/teardown",
-  testEnvironment: "../jest-environment.js",
-  setupFilesAfterEnv: ["expect-puppeteer"],
+  testEnvironment: './jest-environment.js',
+  globalSetup: 'jest-environment-puppeteer/setup',
+  globalTeardown: 'jest-environment-puppeteer/teardown',
+  setupFilesAfterEnv: ['expect-puppeteer'],
   transform: {
     ...tsjPreset.transform
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
+  testMatch: ['**/test/**/test*.ts?(x)'],
+  testPathIgnorePatterns: ['/build/', '/lib/', '/node_modules/'],
+  globals: {
+    'ts-jest': {
+      tsConfig: './tsconfig.test.json'
+    }
   }
 };
+
+/**
+ * Exports.
+ */
+module.exports = config;

package.json

@@ -49,8 +49,8 @@
     "prettier": "prettier --write '**/*{.ts,.tsx,.js,.jsx,.css,.json,.md}'",
     "prettier:check": "prettier --list-different '**/*{.ts,.tsx,.js,.jsx,.css,.json,.md}'",
     "rebuild:packages": "jlpm run clean:packages && jlpm run build:packages",
-    "test": "jlpm jest --runInBand",
-    "test:debug": "env HEADLESS=false jlpm test",
+    "test": "jest --runInBand",
+    "test:debug": "env HEADLESS=false SLOWMO=true jlpm test",
     "uninstall:extensions": "jupyter labextension uninstall --all --no-build",
     "unlink": "jlpm run unlink:packages",
     "unlink:packages": "jupyter labextension unlink ./ --no-build || echo 'Unlink command failed, but continuing...'"
@@ -74,24 +74,25 @@
   },
   "devDependencies": {
     "@jupyterlab/dataregistry-extension": "^3.0.0",
-    "@rws-air/jestscreenshot": "3.0.3",
-    "@types/expect-puppeteer": "3.3.2",
-    "@types/jest": "24.0.19",
-    "@types/jest-environment-puppeteer": "4.3.1",
-    "@types/jsonld": "1.5.0",
-    "@types/puppeteer": "1.20.2",
+    "@rws-air/jestscreenshot": "^3.0.3",
+    "@types/expect-puppeteer": "^3.3.2",
+    "@types/jest": "^24.0.19",
+    "@types/jest-environment-puppeteer": "^4.3.1",
+    "@types/jsonld": "^1.5.0",
+    "@types/puppeteer": "^1.20.2",
+    "husky": "^3.0.9",
+    "jest": "^24.9.0",
+    "jest-circus": "^24.9.0",
+    "jest-puppeteer": "^4.3.0",
     "husky": "^3.0.9",
-    "jest": "24.9.0",
-    "jest-circus": "24.9.0",
-    "jest-puppeteer": "4.3.0",
     "lint-staged": "^9.4.2",
     "prettier": "^1.18.2",
-    "puppeteer": "1.20.0",
+    "puppeteer": "^2.0.0",
     "rimraf": "~2.6.2",
-    "stylelint": "11.0.0",
-    "stylelint-config-prettier": "6.0.0",
-    "stylelint-config-standard": "19.0.0",
-    "ts-jest": "24.1.0",
+    "stylelint": "^11.0.0",
+    "stylelint-config-prettier": "^6.0.0",
+    "stylelint-config-standard": "^19.0.0",
+    "ts-jest": "^24.1.0",
     "tslint": "^5.20.0",
     "tslint-config-prettier": "^1.18.0",
     "tslint-plugin-prettier": "^2.0.1",

test/ui/test.ts

@@ -0,0 +1,104 @@
+/**
+ * @license BSD-3-Clause
+ *
+ * Copyright (c) 2019 Project Jupyter Contributors.
+ * Distributed under the terms of the 3-Clause BSD License.
+ */
+
+import { ElementHandle } from 'puppeteer';
+
+const { setDefaultOptions } = require('expect-puppeteer');
+
+const timeout = 15 * 1000;
+
+jest.setTimeout(timeout);
+setDefaultOptions({ timeout });
+
+async function getXPath(xpath: string): Promise<ElementHandle<Element>> {
+  await page.waitForXPath(xpath);
+  const elements = await page.$x(xpath);
+  expect(elements.length).toBe(1);
+  return elements[0];
+}
+
+function sleep(ms: number): Promise<void> {
+  return new Promise(resolve => setTimeout(resolve, ms));
+}
+describe('JupyterLab', () => {
+  beforeAll(async () => {
+    // Load JupyterLab:
+    await page.goto('http://localhost:8080/lab?reset');
+
+    // NOTE: depending on system resource constraints, this may NOT be enough time for JupyterLab to load and get "settled", so to speak. If CI tests begin inexplicably failing due to timeout failures, may want to consider increasing the sleep duration...
+    await sleep(3000);
+
+    // Attempt to find the data explorer tab on the page (all tests essentially presume that we can load the data explorer via the tab bar button):
+    const el = await page.$('[title="Data Explorer"]');
+    if (el !== null) {
+      // Clicking on the data explorer tab should open the data explorer, thus allowing us to test data explorer UI interactions:
+      el.click();
+    } else {
+      console.log('Unable to find expected tab.');
+    }
+  });
+
+  it('should show JupyterLab logo', async () => {
+    expect.assertions(1);
+    await expect(page).toMatchElement('#jp-MainLogo', { visible: true } as any);
+  });
+
+  it("show be able to show 'Data Explorer' tab", async () => {
+    expect.assertions(1);
+    await expect(page).toMatchElement('.jl-explorer-heading', {
+      text: 'Datasets',
+      visible: true
+    } as any);
+  });
+
+  it('should see files marker', async () => {
+    expect.assertions(1);
+    await expect(page).toMatchElement('h3', {
+      text: 'file:///',
+      visible: true
+    } as any);
+  });
+
+  it('should be able to expand files', async () => {
+    expect.assertions(1);
+    const filebutton = await getXPath('//button[../h3/text()="file:///"]');
+    await filebutton.click();
+  });
+
+  it('should see datasets.yml marker', async () => {
+    expect.assertions(1);
+    await expect(page).toMatchElement('h3', {
+      text: 'datasets.yml',
+      visible: true
+    } as any);
+  });
+
+  it('should be able to expand datasets.yml', async () => {
+    expect.assertions(1);
+    const datasetsButton = await getXPath(
+      '//button[../h3/text()="datasets.yml"]'
+    );
+    await datasetsButton.click();
+  });
+
+  it('should show datasets label', async () => {
+    expect.assertions(1);
+    await expect(page).toMatchElement('h3', {
+      text: 'A Publication',
+      visible: true
+    } as any);
+  });
+
+  it("show be able to show 'Data Browser' tab", async () => {
+    expect.assertions(2);
+    await expect(page).toClick('[title="Data Browser"]');
+    await expect(page).toMatchElement('.jl-dr-browser', {
+      text: 'Follow active?',
+      visible: true
+    } as any);
+  });
+});

tsconfig.test.json

@@ -0,0 +1,8 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "build/test",
+    "rootDir": "test"
+  },
+  "include": ["test/*", "test/**/*"]
+}