test: add basic integration test (#2)

.circleci/config.yml

@@ -66,6 +66,28 @@ jobs:
           name: Unit tests
           command: yarn run test:unit
 
+  test-integration:
+    docker:
+      - image: circleci/node:10.9.0-browsers
+      - image: qlikcore/engine:12.311.0
+        command: -S AcceptEULA=yes
+
+    working_directory: ~/project
+
+    steps:
+      - attach_workspace: *attach
+      - run:
+          name: install dockerize
+          command: wget https://github.com/jwilder/dockerize/releases/download/$DOCKERIZE_VERSION/dockerize-linux-amd64-$DOCKERIZE_VERSION.tar.gz && sudo tar -C /usr/local/bin -xzvf dockerize-linux-amd64-$DOCKERIZE_VERSION.tar.gz && rm dockerize-linux-amd64-$DOCKERIZE_VERSION.tar.gz
+          environment:
+            DOCKERIZE_VERSION: v0.6.1
+      - run:
+          name: Wait for engine
+          command: dockerize -wait tcp://localhost:9076 -timeout 1m
+      - run:
+          name: Integration tests
+          command: yarn run test:integration
+
 workflows:
   version: 2
   build-all:
@@ -80,3 +102,6 @@ workflows:
       - lint:
           requires:
             - build
+      - test-integration:
+          requires:
+            - build

aw.config.js

@@ -18,7 +18,7 @@ const argv = yargs
       type: 'string',
       alias: 't',
       default: 'unit',
-      choices: ['unit'],
+      choices: ['unit', 'integration'],
     },
   })
   .coerce('scope', (scope) => {
@@ -39,11 +39,22 @@ const argv = yargs
   })
   .argv;
 
-const TYPES = {
+const CONFIGS = {
   unit: {
-    glob: `${argv.scope}/__tests__/unit/**/*.spec.js`,
+    glob: [`${argv.scope}/__tests__/unit/**/*.spec.js`],
-    reportDir: 'coverage/unit',
+    src: [`${argv.scope}/src/**/*.{js,jsx}`],
+    coverage: true,
+    nyc: {
+      include: [`${argv.scope}/src/**/*.{js,jsx}`],
+      exclude: ['**/*.spec.js'],
+      sourceMap: false,
+      instrumenter: './lib/instrumenters/noop',
+      reportDir: 'coverage/unit',
+    },
     mocks: [
+      ['**/*.scss', '{}'],
+      ['**/*.css', '{}'],
+
       // mock nebula modules to avoid parsing errors without build.
       // these modules should be mocked properly in the unit test
       ['@nebula.js/selections', () => ({})],
@@ -51,30 +62,18 @@ const TYPES = {
       ['@nebula.js/nucleus', () => ({})],
     ],
   },
+  integration: {
+    glob: 'test/integration/**/*.spec.js',
+    watchGlob: ['test/integration/**/*.{js,html}'],
+  },
 };
 
-const type = TYPES[argv.type];
+const config = CONFIGS[argv.type];
-
-const glob = [type.glob];
-const src = [`${argv.scope}/src/**/*.{js,jsx}`];
 
 module.exports = {
-  glob,
+  watchGlob: [config.src, config.glob],
-  src,
+  mocha: {
-  watchGlob: [...src, ...glob],
-  nyc: {
-    include: src,
-    sourceMap: false,
-    instrumenter: './lib/instrumenters/noop',
-    reportDir: 'coverage/unit',
-  },
-  coverage: true,
-  mocha: Object.assign({
     timeout: 30000,
-  }, type.mocha),
+  },
-  mocks: [
+  ...config,
-    ['**/*.scss', '{}'],
-    ['**/*.css', '{}'],
-    ...(type.mocks || []),
-  ],
 };

babel.config.js

@@ -10,6 +10,7 @@ module.exports = {
           'istanbul',
           {
             exclude: [
+              '**/test/**',
               '**/__test__/**',
               '**/dist/**',
             ],

package.json

@@ -6,6 +6,7 @@
     "build:watch": "FORCE_COLOR=1 lerna run build:watch --stream",
     "lint": "eslint packages --ext .js --ext .jsx",
     "test": "yarn run test:unit",
+    "test:integration": "aw puppet -c aw.config.js --type integration",
     "test:unit": "aw -c aw.config.js"
   },
   "repository": {
@@ -33,6 +34,7 @@
     "@commitlint/config-conventional": "^7.3.1",
     "babel-plugin-istanbul": "^5.1.0",
     "cross-env": "^5.2.0",
+    "enigma.js": "^2.4.0",
     "eslint": "^5.12.1",
     "eslint-config-airbnb": "^17.1.0",
     "eslint-plugin-import": "^2.15.0",
@@ -40,16 +42,19 @@
     "eslint-plugin-mocha": "^5.2.1",
     "eslint-plugin-react": "^7.12.4",
     "husky": "^1.3.1",
+    "leonardo-ui": "^1.6.0",
     "lerna": "^3.10.7",
     "lint-staged": "^8.1.1",
     "rollup": "^1.1.2",
     "rollup-plugin-babel": "^4.3.2",
     "rollup-plugin-commonjs": "^9.2.0",
     "rollup-plugin-dependency-flow": "^0.3.0",
+    "rollup-plugin-json": "^3.1.0",
     "rollup-plugin-node-resolve": "^4.0.0",
     "rollup-plugin-replace": "^2.1.0",
     "rollup-plugin-sass": "^1.1.0",
     "rollup-plugin-terser": "^4.0.3",
+    "ws": "^6.1.3",
     "yargs": "^12.0.5"
   },
   "workspaces": [

test/__serve__/build.js

@@ -0,0 +1,22 @@
+#! /usr/bin/env node
+
+const path = require('path');
+
+const rollup = require('rollup');
+const jsn = require('rollup-plugin-json');
+
+async function build() {
+  const bundle = await rollup.rollup({
+    input: path.resolve(__dirname, 'index.js'),
+    plugins: [
+      jsn(),
+    ],
+  });
+
+  await bundle.write({
+    file: path.resolve(__dirname, 'dist/bundle.js'),
+    format: 'umd',
+  });
+}
+
+module.exports = build;

test/__serve__/index.html

@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Integration tests</title>
+
+  <script src="../../node_modules/enigma.js/enigma.min.js"></script>
+  <script src="../../packages/nucleus/dist/nucleus.js"></script>
+  
+  <link rel="stylesheet" href="../../node_modules/leonardo-ui/dist/leonardo-ui.css" type="text/css"/>
+
+  <style>
+    html, body {
+      height: 100%;
+      margin: 0;
+      padding: 0;
+      overflow: hidden;
+    }
+
+    body {
+      background: linear-gradient(60deg, #9ecc4c 0%, #45B3B2 100%);
+      color: #666;
+      font: normal 14px/16px "Source Sans Pro", Arial, sans-serif;
+      -webkit-font-smoothing: antialiased;
+    }
+
+    @font-face {
+      font-family: "LUI icons";
+      src: url(../../node_modules/leonardo-ui/dist/lui-icons.woff) format('woff'),
+        url(../../node_modules/leonardo-ui/dist/lui-icons.ttf) format('truetype');
+    }
+
+    #chart-container {
+      position: absolute;
+      left: 8px;
+      bottom: 8px;
+      right: 8px;
+      top: 64px;
+      background: #fff;
+      border-radius: 4px;
+    }
+  </style>
+</head>
+<body>
+  <div id="chart-container"></div>
+  <script type="text/javascript" src="./dist/bundle.js"></script>
+</html>

test/__serve__/index.js

@@ -0,0 +1,46 @@
+import schema from '../../node_modules/enigma.js/schemas/3.2.json';
+
+const connect = () => {
+  const createConnection = () => window.enigma.create({
+    schema,
+    url: `ws://${window.location.hostname || 'localhost'}:9076/app/temp-test`,
+  }).open().then(qix => qix.createSessionApp());
+
+  return createConnection().then(app => app.setScript(`
+  Characters:
+  Load Chr(RecNo()+Ord('A')-1) as Alpha, RecNo() as Num autogenerate 26;
+    
+  ASCII:
+  Load 
+    if(RecNo()>=65 and RecNo()<=90,RecNo()-64) as Num,
+    Chr(RecNo()) as AsciiAlpha, 
+    RecNo() as AsciiNum
+  autogenerate 85
+    Where (RecNo()>=65 and RecNo()<=126) or RecNo()>=160;
+  `).then(() => app.doReload().then(() => app)));
+};
+
+connect().then((app) => {
+  const sn = {
+    component: {
+      mounted(element) {
+        element.textContent = 'Hello!'; // eslint-disable-line no-param-reassign
+      },
+    },
+  };
+
+  const nebbie = window.nucleus(app)
+    .load((type, config) => config.Promise.resolve(sn));
+
+  nebbie.create({
+    type: 'bar',
+  }, {
+    element: document.querySelector('#chart-container'),
+    props: {
+      showTitles: true,
+      title: 'Yeah!',
+      subtitle: 'smaller title',
+      footnote: 'foooooter',
+    },
+  });
+});

test/integration/setup.spec.js

@@ -0,0 +1,15 @@
+const build = require('../__serve__/build');
+
+before(async () => {
+  await build();
+
+  page.on('pageerror', (e) => {
+    console.log('error', e.message);
+  });
+
+  page.on('console', (msg) => {
+    for (let i = 0; i < msg.args().length; ++i) {
+      console.log(`console ${msg.text()}`);
+    }
+  });
+});

test/integration/sn.spec.js

@@ -0,0 +1,13 @@
+const path = require('path');
+
+describe('sn', () => {
+  const content = '.nucleus-content__body';
+  it('should say hello', async () => {
+    await page.goto(`file://${path.resolve(__dirname, '../__serve__/index.html')}`);
+    await page.waitForSelector(content, {
+      timeout: 5000,
+    });
+    const text = await page.$eval(content, el => el.textContent);
+    expect(text).to.equal('Hello!');
+  });
+});

yarn.lock

@@ -3080,6 +3080,10 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
   dependencies:
     once "^1.4.0"
 
+enigma.js@^2.4.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/enigma.js/-/enigma.js-2.4.0.tgz#e5263116e7168e27f11cfe326ac83ed738bb7cc4"
+
 err-code@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/err-code/-/err-code-1.1.2.tgz#06e0116d3028f6aef4806849eb0ea6a748ae6960"
@@ -4878,6 +4882,10 @@ lcid@^2.0.0:
   dependencies:
     invert-kv "^2.0.0"
 
+leonardo-ui@^1.6.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/leonardo-ui/-/leonardo-ui-1.6.0.tgz#65eab0a4fd9a54f87a75d08e4440900555f56c24"
+
 lerna@^3.10.7:
   version "3.10.7"
   resolved "https://registry.yarnpkg.com/lerna/-/lerna-3.10.7.tgz#9d308b1fee1697f89fe90e6bc37e51c03b531557"
@@ -6909,6 +6917,12 @@ rollup-plugin-dependency-flow@^0.3.0:
   dependencies:
     dependency-flow "^0.3.0"
 
+rollup-plugin-json@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-json/-/rollup-plugin-json-3.1.0.tgz#7c1daf60c46bc21021ea016bd00863561a03321b"
+  dependencies:
+    rollup-pluginutils "^2.3.1"
+
 rollup-plugin-node-resolve@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/rollup-plugin-node-resolve/-/rollup-plugin-node-resolve-4.0.0.tgz#9bc6b8205e9936cc0e26bba2415f1ecf1e64d9b2"
@@ -6946,7 +6960,7 @@ rollup-plugin-terser@^4.0.3:
     lave "^1.1.10"
     terser "^3.14.1"
 
-"rollup-pluginutils@>= 1.3.1", rollup-pluginutils@^2.0.1, rollup-pluginutils@^2.3.0, rollup-pluginutils@^2.3.3:
+"rollup-pluginutils@>= 1.3.1", rollup-pluginutils@^2.0.1, rollup-pluginutils@^2.3.0, rollup-pluginutils@^2.3.1, rollup-pluginutils@^2.3.3:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.3.3.tgz#3aad9b1eb3e7fe8262820818840bf091e5ae6794"
   dependencies:
@@ -7905,7 +7919,7 @@ ws@^5.1.1:
   dependencies:
     async-limiter "~1.0.0"
 
-ws@^6.1.2:
+ws@^6.1.2, ws@^6.1.3:
   version "6.1.3"
   resolved "https://registry.yarnpkg.com/ws/-/ws-6.1.3.tgz#d2d2e5f0e3c700ef2de89080ebc0ac6e1bf3a72d"
   dependencies: