Add unit test support using karma+mocha+chai

packages/person-select/.gitlab-ci.yml

@@ -14,6 +14,7 @@ test:
   stage: test
   script:
     - apt update
-    - apt install -y npm
+    - apt install -y npm chromium
     - npm install
     - npm run build
+    - npm test

packages/person-select/README.md

@@ -15,6 +15,9 @@ npm install
 
 # constantly build dist/bundle.js and run a local web-server on port 8002 
 npm run watch-local
+
+# run tests
+npm test
 ```
 
 Jump to <http://localhost:8002> and you should get a Single Sign On login page.

packages/person-select/karma.conf.js

+// Trick to use the auto-downloaded puppeteer chrome binary
+process.env.CHROME_BIN = require('puppeteer').executablePath();
+
+module.exports = function(config) {
+  config.set({
+    basePath: 'dist',
+    frameworks: ['mocha', 'chai'],
+    files: [
+      './bundle.js',
+      {pattern: './**/*', included: false, watched: true, served: true},
+    ],
+    autoWatch: true,
+    browsers: ['ChromeHeadlessNoSandbox'],
+    customLaunchers: {
+      ChromeHeadlessNoSandbox: {
+        base: 'ChromeHeadless',
+        flags: ['--no-sandbox']
+      }
+    },
+    singleRun: false,
+    logLevel: config.LOG_ERROR
+  });
+}

packages/person-select/package.json

@@ -3,7 +3,14 @@
   "version": "1.0.0",
   "main": "src/index.js",
   "devDependencies": {
+    "karma": "^4.2.0",
+    "karma-chai": "^0.1.0",
+    "karma-chrome-launcher": "^3.0.0",
+    "karma-mocha": "^1.3.0",
     "node-sass": "^4.12.0",
+    "puppeteer": "^1.15.0",
+    "mocha": "^6.2.0",
+    "chai": "^4.2.0",
     "rollup": "^1.11.3",
     "rollup-plugin-commonjs": "^9.3.4",
     "rollup-plugin-copy": "^2.0.1",
@@ -13,6 +20,7 @@
     "rollup-plugin-terser": "^4.0.4",
     "rollup-plugin-json": "^4.0.0",
     "rollup-plugin-replace": "^2.2.0",
+    "rollup-plugin-multi-entry": "^2.1.0",
     "i18next-scanner": "^2.10.2",
     "vpu-auth": "file:./vendor/auth",
     "vpu-common": "file:./vendor/common"
@@ -31,9 +39,11 @@
     "build-dev": "rollup -c --environment BUILD:development",
     "build-prod": "rollup -c --environment BUILD:production",
     "build-demo": "rollup -c --environment BUILD:demo",
+    "build-test": "rollup -c --environment BUILD:test",
     "i18next": "i18next-scanner",
     "watch": "npm run watch-local",
     "watch-local": "rollup -c --watch",
-    "watch-dev": "rollup -c --watch --environment BUILD:development"
+    "watch-dev": "rollup -c --watch --environment BUILD:development",
+    "test": "npm run build-test && karma start --singleRun"
   }
 }

packages/person-select/rollup.config.js

@@ -6,17 +6,19 @@ import {terser} from "rollup-plugin-terser";
 import json from 'rollup-plugin-json';
 import replace from "rollup-plugin-replace";
 import serve from 'rollup-plugin-serve';
+import multiEntry from 'rollup-plugin-multi-entry';
 
 const build = (typeof process.env.BUILD !== 'undefined') ? process.env.BUILD : 'local';
 console.log("build: " + build);
 
 export default {
-    input: 'src/demo.js',
+    input: (build != 'test') ? 'src/demo.js' : 'test/**/*.js',
     output: {
         file: 'dist/bundle.js',
         format: 'esm'
     },
     plugins: [
+        multiEntry(),
         resolve(),
         commonjs(),
         json(),
@@ -28,7 +30,7 @@ export default {
             minimize: false,
             plugins: []
         }),
-        (build !== 'local') ? terser() : false,
+        (build !== 'local' && build !== 'test') ? terser() : false,
         copy({
             targets: [
                 'assets/index.html',

packages/person-select/test/unit.js

+import '../src/person-select';
+
+describe('vpu-library-person-select basics', () => {
+  let node;
+
+  beforeEach(async () => {
+    node = document.createElement('vpu-library-person-select');
+    document.body.appendChild(node);
+    await node.updateComplete;
+  });
+
+  afterEach(() => {
+    node.remove();
+  });
+
+  it('should render', () => {
+      expect(node).to.have.property('shadowRoot');
+  });
+});