Generate test bundle using webpack #55

InFact-coop · Mar 15, 2018 · 68c38b7 · 68c38b7
1 parent 426c0f1
commit 68c38b7
Show file tree

Hide file tree

Showing 6 changed files with 102 additions and 73 deletions.
diff --git a/.gitignore b/.gitignore
@@ -6,8 +6,8 @@ repl-temp-*
 # DS-Store
 .DS_Store
 
-elm.js
 bundle.js
+test-bundle.js
 
 
 # generated css

diff --git a/public/qunit/qunit.html b/public/qunit/qunit.html
diff --git a/src/js/elm.js b/src/js/elm.js
@@ -0,0 +1,20 @@
+import Flickity from 'flickity';
+import Dexie from 'dexie';
+import idb from './idb';
+
+const Elm = require('../elm/Main.elm');
+const app = Elm.Main.fullscreen();
+const db = new Dexie('stimmy_things');
+
+app.ports.initCarousel.subscribe(function() {
+  window.requestAnimationFrame(function() {
+    var carouselElement = document.getElementsByClassName('makecarousel')[0];
+    var flkty = new Flickity(carouselElement, {
+      lazyLoad: true,
+      adaptiveHeight: true,
+      wrapAround: true,
+      prevNextButtons: false,
+      pageDots: true
+    });
+  });
+});
diff --git a/tests/front-end/qunit.html b/tests/front-end/qunit.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <title>QUnit Testing - Stimmy Things</title>
+  <link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.5.1.css">
+</head>
+
+<body>
+  <div id="qunit"></div>
+  <div id="qunit-fixture"></div>
+  <script src="https://code.jquery.com/qunit/qunit-2.5.1.js"></script>
+  <script src="./test-bundle.js"></script>
+</body>
+
+</html>
diff --git a/src/js/qunit.js → tests/front-end/qunit.js b/src/js/qunit.js → tests/front-end/qunit.js
@@ -1,15 +1,15 @@
 // import QUnit from "qunit";
-import idb from "./idb";
-import Dexie from "dexie";
+import idb from '../../src/js/idb';
+import Dexie from 'dexie';
 
-const db = new Dexie("test_db");
+const db = new Dexie('test_db');
 idb.createTables(db);
 
 let tableNames = [];
 let tableKeys = [];
 
 function checkName() {
-  console.log("checkName", db.name);
+  console.log('checkName', db.name);
   return db.name;
 }
 
@@ -39,75 +39,75 @@ function getLogsKeys() {
 function checkUserDetails(callback) {
   idb
     .createOrUpdateUser(db, {
-      name: "Ivan",
-      avatar: "alien",
-      skin_colour: "skin_colour1",
+      name: 'Ivan',
+      avatar: 'alien',
+      skin_colour: 'skin_colour1',
       user_id: 323423
     })
     .then(res1 => db.user.toArray())
     .then(user => {
-      console.log("user", user[0]);
+      console.log('user', user[0]);
       return user[0];
     })
     .then(res2 => {
-      console.log("res", res);
+      console.log('res', res);
       callback(res);
     });
 }
 
-QUnit.test("hello test", function(assert) {
-  assert.ok(1 == "1", "Passed!");
+QUnit.test('hello test', function(assert) {
+  assert.ok(1 == '1', 'Passed!');
 });
 
-QUnit.test("correct database name", function(assert) {
-  assert.ok(checkName() === "test_db", "Passed!");
+QUnit.test('correct database name', function(assert) {
+  assert.ok(checkName() === 'test_db', 'Passed!');
 });
 
-QUnit.test("correct number of tables", function(assert) {
+QUnit.test('correct number of tables', function(assert) {
   returnTableNames();
-  assert.ok(tableNames.length === 3, "Passed!");
+  assert.ok(tableNames.length === 3, 'Passed!');
 });
 
-QUnit.test("tables exist with correct names", function(assert) {
+QUnit.test('tables exist with correct names', function(assert) {
   returnTableNames();
-  assert.deepEqual(tableNames, ["user", "stims", "logs"], "Passed!");
+  assert.deepEqual(tableNames, ['user', 'stims', 'logs'], 'Passed!');
 });
 
-QUnit.test("user table exists with correct indices", function(assert) {
+QUnit.test('user table exists with correct indices', function(assert) {
   getUserKeys();
-  assert.deepEqual(tableKeys, ["avatar", "skin_colour", "name"], "Passed!");
+  assert.deepEqual(tableKeys, ['avatar', 'skin_colour', 'name'], 'Passed!');
 });
 
-QUnit.test("stims table exists with correct indices", function(assert) {
+QUnit.test('stims table exists with correct indices', function(assert) {
   getStimsKeys();
   assert.deepEqual(
     tableKeys,
     [
-      "stim_name",
-      "body_part",
-      "instructions",
-      "video_src",
-      "user_id",
-      "shared"
+      'stim_name',
+      'body_part',
+      'instructions',
+      'video_src',
+      'user_id',
+      'shared'
     ],
-    "Passed!"
+    'Passed!'
   );
 });
 
-QUnit.test("logs table exists with correct indices", function(assert) {
+QUnit.test('logs table exists with correct indices', function(assert) {
   getLogsKeys();
   assert.deepEqual(
     tableKeys,
     [
-      "stim_id",
-      "time_taken",
-      "pre_face",
-      "post_face",
-      "pre_feelings",
-      "post_feelings",
-      "date_time"
+      'stim_id',
+      'time_taken',
+      'pre_face',
+      'post_face',
+      'pre_feelings',
+      'post_feelings',
+      'date_time'
     ],
-    "Passed!"
+    'Passed!'
   );
 });
 

diff --git a/webpack.config.js b/webpack.config.js
@@ -1,23 +1,32 @@
 const path = require('path');
 
-module.exports = {
-  entry: './src/js/index.js',
-  output: {
-    filename: 'bundle.js',
-    path: path.resolve(__dirname, 'public')
-  },
-  module: {
-    rules: [
-      {
-        test: /\.elm$/,
-        exclude: [/elm-stuff/, /node_modules/],
-        loader: 'elm-webpack-loader',
-        options: {
-          debug: true,
-          warn: true
+module.exports = [
+  {
+    entry: './src/js/index.js',
+    output: {
+      filename: 'bundle.js',
+      path: path.resolve(__dirname, 'public')
+    },
+    module: {
+      rules: [
+        {
+          test: /\.elm$/,
+          exclude: [/elm-stuff/, /node_modules/],
+          loader: 'elm-webpack-loader',
+          options: {
+            debug: true,
+            warn: true
+          }
         }
-      }
-    ]
+      ]
+    },
+    devtool: 'eval'
   },
-  devtool: 'eval'
-};
+  {
+    entry: './tests/front-end/qunit.js',
+    output: {
+      filename: 'test-bundle.js',
+      path: path.resolve(__dirname, 'tests', 'front-end')
+    }
+  }
+];