diff --git a/lib/domodule.js b/lib/domodule.js index 3ef01b5..e008da3 100644 --- a/lib/domodule.js +++ b/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`); diff --git a/package.json b/package.json index 0811ec0..1ccf4fd 100644 --- a/package.json +++ b/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": { diff --git a/test/domodule.test.js b/test/domodule.test.js index 3ce03a1..4796ace 100644 --- a/test/domodule.test.js +++ b/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 = ` + +