[fixed] dropdown correctly checks value equality

Author: jquense

.travis.yml

@@ -1,11 +1,11 @@
 sudo: false
 language: node_js
 node_js:
-- 4
-cache:
-  directories:
-    - node_modules
+  - stable
 before_install:
   - export CHROME_BIN=chromium-browser
   - export DISPLAY=:99.0
   - sh -e /etc/init.d/xvfb start
+branches:
+  only:
+    - master

src/DropdownList.jsx

@@ -11,7 +11,7 @@ import GroupableList   from './ListGroupable';
 import validateList    from './util/validateListInterface';
 import createUncontrolledWidget from 'uncontrollable';
 
-import { dataItem, dataText, dataIndexOf } from './util/dataHelpers';
+import { dataItem, dataText, dataIndexOf, valueMatcher } from './util/dataHelpers';
 import { widgetEditable, widgetEnabled, isDisabled, isReadOnly } from './util/interaction';
 import { instanceId, notify, isFirstFocusedRender } from './util/widgetHelpers';
 
@@ -154,11 +154,11 @@ var DropdownList = React.createClass({
         aria-owns={listID}
         aria-busy={!!busy}
         aria-live={!open && 'polite'}
-        onKeyPress={this._keyPress}
         aria-autocomplete="list"
         aria-disabled={disabled }
         aria-readonly={readOnly }
         onKeyDown={this._keyDown}
+        onKeyPress={this._keyPress}
         onClick={this._click}
         onFocus={this._focus.bind(null, true)}
         onBlur ={this._focus.bind(null, false)}
@@ -334,7 +334,7 @@ var DropdownList = React.createClass({
   },
 
   change(data){
-    if ( !_.isShallowEqual(data, this.props.value) ) {
+    if (!valueMatcher(data, this.props.value, this.props.valueField)) {
       notify(this.props.onChange, data)
       notify(this.props.onSearch, '')
       this.close()

src/util/dataHelpers.js

@@ -3,11 +3,11 @@ import { has, isShallowEqual } from './_';
 function accessor(data, field){
   var value = data;
 
-  if ( typeof field === 'function')
+  if (typeof field === 'function')
     value = field(data)
-  else if ( data == null )
+  else if (data == null)
     value = data
-  else if ( typeof field === 'string' && typeof data === 'object' && field in data )
+  else if (typeof field === 'string' && typeof data === 'object' && field in data)
     value = data[field]
 
   return value
@@ -29,11 +29,15 @@ export function dataIndexOf(data, item, valueField){
     , finder = datum => valueMatcher(item, datum, valueField);
 
   while (++idx < len)
-    if( finder(data[idx]) ) return idx
+    if (finder(data[idx])) return idx
 
   return -1
 }
 
+/**
+ * I don't know that the shallow equal makes sense here but am too afraid to
+ * remove it.
+ */
 export function valueMatcher(a, b, valueField){
   return isShallowEqual(
     dataValue(a, valueField), dataValue(b, valueField))
@@ -46,7 +50,7 @@ export function dataItem(data, item, valueField){
   // make an attempt to see if we were passed in dataItem vs just a valueField value
   // either an object with the right prop, or a primitive
   // { valueField: 5 } || "hello" [ "hello" ]
-  if( has(item, valueField) || typeof first === typeof val)
+  if (has(item, valueField) || typeof first === typeof val)
     return item
 
   idx = dataIndexOf(data, dataValue(item, valueField), valueField)

test/dropdown.browser.jsx

@@ -210,15 +210,25 @@ describe('DROPDOWNS', function(){
     var change = sinon.spy()
       , instance = render(<Dropdown.ControlledComponent value={data[0]} data={data} duration={0} delay={0} onChange={change} textField='label' />);
 
-    trigger.keyDown(findDOMNode(instance), { keyCode: 80, key: 'p' })
+    trigger.keyPress(findDOMNode(instance), { which: 80, key: 'p' })
 
     setTimeout(() => {
       expect(change.calledOnce).to.be(true)
       expect(change.calledWith(data[2])).to.be(true)
 
-      instance = render(<Dropdown.ControlledComponent open onToggle={()=>{}} value={data[0]} data={data} duration={0} delay={0} onChange={change} textField='label' />);
-
-      trigger.keyDown(findDOMNode(instance), { keyCode: 80, key: 'p' })
+      instance = render(
+        <Dropdown.ControlledComponent open
+          onToggle={()=>{}}
+          value={data[0]}
+          data={data} 
+          duration={0}
+          delay={0}
+          onChange={change}
+          textField='label'
+        />
+      );
+
+      trigger.keyPress(findDOMNode(instance), { which: 80, key: 'p' })
 
       setTimeout(() => {
         expect(instance.state.focusedItem).to.be(data[2])