Merge pull request #543 from lawnstarter/PE-36722

PE-36722: Adjust comparison for getSelectedItem

Author: alberto-mourao-lawnstarter

package.json

@@ -24,7 +24,8 @@
         "/src"
     ],
     "dependencies": {
-        "lodash.isequal": "^4.5.0"
+        "lodash.isequal": "^4.5.0",
+        "lodash.isobject": "^3.0.2"
     },
     "devDependencies": {
         "@react-native-picker/picker": "^2.4.0",

src/index.js

@@ -1,8 +1,9 @@
+import { Picker } from '@react-native-picker/picker';
+import isEqual from 'lodash.isequal';
+import isObject from 'lodash.isobject';
+import PropTypes from 'prop-types';
 import React, { PureComponent } from 'react';
 import { Keyboard, Modal, Platform, Text, TextInput, TouchableOpacity, View } from 'react-native';
-import PropTypes from 'prop-types';
-import isEqual from 'lodash.isequal';
-import { Picker } from '@react-native-picker/picker';
 import { defaultStyles } from './styles';
 
 export default class RNPickerSelect extends PureComponent {
@@ -102,7 +103,11 @@ export default class RNPickerSelect extends PureComponent {
             if (item.key && key) {
                 return isEqual(item.key, key);
             }
-            return isEqual(item.value, value);
+            if (isObject(item.value) || isObject(value)) {
+                return isEqual(item.value, value);
+            }
+            // convert to string to make sure types match
+            return isEqual(String(item.value), String(value));
         });
         if (idx === -1) {
             idx = 0;

test/test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Platform, Keyboard, View } from 'react-native';
+import { Keyboard, Platform, View } from 'react-native';
 import RNPickerSelect from '../src';
 
 const selectItems = [
@@ -29,6 +29,33 @@ const selectItems = [
     },
 ];
 
+const objectSelectItems = [
+    {
+        label: 'Red',
+        value: { label: 'red' },
+    },
+    {
+        label: 'Orange',
+        value: { label: 'orange' },
+    },
+    {
+        label: 'Yellow',
+        value: { label: 'yellow' },
+    },
+    {
+        label: 'Green',
+        value: { label: 'green' },
+    },
+    {
+        label: 'Blue',
+        value: { label: 'blue' },
+    },
+    {
+        label: 'Indigo',
+        value: { label: 'indigo' },
+    },
+];
+
 const violet = { label: 'Violet', value: 'violet' };
 
 const placeholder = {
@@ -134,6 +161,20 @@ describe('RNPickerSelect', () => {
         expect(onValueChangeSpy).toHaveBeenCalledWith('orange', 2);
     });
 
+    it('should return the expected option to a callback passed into onSelect when the value is an object', () => {
+        const onValueChangeSpy = jest.fn();
+        const wrapper = shallow(
+            <RNPickerSelect
+                items={objectSelectItems}
+                placeholder={placeholder}
+                onValueChange={onValueChangeSpy}
+            />
+        );
+
+        wrapper.find('[testID="ios_picker"]').props().onValueChange(objectSelectItems[5].value, 5);
+        expect(onValueChangeSpy).toHaveBeenCalledWith(objectSelectItems[5].value, 5);
+    });
+
     it('should show the picker when pressed', () => {
         const wrapper = shallow(
             <RNPickerSelect items={selectItems} placeholder={placeholder} onValueChange={noop} />

yarn.lock

@@ -5719,6 +5719,11 @@ lodash.isequal@^4.5.0:
   resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
   integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
 
+lodash.isobject@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/lodash.isobject/-/lodash.isobject-3.0.2.tgz#3c8fb8d5b5bf4bf90ae06e14f2a530a4ed935e1d"
+  integrity sha512-3/Qptq2vr7WeJbB4KHUSKlq8Pl7ASXi3UG6CMbBm8WRtXi8+GHm7mKaU3urfpSEzWe2wCIChs6/sdocUsTKJiA==
+
 lodash.merge@^4.6.2:
   version "4.6.2"
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"