test: migrate integration tests to use fixture rendering (#713)

.circleci/config.yml

@@ -78,9 +78,9 @@ jobs:
       - run:
           name: Test mashup
           command: yarn run test:mashup --chrome.browserWSEndpoint "ws://localhost:3000" --no-launch
-      # - run:
-      #     name: Test integration
-      #     command: APP_ID=$DOC_ID yarn run test:integration --chrome.browserWSEndpoint "ws://localhost:3000" --no-launch
+      - run:
+          name: Test integration
+          command: yarn run test:integration --chrome.browserWSEndpoint "ws://localhost:3000" --no-launch
       - run:
           name: Create a hello supernova project from latest release
           command: |

package.json

@@ -10,13 +10,12 @@
     "locale:generate": "node apis/locale/scripts/generate-all.mjs",
     "lint": "eslint packages apis commands --ext .js,.jsx",
     "lint:check": "eslint --print-config ./aw.config.js | eslint-config-prettier-check",
-    "start": "MONO=true ./commands/cli/lib/index.js serve --entry ./test/fixtures/viz/table",
     "start:ui": "start-storybook",
     "spec": "lerna run spec --stream --concurrency 99",
     "test": "yarn run test:unit",
     "mashup": "node scripts/start-mashup.js",
     "test:mashup": "aw puppet -c aw.config.js --testExt '*.int.js' --glob 'test/mashup/**/*.int.js'",
-    "test:integration": "aw puppet -c aw.config.js --testExt '*.int.js' --glob 'test/integration/*.int.js'",
+    "test:integration": "aw puppet -c aw.config.js --testExt '*.int.js' --glob 'test/integration/**/*.int.js'",
     "test:component": "aw puppet -c aw.config.js --testExt '*.comp.js' --glob 'test/component/**/*.comp.js'",
     "test:unit": "aw -c aw.config.js --nyc.reportDir coverage/unit --coverage",
     "prepare": "husky install"

test/integration/setup.int.js

@@ -1,29 +0,0 @@
-const path = require('path');
-const serve = require('@nebula.js/cli-serve'); // eslint-disable-line
-
-page.on('pageerror', (e) => {
-  console.error('Web: ', e.message);
-});
-
-page.on('console', (msg) => {
-  for (let i = 0; i < msg.args().length; ++i) {
-    console.log(`console ${msg.text()}`);
-  }
-});
-
-if (!process.env.BASE_URL) {
-  let s;
-
-  before(async () => {
-    s = await serve({
-      entry: path.resolve(__dirname, '../fixtures/viz/table'),
-      open: false,
-    });
-
-    process.env.BASE_URL = s.url;
-  });
-
-  after(() => {
-    s.close();
-  });
-}

test/integration/table/table.fix.js

@@ -0,0 +1,181 @@
+export default function fixture() {
+  return {
+    type: 'hi',
+    genericObjects: [
+      {
+        getLayout() {
+          return {
+            qInfo: {
+              qId: '4a3c0f05-f736-47df-b8de-421c5c59167c',
+              qType: 'hi',
+            },
+            qMeta: {
+              privileges: ['read', 'update', 'delete', 'exportdata'],
+            },
+            qSelectionInfo: {},
+            visualization: 'hi',
+            showTitles: true,
+            dimensionName: 'The first one',
+            layers: [
+              {
+                qHyperCube: {
+                  qSize: {
+                    qcx: 1,
+                    qcy: 26,
+                  },
+                  qDimensionInfo: [
+                    {
+                      qFallbackTitle: 'Alpha',
+                      qApprMaxGlyphCount: 1,
+                      qCardinal: 26,
+                      qSortIndicator: 'A',
+                      qGroupFallbackTitles: ['Alpha'],
+                      qGroupPos: 0,
+                      qStateCounts: {
+                        qLocked: 0,
+                        qSelected: 0,
+                        qOption: 26,
+                        qDeselected: 0,
+                        qAlternative: 0,
+                        qExcluded: 0,
+                        qSelectedExcluded: 0,
+                        qLockedExcluded: 0,
+                      },
+                      qTags: ['$ascii', '$text'],
+                      qDimensionType: 'D',
+                      qGrouping: 'N',
+                      qNumFormat: {
+                        qType: 'U',
+                        qnDec: 0,
+                        qUseThou: 0,
+                      },
+                      qIsAutoFormat: true,
+                      qGroupFieldDefs: ['Alpha'],
+                      qMin: 'NaN',
+                      qMax: 'NaN',
+                      qAttrExprInfo: [],
+                      qAttrDimInfo: [],
+                      qCardinalities: {
+                        qCardinal: 26,
+                        qHypercubeCardinal: 0,
+                        qAllValuesCardinal: -1,
+                      },
+                      cId: 'cbse7g',
+                    },
+                  ],
+                  qMeasureInfo: [],
+                  qEffectiveInterColumnSortOrder: [0],
+                  qGrandTotalRow: [],
+                  qDataPages: [
+                    {
+                      qMatrix: [
+                        [
+                          {
+                            qText: 'A',
+                            qNum: 'NaN',
+                            qElemNumber: 0,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'B',
+                            qNum: 'NaN',
+                            qElemNumber: 1,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'C',
+                            qNum: 'NaN',
+                            qElemNumber: 2,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'D',
+                            qNum: 'NaN',
+                            qElemNumber: 3,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'E',
+                            qNum: 'NaN',
+                            qElemNumber: 4,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'F',
+                            qNum: 'NaN',
+                            qElemNumber: 5,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'G',
+                            qNum: 'NaN',
+                            qElemNumber: 6,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'H',
+                            qNum: 'NaN',
+                            qElemNumber: 7,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'I',
+                            qNum: 'NaN',
+                            qElemNumber: 8,
+                            qState: 'O',
+                          },
+                        ],
+                        [
+                          {
+                            qText: 'J',
+                            qNum: 'NaN',
+                            qElemNumber: 9,
+                            qState: 'O',
+                          },
+                        ],
+                      ],
+                      qTails: [
+                        {
+                          qUp: 0,
+                          qDown: 0,
+                        },
+                      ],
+                      qArea: {
+                        qLeft: 0,
+                        qTop: 0,
+                        qWidth: 1,
+                        qHeight: 10,
+                      },
+                    },
+                  ],
+                  qPivotDataPages: [],
+                  qStackedDataPages: [],
+                  qMode: 'S',
+                  qNoOfLeftDims: -1,
+                  qTreeNodesOnDim: [],
+                  qColumnOrder: [],
+                },
+              },
+            ],
+          };
+        },
+      },
+    ],
+  };
+}

test/integration/table/table.int.js

@@ -1,10 +1,29 @@
-describe('Simple visualization', () => {
+const path = require('path');
+const serve = require('@nebula.js/cli-serve'); // eslint-disable-line
+const puppeteerUtil = require('../../utils/puppeteer-util');
+
+describe('Table visualization', () => {
   const content = '.simple-table';
+  let s;
+
+  before(async () => {
+    s = await serve({
+      entry: path.resolve(__dirname, 'sn-table'),
+      open: false,
+      fixturePath: 'test/integration/table',
+    });
+    puppeteerUtil.addListeners(page);
+  });
+
+  after(() => {
+    s.close();
+    puppeteerUtil.removeListeners(page);
+  });
 
   describe('basic', () => {
     before(async () => {
-      const app = encodeURIComponent(process.env.APP_ID || '/apps/ctrl00.qvf');
-      await page.goto(`${process.env.BASE_URL}/render/?app=${app}&cols=Alpha`);
+      const url = `${s.url}/render?fixture=table.fix.js`;
+      await page.goto(url);
 
       await page.waitForSelector(content, { visible: true });
     });

test/utils/puppeteer-util.js

@@ -0,0 +1,22 @@
+/* eslint-disable no-console */
+
+async function consoleEvent(msg) {
+  for (let i = 0; i < msg.args().length; ++i) {
+    console.log(`console ${msg.text()}`);
+  }
+}
+
+function pageerrorEvent(e) {
+  console.error('Web: ', e.message);
+}
+
+module.exports = {
+  addListeners(page) {
+    page.on('console', consoleEvent);
+    page.on('pageerror', pageerrorEvent);
+  },
+  removeListeners(page) {
+    page.removeListener('console', consoleEvent);
+    page.removeListener('pageerror', pageerrorEvent);
+  },
+};