Fix suffix of Input.Search

close #7970

components/input/Search.tsx

@@ -22,15 +22,17 @@ export default class Search extends React.Component<SearchProps, any> {
     this.input.focus();
   }
   render() {
-    const { className, inputPrefixCls, prefixCls, ...others } = this.props;
+    const { className, inputPrefixCls, prefixCls, suffix, ...others } = this.props;
     delete (others as any).onSearch;
-    const searchSuffix = (
+    const searchIcon = (
       <Icon
         className={`${prefixCls}-icon`}
         onClick={this.onSearch}
         type="search"
+        key="searchIcon"
       />
     );
+    const searchSuffix = suffix ? [suffix, searchIcon] : searchIcon;
     return (
       <Input
         onPressEnter={this.onSearch}

components/input/__tests__/__snapshots__/index.test.js.snap

@@ -17,6 +17,59 @@ exports[`Input should support maxLength 1`] = `
 </Input>
 `;
 
+exports[`Input.Search should support suffix 1`] = `
+<Search
+  inputPrefixCls="ant-input"
+  prefixCls="ant-input-search"
+  suffix="suffix"
+>
+  <Input
+    className="ant-input-search"
+    disabled={false}
+    onPressEnter={[Function]}
+    prefixCls="ant-input"
+    suffix={
+      Array [
+        "suffix",
+        <Icon
+          className="ant-input-search-icon"
+          onClick={[Function]}
+          type="search"
+        />,
+      ]
+    }
+    type="text"
+  >
+    <span
+      className="ant-input-search ant-input-affix-wrapper"
+    >
+      <input
+        className="ant-input"
+        disabled={false}
+        onKeyDown={[Function]}
+        style={null}
+        type="text"
+      />
+      <span
+        className="ant-input-suffix"
+      >
+        suffix
+        <Icon
+          className="ant-input-search-icon"
+          onClick={[Function]}
+          type="search"
+        >
+          <i
+            className="anticon anticon-search ant-input-search-icon"
+            onClick={[Function]}
+          />
+        </Icon>
+      </span>
+    </span>
+  </Input>
+</Search>
+`;
+
 exports[`TextArea should support disabled 1`] = `
 <TextArea
   disabled={true}

components/input/__tests__/index.test.js

@@ -7,7 +7,6 @@ const { TextArea } = Input;
 
 const delay = timeout => new Promise(resolve => setTimeout(resolve, timeout));
 
-
 describe('Input', () => {
   it('should support maxLength', async () => {
     const wrapper = mount(
@@ -16,6 +15,7 @@ describe('Input', () => {
     expect(wrapper).toMatchSnapshot();
   });
 });
+
 describe('TextArea', () => {
   it('should auto calculate height according to content length', async () => {
     const wrapper = mount(
@@ -77,3 +77,12 @@ describe('As Form Control', () => {
     expect(wrapper.find('textarea').prop('value')).toBe('');
   });
 });
+
+describe('Input.Search', () => {
+  it('should support suffix', async () => {
+    const wrapper = mount(
+      <Input.Search suffix="suffix" />
+    );
+    expect(wrapper).toMatchSnapshot();
+  });
+});