diff --git a/packages/metal-dom/src/domData.js b/packages/metal-dom/src/domData.js index f2cac29e..c25800ca 100644 --- a/packages/metal-dom/src/domData.js +++ b/packages/metal-dom/src/domData.js @@ -1,5 +1,7 @@ 'use strict'; +import {isDef} from 'metal'; + const METAL_DATA = '__metal_data__'; /** @@ -21,7 +23,7 @@ class domData { if (!name) { return element[METAL_DATA]; } - if (!element[METAL_DATA][name] && initialValue) { + if (!isDef(element[METAL_DATA][name]) && isDef(initialValue)) { element[METAL_DATA][name] = initialValue; } return element[METAL_DATA][name]; @@ -35,6 +37,24 @@ class domData { static has(element) { return !!element[METAL_DATA]; } + + /** + * Sets Metal.js's data for the given element. + * @param {!Element} element + * @param {string=} name Property from the data to be set. + * @param {*=} value Value to be set on the element. + * @return {!Object|*} + */ + static set(element, name, value) { + if (!element[METAL_DATA]) { + element[METAL_DATA] = {}; + } + if (!name || !isDef(value)) { + return element[METAL_DATA]; + } + element[METAL_DATA][name] = value; + return element[METAL_DATA][name]; + } } export default domData; diff --git a/packages/metal-dom/test/domData.js b/packages/metal-dom/test/domData.js index 2886e41b..ec11e865 100644 --- a/packages/metal-dom/test/domData.js +++ b/packages/metal-dom/test/domData.js @@ -3,19 +3,102 @@ import domData from '../src/domData'; describe('domData', function() { - it('should get data object from element', function() { - let data = domData.get(document.createElement('div')); - assert.ok(data); + describe('get', function() { + it('should get data object from element', function() { + let data = domData.get(document.createElement('div')); + assert.ok(data); + }); + + it('should return same data object for the same element', function() { + let element = document.createElement('div'); + assert.strictEqual(domData.get(element), domData.get(element)); + }); + + it('should return different data objects for the different elements', function() { + let element1 = document.createElement('div'); + let element2 = document.createElement('div'); + assert.notStrictEqual(domData.get(element1), domData.get(element2)); + }); + + it('should set initialValue only if value does not exist', function() { + let element = document.createElement('div'); + let key = domData.get(element, 'key', 'foo'); + assert.strictEqual(key, 'foo'); + + key = domData.get(element, 'key', 'bar'); + assert.strictEqual(key, 'foo'); + }); + + it('should allow initialValue to be falsy', function() { + let element = document.createElement('div'); + let key = domData.get(element, 'key', 0); + assert.strictEqual(key, 0); + + key = domData.get(element, 'key', 1); + assert.strictEqual(key, 0); + }); + + it('should not overwrite initialValue with undefined', function() { + let element = document.createElement('div'); + let key = domData.get(element, 'key', 'foo'); + assert.strictEqual(key, 'foo'); + + key = domData.get(element, 'key'); + assert.strictEqual(key, 'foo'); + }); }); - it('should return same data object for the same element', function() { - let element = document.createElement('div'); - assert.strictEqual(domData.get(element), domData.get(element)); + describe('has', function() { + it('should return false if no data object exists', function() { + let element = document.createElement('div'); + assert.strictEqual(domData.has(element), false); + }); + + it('should return true if data object exists', function() { + let element = document.createElement('div'); + domData.get(element); + assert.strictEqual(domData.has(element), true); + }); }); - it('should return different data objects for the different elements', function() { - let element1 = document.createElement('div'); - let element2 = document.createElement('div'); - assert.notStrictEqual(domData.get(element1), domData.get(element2)); + describe('set', function() { + it('should get data object from element', function() { + let element = document.createElement('div'); + domData.set(element, 'value', 20); + let data = domData.get(element); + assert.deepEqual(data, { + value: 20, + }); + }); + + it('should get data value from element', function() { + let element = document.createElement('img'); + domData.set(element, 'value', true); + let data = domData.get(element, 'value'); + assert.strictEqual(data, true); + }); + + it('should create data object without a value', function() { + let element = document.createElement('div'); + domData.set(element); + let data = domData.get(element); + assert.deepEqual(data, {}); + }); + + it('should overwrite a data value using set', function() { + let element = document.createElement('div'); + domData.set(element, 'value', true); + assert.strictEqual(domData.get(element, 'value'), true); + domData.set(element, 'value', 20); + assert.strictEqual(domData.get(element, 'value'), 20); + }); + + it('should set falsy value', function() { + let element = document.createElement('div'); + domData.set(element, 'value', false); + assert.strictEqual(domData.get(element, 'value'), false); + domData.set(element, 'value', 0); + assert.strictEqual(domData.get(element, 'value'), 0); + }); }); });