Added dropdown tests for pf3 select

Author: Hyperkid123

packages/common/src/prop-types-templates.js

@@ -0,0 +1,3 @@
+import PropTypes from 'prop-types';
+
+export const optionsPropType = PropTypes.arrayOf(PropTypes.shape({ label: PropTypes.string.isRequired, value: PropTypes.any }));

packages/pf3-component-mapper/src/form-fields/select/clear-indicator.js

@@ -12,11 +12,7 @@ const ClearIndicator = ({
 
 ClearIndicator.propTypes = {
   innerProps: PropTypes.object.isRequired,
-  clearValue: PropTypes.func,
-};
-
-ClearIndicator.defaultProps = {
-  clearValue: () => undefined,
+  clearValue: PropTypes.func.isRequired,
 };
 
 export default ClearIndicator;

packages/pf3-component-mapper/src/form-fields/select/index.js

@@ -1,15 +1,17 @@
 import React, { Component, createRef, Fragment } from 'react';
 import isEqual from 'lodash/isEqual';
 import './react-select.scss';
+import PropTypes from 'prop-types';
 
-import NewSelect from '@data-driven-forms/common/src/select';
+import DataDrivenSelect from '@data-driven-forms/common/src/select';
 import { DropdownButton } from 'patternfly-react';
 import fnToString from '@data-driven-forms/common/src/utils/fn-to-string';
 import clsx from 'clsx';
 import Option from './option';
 import DropdownIndicator from './dropdown-indicator';
 import ClearIndicator from './clear-indicator';
 import './react-select.scss';
+import { optionsPropType } from '@data-driven-forms/common/src/prop-types-templates';
 
 const getDropdownText = (value, placeholder, options) => {
   if (Array.isArray(value)) {
@@ -55,6 +57,10 @@ class SearchInput extends Component {
 
 }
 
+SearchInput.propTypes = {
+  value: PropTypes.any,
+};
+
 const SelectTitle = ({ title, classNamePrefix, isClearable, value, onClear, isFetching, isDisabled }) => (
   <Fragment>
     <span key="searchable-select-value-label" className={ `${classNamePrefix}-value` }>{ title }</span>
@@ -77,6 +83,16 @@ const SelectTitle = ({ title, classNamePrefix, isClearable, value, onClear, isFe
   </Fragment>
 );
 
+SelectTitle.propTypes = {
+  title: PropTypes.string.isRequired,
+  classNamePrefix: PropTypes.string,
+  isClearable: PropTypes.bool,
+  value: PropTypes.any,
+  onClear: PropTypes.func,
+  isFetching: PropTypes.bool,
+  isDisabled: PropTypes.bool,
+};
+
 class Select extends Component {  constructor(props){
   super(props);
   this.state = {
@@ -171,7 +187,7 @@ class Select extends Component {  constructor(props){
             disabled={ props.isDisabled }
             noCaret
             open={ isOpen }
-            id={ props.id || props.input.name }
+            id={ props.id || input.name }
             title={ <SelectTitle
               isDisabled={ props.isDisabled }
               isFetching={ isFetching }
@@ -185,7 +201,7 @@ class Select extends Component {  constructor(props){
               'is-empty': isPlaceholder,
             }) }>
             { isOpen &&
-              <NewSelect
+              <DataDrivenSelect
                 isFetching={ isFetching }
                 input={ searchableInput }
                 { ...props }
@@ -216,7 +232,7 @@ class Select extends Component {  constructor(props){
     }
 
     return (
-      <NewSelect
+      <DataDrivenSelect
         { ...this.props }
         isFetching={ isFetching }
         options={ options }
@@ -237,4 +253,15 @@ Select.defaultProps = {
   placeholder: 'Search...',
 };
 
+Select.propTypes = {
+  input: PropTypes.shape({
+    name: PropTypes.string.isRequired,
+    onChange: PropTypes.func.isRequired,
+    value: PropTypes.any,
+  }).isRequired,
+  classNamePrefix: PropTypes.string,
+  loadOptions: PropTypes.func,
+  options: optionsPropType,
+};
+
 export default Select;