[terra-form-select] Combobox custom placeholder remove

packages/terra-core-docs/CHANGELOG.md

@@ -2,6 +2,9 @@
 
 ## Unreleased
 
+* Updated
+  * Updated the Upgrade Guide for `terra-form-combobox`.
+
 ## 1.49.0 - (November 3, 2023)
 
 * Updated

packages/terra-core-docs/src/terra-dev-site/doc/form-select/UpgradeGuide.16.doc.mdx

@@ -175,6 +175,7 @@ To upgrade from 5.0 to 6.0 each existing Select must be reviewed and updated to
 
 ### Breaking Changes
 
+* Removed support for custom placeholder on the `combobox`
 * Removed `boundingRef`
 * Removed `isPlaceholderHidden`
 * Removed `name`

packages/terra-form-select/CHANGELOG.md

@@ -2,6 +2,9 @@
 
 ## Unreleased
 
+* Breaking Change
+  * Removed support for custom placeholder on the `combobox`.
+
 * Added
   * Added No results found text in `terra-form-select-combobox`.
 

packages/terra-form-select/src/Combobox.jsx

@@ -88,10 +88,6 @@ const propTypes = {
    * Callback function invoked for each option on search change. function(searchValue, option)
    */
   optionFilter: PropTypes.func,
-  /**
-   * Placeholder text.
-   */
-  placeholder: PropTypes.string,
   /**
    * Whether the field is required.
    */
@@ -122,7 +118,6 @@ const defaultProps = {
   onSearch: undefined,
   onSelect: undefined,
   optionFilter: undefined,
-  placeholder: undefined,
   required: false,
   value: undefined,
   inputId: undefined,
@@ -200,20 +195,10 @@ class Combobox extends React.Component {
 
   render() {
     const {
-      allowClear, children, defaultValue, onChange, placeholder, required, value, intl, inputId, ...otherProps
+      allowClear, children, defaultValue, onChange, required, value, intl, inputId, ...otherProps
     } = this.props;
 
     const defaultPlaceholder = intl.formatMessage({ id: 'Terra.form.select.defaultDisplay' });
-    const selectPlaceholder = placeholder === undefined ? defaultPlaceholder : placeholder;
-    let clearOptionDisplay;
-
-    if (allowClear) {
-      if (selectPlaceholder.length === 0) {
-        clearOptionDisplay = defaultPlaceholder;
-      } else {
-        clearOptionDisplay = selectPlaceholder;
-      }
-    }
 
     return (
       <Frame
@@ -223,10 +208,10 @@ class Combobox extends React.Component {
         display={this.display()}
         onDeselect={this.handleDeselect}
         onSelect={this.handleSelect}
-        placeholder={selectPlaceholder}
+        placeholder={defaultPlaceholder}
         required={required}
         totalOptions={SelectUtil.getTotalNumberOfOptions(children)}
-        clearOptionDisplay={clearOptionDisplay}
+        clearOptionDisplay={defaultPlaceholder}
         inputId={inputId}
       >
         {this.state.tags}

packages/terra-form-select/tests/wdio/select-spec.js

@@ -909,7 +909,7 @@ Terra.describeViewports('Select', ['tiny'], () => {
       it('combobox input should be focused', () => {
         expect($('[data-terra-select] input')).toBeFocused();
 
-        Terra.validates.element('is-touch-accessible-tab-focus', { selector: '#root' });
+        Terra.validates.element('combobox-is-touch-accessible-tab-focus', { selector: '#root' });
       });
 
       after(() => {