use testem for tests

.travis.yml

@@ -1,5 +1,24 @@
+---
 language: node_js
 node_js:
-  - "0.10"
-notifications:
-  email: false
+  - "0.12"
+
+sudo: false
+
+cache:
+  directories:
+    - node_modules
+
+before_install:
+  - export PATH=/usr/local/phantomjs-2.0.0/bin:$PATH
+  - "npm config set spin false"
+  - "npm install -g npm@^2"
+
+install:
+  - npm install -g broccoli-cli
+  - npm install -g bower
+  - bower install
+  - npm install
+
+script:
+  - npm test

Brocfile.js

@@ -2,6 +2,7 @@
 
 var multiBuilder = require('broccoli-multi-builder');
 var mergeTrees = require('broccoli-merge-trees');
+var testTreeBuilder = require('./broccoli/test-tree-builder');
 
 var jsSrc = './src/js';
 var vendoredModules = ['content-kit-compiler', 'content-kit-utils'];
@@ -27,4 +28,9 @@ var cjsTree = multiBuilder.buildCJS({
   packageName: packageName
 });
 
-module.exports = mergeTrees([ amdTree, globalTree, cjsTree ]);
+module.exports = mergeTrees([
+  amdTree,
+  globalTree,
+  cjsTree,
+  testTreeBuilder.build()
+]);

README.md

@@ -77,11 +77,20 @@ Running ContentKit tests and demo server locally requires the following dependen
 * [node.js](http://nodejs.org/) ([install package](http://nodejs.org/download/)) or `brew install node`
 * `gulp`, via `npm install -g gulp`
 
-To run tests:
+### Tests
 
-```
-gulp test
-```
+Install npm and bower:
+
+  * `bower i i`
+  * `npm i`
+
+Run tests via the built-in broccoli server:
+
+  * `npm run serve && open http://localhost:4200/tests`
+
+Or run tests via testem:
+
+  * `npm test`
 
 To run the demo server:
 

bower.json

@@ -16,6 +16,6 @@
     "tests"
   ],
   "dependencies": {
-    "loader.js": "~3.2.1"
+    "ember-cli-test-loader": "~0.1.3"
   }
 }

broccoli/test-tree-builder.js

@@ -0,0 +1,58 @@
+/* jshint node:true */
+var funnel = require('broccoli-funnel');
+var es6 = require('broccoli-babel-transpiler');
+var concat = require('broccoli-concat');
+var mergeTrees = require('broccoli-merge-trees');
+
+var pkg = require('../package.json');
+var packageName = pkg.name;
+var outputFileName = packageName + '-tests.amd.js';
+
+function buildTestTree() {
+  var testJSTree = funnel('./tests', {
+    include: ['**/*.js'],
+    destDir: '/tests'
+  });
+
+  testJSTree = es6(testJSTree, {
+    moduleIds: true,
+    modules: 'amdStrict'
+  });
+
+  testJSTree = concat(testJSTree, {
+    inputFiles: ['**/*.js'],
+    outputFile: '/tests/' + outputFileName
+  });
+
+  var testExtTree = funnel('./node_modules', {
+    include: [
+      'qunitjs/qunit/qunit.js',
+      'qunitjs/qunit/qunit.css'
+    ],
+    destDir: '/tests'
+  });
+
+  testExtTree = mergeTrees([testExtTree, funnel('./bower_components', {
+    include: [
+      'ember-cli-test-loader/test-loader.js'
+    ],
+    destDir: '/tests'
+  })]);
+
+  var testHTMLTree = funnel('./tests', {
+    include: ['index.html'],
+    destDir: '/tests'
+  });
+
+  var testTree = mergeTrees([
+    testJSTree,
+    testExtTree,
+    testHTMLTree
+  ]);
+
+  return testTree;
+}
+
+module.exports = {
+  build: buildTestTree
+};

package.json

@@ -9,7 +9,7 @@
   },
   "scripts": {
     "start": "node server/index.js",
-    "test": "gulp test",
+    "test": "testem ci",
     "build": "rm -rf dist && broccoli build dist",
     "prepublish": "npm run build"
   },
@@ -30,6 +30,9 @@
   },
   "devDependencies": {
     "broccoli": "^0.16.3",
+    "broccoli-babel-transpiler": "^5.2.3",
+    "broccoli-concat": "0.0.13",
+    "broccoli-funnel": "^0.2.3",
     "broccoli-merge-trees": "^0.2.1",
     "broccoli-multi-builder": "^0.1.0",
     "content-kit-compiler": "0.2.3",
@@ -46,6 +49,7 @@
     "gulp-open": "^0.2.8",
     "gulp-qunit": "^1.2.1",
     "gulp-uglify": "^1.1.0",
-    "qunitjs": "^1.17.1"
+    "qunitjs": "^1.17.1",
+    "testem": "^0.8.4"
   }
 }

src/js/editor/editor-factory.js

@@ -1,5 +1,4 @@
 import Editor from './editor';
-import { doc } from 'content-kit-compiler';
 
 /**
  * @class EditorFactory
@@ -17,7 +16,7 @@ function EditorFactory(element, options) {
   }
 
   if (typeof element === 'string') {
-    elements = doc.querySelectorAll(element);
+    elements = document.querySelectorAll(element);
   } else if (element && element.length) {
     elements = element;
   } else if (element) {

src/js/index.js

@@ -7,20 +7,21 @@ import {
   HTMLRenderer
 } from 'content-kit-compiler';
 
-import EditorFactory from './editor/editor-factory';
+import Editor from './editor/editor-factory';
 
-// Create a namespace and selectivly expose public modules
-var ContentKit = {};
-ContentKit.Type = Type;
-ContentKit.BlockModel = BlockModel;
-ContentKit.EmbedModel = EmbedModel;
-ContentKit.Compiler = Compiler;
-ContentKit.HTMLParser = HTMLParser;
-ContentKit.HTMLRenderer = HTMLRenderer;
-ContentKit.Editor = EditorFactory;
+const ContentKit = {
+  Type,
+  BlockModel,
+  EmbedModel,
+  Compiler,
+  HTMLParser,
+  HTMLRenderer,
+  Editor
+};
 
 export function registerGlobal(global) {
   global.ContentKit = ContentKit;
 }
 
+export { Editor };
 export default ContentKit;

testem.json

@@ -0,0 +1,16 @@
+{
+  "framework": "qunit",
+  "test_page": "dist/tests/index.html",
+  "src_files": [
+    "tests/**/*.js",
+    "src/**/*.js"
+  ],
+  "before_tests": "npm run build",
+  "launch_in_ci": [
+    "PhantomJS"
+  ],
+  "launch_in_dev": [
+    "PhantomJS",
+    "Chrome"
+  ]
+}

tests/tests.js → tests/editor-test.js

@@ -1,8 +1,12 @@
+/* global QUnit, test, asyncTest, ok, equal */
+
 var fixture = document.getElementById('qunit-fixture');
 var editorElement = document.createElement('div');
 editorElement.id = 'editor1';
 editorElement.className = 'editor';
 
+import { Editor } from 'content-kit-editor';
+
 QUnit.module('Editor', {
   setup: function() {
     fixture.appendChild(editorElement);
@@ -13,57 +17,57 @@ QUnit.module('Editor', {
 });
 
 test('can create an editor', function() {
-  var editor = new ContentKit.Editor();
-  ok(editor instanceof ContentKit.Editor);
+  var editor = new Editor();
+  ok(editor instanceof Editor);
 });
 
 test('can create an editor via dom node reference', function() {
-  var editor = new ContentKit.Editor(editorElement);
+  var editor = new Editor(editorElement);
   equal(editor.element, editorElement);
 });
 
 test('can create an editor via dom node reference from getElementById', function() {
-  var editor = new ContentKit.Editor(document.getElementById('editor1'));
+  var editor = new Editor(document.getElementById('editor1'));
   equal(editor.element, editorElement);
 });
 
 test('can create an editor via id selector', function() {
-  var editor = new ContentKit.Editor('#editor1');
+  var editor = new Editor('#editor1');
   equal(editor.element, editorElement);
 });
 
 test('can create an editor via class selector', function() {
-  var editor = new ContentKit.Editor('.editor');
+  var editor = new Editor('.editor');
   equal(editor.element, editorElement);
 });
 
 test('can recreate an editor on the same element', function() {
-  var editor = new ContentKit.Editor('#editor1');
+  var editor = new Editor('#editor1');
   ok(editor.element === editorElement);
 
-  editor = new ContentKit.Editor('.editor');
+  editor = new Editor('.editor');
   equal(editor.element, editorElement);
   equal(editor.element.className, 'editor ck-editor');
 });
 
 test('creating an editor doesn\'t trash existing class names', function() {
   editorElement.className = 'some-class';
 
-  var editor = new ContentKit.Editor('.some-class');
+  var editor = new Editor('.some-class');
   equal(editor.element.className, 'some-class ck-editor');
 });
 
 test('creating an editor without a class name adds appropriate class', function() {
   editorElement.className = '';
 
-  var editor = new ContentKit.Editor(document.getElementById('editor1'));
+  var editor = new Editor(document.getElementById('editor1'));
   equal(editor.element.className, 'ck-editor');
 });
 
 asyncTest('editor fires update event', function() {
   expect(2);
 
-  var editor = new ContentKit.Editor();
+  var editor = new Editor();
   editor.on('update', function(data) {
     equal (this, editor);
     equal (data.index, 99);

tests/index.html

@@ -2,17 +2,23 @@
 <html>
 <head>
   <meta charset="utf-8">
-  <title>QUnit</title>
-  <link rel="stylesheet" href="../node_modules/qunitjs/qunit/qunit.css">
+  <title>Content-Kit-Editor tests</title>
+  <link rel="stylesheet" href="./qunitjs/qunit/qunit.css">
 </head>
 <body>
 
   <div id="qunit"></div>
   <div id="qunit-fixture"></div>
 
-  <script src="../node_modules/qunitjs/qunit/qunit.js"></script>
-  <script src="../dist/content-kit-editor.js"></script>
-  <script src="tests.js"></script>
-
+  <script src="./qunitjs/qunit/qunit.js"></script>
+  <script src="/testem.js"></script>
+  <script src="../content-kit-editor.amd.js"></script>
+  <script src="./content-kit-editor-tests.amd.js"></script>
+  <script src="./ember-cli-test-loader/test-loader.js"></script>
+  <script>
+    var TestLoader = require('ember-cli/test-loader')['default'];
+    var testLoader = new TestLoader();
+    testLoader.loadModules();
+  </script>
 </body>
 </html>