New enhancements

dist/tool-box.js

@@ -115,7 +115,7 @@ angular.module('jdalt.toolBox')
 
     options = (typeof options == 'boolean') ? { flushRequests: options } : options || {}
 
-    return function compile(scopeParams, overrideOptions) {
+    return angular.extend(function compile(scopeParams, overrideOptions) {
       scopeParams = scopeParams || {}
       var scope = $rootScope.$new()
 
@@ -125,13 +125,20 @@ angular.module('jdalt.toolBox')
       var cloneAttachFn
       if (callOptions.attach) cloneAttachFn = function(clone) { clone.appendTo('body') }
 
-      var el = $compile(tmpl)(scope, cloneAttachFn)
+      var el = $compile(callOptions.template || compile.template)(scope, cloneAttachFn)
       scope.$digest()
 
       if (callOptions.flushRequests) $httpBackend.flush()
+      var innerScope = el.isolateScope()
 
-      return angular.extend({ scope: scope }, DomHelper(el))
-    }
+      return angular.extend({
+        scope: scope,
+        innerScope: innerScope,
+        ctrl: innerScope && (innerScope.$ctrl || innerScope.ctrl)
+      }, DomHelper(el))
+    }, {
+      template: tmpl
+    })
 
   }
 
@@ -148,11 +155,36 @@ angular.module('jdalt.toolBox')
 
   function DomHelper(root) {
 
+    var booleanInputs = 'input[type=checkbox], input[type=radio], option'
+
     function normalizeText(str) {
       if (typeof str !== 'string') throw new Error('normalizeWhitespace called with a non-string argument: ' + typeof str)
       return str.replace(/\s+/g, ' ').trim()
     }
 
+    function getVal(input) {
+      input = input.first()
+      return input.is(booleanInputs) ? input.prop(input.is('option') ? 'selected' : 'checked') : input.val()
+    }
+    function setVal(input, value) {
+      // input.focus() // triggers directive binding
+      input.filter(booleanInputs).each(setBooleanInput)
+      input.not(booleanInputs).val(value).triggerHandler('change')//.triggerHandler('blur')
+
+      function setBooleanInput() {
+        var $input = angular.element(this)
+        var isOption = input.is('option')
+        var prop = isOption ? 'selected' : 'checked'
+        var $changer = isOption ? $input.parents('select') : $input
+
+        var triggerChange = !!value !== $input.prop(prop)
+        $input.prop(prop, !!value)                    // Force attribute state for $setViewValue
+        if (!isOption) $input.triggerHandler('click') // Trigger click handler (will call $setViewValue)
+        if (triggerChange) $changer.triggerHandler('change')
+        // if (scope) scope.$digest() // just in case something is $watching
+      }
+    }
+
     return {
       $el: root, // jQuery wrapped element
 
@@ -229,13 +261,13 @@ angular.module('jdalt.toolBox')
           throw new Error('Element "'+ selector +'" not found to setInputValue')
         }
 
-        inputEl.val(inputVal).trigger('change')
+        setVal(inputEl, inputVal)
         return DomHelper(inputEl)
       },
 
       val: function(value) {
-        if(arguments.length > 0) root.val(value).trigger('change')
-        return root.val()
+        if(arguments.length > 0) setVal(root, value)
+        return getVal(root)
       },
 
       cssClasses: function() {
@@ -395,10 +427,10 @@ angular.module('jdalt.toolBox')
       baseResourceFinder
     ) {
 
-      var DSHttpAdapter
+      var DS, DSHttpAdapter
       var resourceDefs = {}
-      if($injector.has('DS') && $injector.has('DS')) {
-        var DS = $injector.get('DS')
+      if($injector.has('DS') && $injector.get('DS')) {
+        DS = $injector.get('DS')
         DSHttpAdapter = $injector.get('DSHttpAdapter')
         resourceDefs = DS.definitions
       }
@@ -438,7 +470,7 @@ angular.module('jdalt.toolBox')
       }
 
       function isPath(def) {
-        return def[0] == '/'
+        return /^(https?:)?\//i.test(def)
       }
 
       function urlFromPath(method, path, params) {
@@ -464,7 +496,10 @@ angular.module('jdalt.toolBox')
         var resourceBase = baseResourceFinder(def)
         var path = DSHttpAdapter.getPath(method, resourceBase, params, { params: params })
 
-        return completePath(method, path, params) // params gets mutated by getPath, parent params (for nested routes) get stripped out when they are used
+        path = completePath(method, path, params) // params gets mutated by getPath, parent params (for nested routes) get stripped out when they are used
+        var suffix = resourceBase.suffix
+        if (suffix && !~path.indexOf(suffix)) path = path.replace(/(\?.*)?$/, suffix + '$1') // this is done in each js-data-http method, yuck
+        return path
       }
 
       function omit(sourceObj, keys) {

src/directive-helper.js

@@ -10,7 +10,7 @@ angular.module('jdalt.toolBox')
 
     options = (typeof options == 'boolean') ? { flushRequests: options } : options || {}
 
-    return function compile(scopeParams, overrideOptions) {
+    return angular.extend(function compile(scopeParams, overrideOptions) {
       scopeParams = scopeParams || {}
       var scope = $rootScope.$new()
 
@@ -20,13 +20,20 @@ angular.module('jdalt.toolBox')
       var cloneAttachFn
       if (callOptions.attach) cloneAttachFn = function(clone) { clone.appendTo('body') }
 
-      var el = $compile(tmpl)(scope, cloneAttachFn)
+      var el = $compile(callOptions.template || compile.template)(scope, cloneAttachFn)
       scope.$digest()
 
       if (callOptions.flushRequests) $httpBackend.flush()
-
-      return angular.extend({ scope: scope }, DomHelper(el))
-    }
+      var innerScope = el.isolateScope()
+
+      return angular.extend({
+        scope: scope,
+        innerScope: innerScope,
+        ctrl: innerScope && (innerScope.$ctrl || innerScope.ctrl)
+      }, DomHelper(el))
+    }, {
+      template: tmpl
+    })
 
   }
 

src/dom-helper.js

@@ -5,11 +5,36 @@ angular.module('jdalt.toolBox')
 
   function DomHelper(root) {
 
+    var booleanInputs = 'input[type=checkbox], input[type=radio], option'
+
     function normalizeText(str) {
       if (typeof str !== 'string') throw new Error('normalizeWhitespace called with a non-string argument: ' + typeof str)
       return str.replace(/\s+/g, ' ').trim()
     }
 
+    function getVal(input) {
+      input = input.first()
+      return input.is(booleanInputs) ? input.prop(input.is('option') ? 'selected' : 'checked') : input.val()
+    }
+    function setVal(input, value) {
+      // input.focus() // triggers directive binding
+      input.filter(booleanInputs).each(setBooleanInput)
+      input.not(booleanInputs).val(value).triggerHandler('change')//.triggerHandler('blur')
+
+      function setBooleanInput() {
+        var $input = angular.element(this)
+        var isOption = input.is('option')
+        var prop = isOption ? 'selected' : 'checked'
+        var $changer = isOption ? $input.parents('select') : $input
+
+        var triggerChange = !!value !== $input.prop(prop)
+        $input.prop(prop, !!value)                    // Force attribute state for $setViewValue
+        if (!isOption) $input.triggerHandler('click') // Trigger click handler (will call $setViewValue)
+        if (triggerChange) $changer.triggerHandler('change')
+        // if (scope) scope.$digest() // just in case something is $watching
+      }
+    }
+
     return {
       $el: root, // jQuery wrapped element
 
@@ -86,13 +111,13 @@ angular.module('jdalt.toolBox')
           throw new Error('Element "'+ selector +'" not found to setInputValue')
         }
 
-        inputEl.val(inputVal).trigger('change')
+        setVal(inputEl, inputVal)
         return DomHelper(inputEl)
       },
 
       val: function(value) {
-        if(arguments.length > 0) root.val(value).trigger('change')
-        return root.val()
+        if(arguments.length > 0) setVal(root, value)
+        return getVal(root)
       },
 
       cssClasses: function() {

src/request-helper.js

@@ -23,10 +23,10 @@ angular.module('jdalt.toolBox')
       baseResourceFinder
     ) {
 
-      var DSHttpAdapter
+      var DS, DSHttpAdapter
       var resourceDefs = {}
-      if($injector.has('DS') && $injector.has('DS')) {
-        var DS = $injector.get('DS')
+      if($injector.has('DS') && $injector.get('DS')) {
+        DS = $injector.get('DS')
         DSHttpAdapter = $injector.get('DSHttpAdapter')
         resourceDefs = DS.definitions
       }
@@ -66,7 +66,7 @@ angular.module('jdalt.toolBox')
       }
 
       function isPath(def) {
-        return def[0] == '/'
+        return /^(https?:)?\//i.test(def)
       }
 
       function urlFromPath(method, path, params) {
@@ -92,7 +92,10 @@ angular.module('jdalt.toolBox')
         var resourceBase = baseResourceFinder(def)
         var path = DSHttpAdapter.getPath(method, resourceBase, params, { params: params })
 
-        return completePath(method, path, params) // params gets mutated by getPath, parent params (for nested routes) get stripped out when they are used
+        path = completePath(method, path, params) // params gets mutated by getPath, parent params (for nested routes) get stripped out when they are used
+        var suffix = resourceBase.suffix
+        if (suffix && !~path.indexOf(suffix)) path = path.replace(/(\?.*)?$/, suffix + '$1') // this is done in each js-data-http method, yuck
+        return path
       }
 
       function omit(sourceObj, keys) {

test/directive-helper-test.js

@@ -21,6 +21,23 @@ describe('DirectiveHelper', function() {
       dom = compile(null, { attach: true })
       expect(angular.element('#simp-main').length).toEqual(1) // angular.element searches from the body
     })
+
+    it('should allow overwriting the template on the compile function', function() {
+      compile.template = '<div simple-directive test-attr="1">'
+      dom = compile()
+      expect(dom.$el.attr('test-attr')).toBe('1')
+    })
+
+    it('should allow overwriting the template on the compile options', function() {
+      dom = compile(null, { template: '<div simple-directive test-attr="2">' })
+      expect(dom.$el.attr('test-attr')).toBe('2')
+    })
+
+    it('should set scope, innerScope, and ctrl on dom', function() {
+      dom = compile()
+      expect(dom.innerScope).toBe(dom.$el.isolateScope())
+      expect(dom.ctrl).toBe(dom.$el.isolateScope().ctrl)
+    })
   })
 
   describe('for directives that accept scope parameters', function() {

test/dom-helper-test.js

@@ -102,6 +102,37 @@ describe('DomHelper', function() {
       expect(dom.text('#deep-thought-val')).toBe('Fun Fun Fun')
     })
 
+    it('should setInputValue on checkbox input', function() {
+      expect(dom.text('#check-val')).toBe('')
+      dom.setInputValue('#check-el', true)
+      expect(dom.text('#check-val')).toBe('true')
+      expect(dom.find('#check-el').val()).toBe(true)
+      dom.setInputValue('#check-el', null)
+      expect(dom.text('#check-val')).toBe('false')
+      expect(dom.find('#check-el').val()).toBe(false)
+    })
+
+    it('should setInputValue on select', function() {
+      expect(dom.text('#sel-val')).toBe('')
+      dom.setInputValue('#sel-el', 'string:rock')
+      expect(dom.text('#sel-val')).toBe('rock')
+      dom.setInputValue('#sel-el', 'string:glam')
+      expect(dom.text('#sel-val')).toBe('glam')
+    })
+
+    it('should setInputValue on option', function() {
+      expect(dom.text('#sel-val')).toBe('')
+      dom.setInputValue('#sel-el option:eq(1)', true)
+      expect(dom.text('#sel-val')).toBe('prog')
+      expect(dom.find('#sel-el option:eq(1)').val()).toBe(true)
+      dom.setInputValue('#sel-el option:eq(2)', true)
+      expect(dom.text('#sel-val')).toBe('rock')
+      expect(dom.find('#sel-el option:eq(2)').val()).toBe(true)
+      dom.setInputValue('#sel-el option:eq(2)', false)
+      expect(dom.text('#sel-val')).toBe('')
+      expect(dom.find('#sel-el option:eq(2)').val()).toBe(false)
+    })
+
     it('should set input val() on input#deep-thought-inp', function() {
       expect(dom.text('#deep-thought-val')).toBe('42')
       var ret = dom.find('#deep-thought-inp').val('Fun Fun Fun')

test/dummy-js-data/js-data-directive.js

@@ -22,7 +22,8 @@ angular.module('dummy-js-data')
 
   DS.defineResource({
     name: 'monkey',
-    endpoint: '/bed/monkeys'
+    endpoint: '/bed/monkeys',
+    suffix: '.json'
   })
 
   DS.defineResource({

test/dummy/multi-dom-directive.js

@@ -15,14 +15,23 @@ angular.module('dummy')
               '    <li>Thing 3</li>\n' +
               '  </ul>\n' +
               '  <input id="deep-thought-inp" type="text" ng-model="ctrl.allThought" />\n' +
+              '  <input id="check-el" type="checkbox" ng-model="ctrl.checkVal" />\n' +
+              '  <select id="sel-el" ng-model="ctrl.selVal" ng-options="val as key for (key, val) in ctrl.opts"><option value=""></option></select>\n' +
               '  <div id="deep-thought-val">{{ ctrl.allThought }}</div>\n' +
+              '  <div id="check-val">{{ ctrl.checkVal }}</div>\n' +
+              '  <div id="sel-val">{{ ctrl.selVal }}</div>\n' +
               '  <div id="french-yeoman" class="huguenot proletariat"></div>\n' +
               '</div>\n',
     controllerAs: 'ctrl',
     controller: function() {
 
       var vm = this
       vm.allThought = '42'
+      vm.opts = {
+        Rush: 'prog',
+        Queen: 'rock',
+        Kiss: 'glam'
+      }
 
     }
   }

test/js-data-request-test.js

@@ -76,7 +76,7 @@ describe('JsData Request', function() {
     })
 
     it('should request monkey and display monkey names <li>', function() {
-      Req.expectMany('/api/bed/monkeys', { bunch: 10 }, { result: [{ id: 1, name: 'Monkey 1' }, { id: 2, name: 'Monkey 2'}] })
+      Req.expectMany('/api/bed/monkeys.json', { bunch: 10 }, { result: [{ id: 1, name: 'Monkey 1' }, { id: 2, name: 'Monkey 2'}] })
       dom.click('#monkey-button').flush()
 
       expect(dom.text('ul li')).toContain('Monkey 1')