Adding support for named data

lib/domodule.js

@@ -4,6 +4,8 @@ import parentModule from '../lib/getParentModule';
 import attrObj from 'attrobj';
 import aug from 'aug';
 import { find, findOne, on } from 'domassist';
+import kebabCase from 'lodash.kebabcase';
+import camelCase from 'lodash.camelcase';
 
 const ACTION_SELECTOR = '[data-action]';
 const DOMAssist = { find, findOne, on };
@@ -13,8 +15,14 @@ class Domodule {
     this.log('begin setup');
     this.el = el;
     this.els = {};
-    this.options = aug({}, this.defaults, attrObj('module', this.el));
     this.moduleName = this.el.dataset.module;
+
+    if (typeof this.el.dataset[kebabCase(this.moduleName)] !== 'undefined') {
+      this.options = aug({}, this.defaults, attrObj(camelCase(this.moduleName), this.el));
+    } else {
+      this.options = aug({}, this.defaults, attrObj('module', this.el));
+    }
+
     this.setUps = {
       actions: [],
       named: [],
@@ -230,14 +238,34 @@ class Domodule {
     }
 
     const instances = [];
+    const moduleNames = Object.keys(Domodule.modules);
+
     els.forEach((matched) => {
-      const foundModules = DOMAssist.find('[data-module]', matched);
+      let foundModules = DOMAssist.find('[data-module]', matched);
+
+      moduleNames.forEach(moduleName => {
+        foundModules = foundModules.concat(
+          DOMAssist.find(`[data-${kebabCase(moduleName)}]`, matched)
+        );
+      });
 
       foundModules.forEach((moduleEl) => {
-        const moduleName = moduleEl.dataset.module;
+        let moduleName = moduleEl.dataset.module;
+
+        if (!moduleName) {
+          for (let i = 0, length = moduleNames.length; i < length && !moduleName; i++) {
+            const name = camelCase(moduleNames[i]);
+
+            if (typeof moduleEl.dataset[name] !== 'undefined') {
+              moduleName = moduleNames[i];
+              moduleEl.dataset.module = moduleName;
+            }
+          }
+        }
 
         if (moduleName && typeof Domodule.modules[moduleName] === 'function') {
-          if (typeof Domodule.refs === 'object' && typeof Domodule.refs[moduleEl.dataset.moduleUid] !== 'undefined') {
+          if (typeof Domodule.refs === 'object' &&
+              typeof Domodule.refs[moduleEl.dataset.moduleUid] !== 'undefined') {
             return;
           }
           Domodule.log(`${moduleName} found`);

package.json

@@ -32,10 +32,10 @@
     "eslint-config-firstandthird": "3.2.0",
     "eslint-plugin-import": "2.2.0",
     "phantomjs-prebuilt": "^2.1.14",
-    "scriptkit": "0.0.22",
+    "scriptkit": "0.2.0",
     "tap-spec": "4.1.1",
     "tape-rollup": "4.6.4",
-    "tape-run": "2.1.6"
+    "tape-run": "3.0.0"
   },
   "eslintConfig": {
     "env": {
@@ -46,7 +46,9 @@
   "dependencies": {
     "attrobj": "1.2.0",
     "aug": "1.0.2",
-    "domassist": "1.6.0"
+    "domassist": "1.7.1",
+    "lodash.camelcase": "^4.3.0",
+    "lodash.kebabcase": "^4.1.1"
   },
   "scriptkit": {
     "files": {

test/domodule.test.js

@@ -56,7 +56,33 @@ test('example module registerd', assert => {
 
 test('discover', assert => {
   const modules = setup();
+  const instance = modules[0];
+
   assert.equal(modules.length, 1, 'module found');
+  assert.equal(instance.options.test, 'true', 'test is valid');
+  assert.equal(instance.options.important, 'This is important', 'important is valid');
+  assert.equal(instance.options.title, 'Example Module', 'title is valid');
+  assert.end();
+});
+
+test('discover alternative naming', assert => {
+  const container = document.getElementById('domodule');
+  container.innerHTML = `
+    <button type="button" id="anotherbutton"></button>
+    <div id="ExampleModule" data-example data-example-test="true" data-example-important="This is important" data-example-title="Example Module" data-example-global-screen="screen" data-action="click">
+      <div data-action="testMouseOver" data-action-type="mouseover" style="height: 100px; width: 100px; background: black"></div>
+      <div data-name="tester"></div>
+      <span data-name="spanme"></span>
+      <div id="Nested" data-module="Nested">
+        <button type="button" data-action="nestedAction">NESTED BUTTON</button>
+      </div>
+    </div>
+  `;
+
+  const instance = Domodule.discover()[0];
+  assert.equal(instance.options.test, 'true', 'test is valid');
+  assert.equal(instance.options.important, 'This is important', 'important is valid');
+  assert.equal(instance.options.title, 'Example Module', 'title is valid');
   assert.end();
 });