fix(dropdownSelect): discovery-151 undefined options (#149)

* options, undefined check * activateOptions, length check
quipucords · Sep 20, 2022 · 77052a5 · 77052a5
1 parent 5ecf626
commit 77052a5
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 9 deletions.
diff --git a/src/components/dropdownSelect/__tests__/__snapshots__/dropdownSelect.test.js.snap b/src/components/dropdownSelect/__tests__/__snapshots__/dropdownSelect.test.js.snap
@@ -89,6 +89,8 @@ Array [
 ]
 `;
 
+exports[`Select Component should allow alternate array and object options: undefined options 1`] = `Array []`;
+
 exports[`Select Component should allow alternate direction and position options: direction up 1`] = `
 Object {
   "className": "quipucords-select-pf   ",

diff --git a/src/components/dropdownSelect/__tests__/dropdownSelect.test.js b/src/components/dropdownSelect/__tests__/dropdownSelect.test.js
@@ -100,6 +100,11 @@ describe('Select Component', () => {
     props.selectedOptions = ['world', 'ipsum'];
 
     expect(formatOptions(props).options).toMatchSnapshot('key value object');
+
+    props.options = undefined;
+    props.selectedOptions = [];
+
+    expect(formatOptions(props).options).toMatchSnapshot('undefined options');
   });
 
   it('should allow plain objects as values, and be able to select options based on values within the object', async () => {

diff --git a/src/components/dropdownSelect/dropdownSelect.js b/src/components/dropdownSelect/dropdownSelect.js
@@ -64,7 +64,7 @@ const SelectPosition = DropdownPosition;
 // FixMe: attributes filtered on PF select component. allow data- attributes
 /**
  * Format options into a consumable array of objects format.
- * Note: It is understood that for line 60'ish around "updatedOptions" we dump all values regardless
+ * Note: It is understood that for line 83'ish around "updatedOptions" we dump all values regardless
  * of whether they are plain objects, or not, into updatedOptions. This has been done for speed only,
  * one less check to perform.
  *
@@ -79,14 +79,13 @@ const SelectPosition = DropdownPosition;
 const formatOptions = ({ selectField = { current: null }, options, selectedOptions, variant, ...props } = {}) => {
   const { current: domElement = {} } = selectField;
   const dataAttributes = Object.entries(props).filter(([key]) => /^data-/i.test(key));
-  const updatedOptions = _isPlainObject(options)
-    ? Object.entries(options).map(([key, value]) => ({ ...value, title: key, value }))
-    : _cloneDeep(options);
-
+  const updatedOptions =
+    (_isPlainObject(options) && Object.entries(options).map(([key, value]) => ({ ...value, title: key, value }))) ||
+    (options && _cloneDeep(options)) ||
+    [];
+  const isSelectedOptionsStringNumber = typeof selectedOptions === 'string' || typeof selectedOptions === 'number';
   const activateOptions =
-    (selectedOptions && typeof selectedOptions === 'string') || typeof selectedOptions === 'number'
-      ? [selectedOptions]
-      : selectedOptions;
+    (Array.isArray(selectedOptions) && selectedOptions) || (isSelectedOptionsStringNumber && [selectedOptions]) || [];
 
   updatedOptions.forEach((option, index) => {
     let convertedOption = option;
@@ -106,7 +105,7 @@ const formatOptions = ({ selectField = { current: null }, options, selectedOptio
     convertedOption.textContent = convertedOption.textContent || convertedOption.title;
     convertedOption.label = convertedOption.label || convertedOption.title;
 
-    if (activateOptions) {
+    if (activateOptions.length) {
       let isSelected;
 
       if (_isPlainObject(convertedOption.value)) {