From 3cff62997d16811ae17618f9b41617973d805d7d Mon Sep 17 00:00:00 2001 From: tjz <415800467@qq.com> Date: Sun, 10 Jun 2018 09:29:18 +0800 Subject: [PATCH] fix: add input search focus & blur methods --- components/input/Search.jsx | 18 +++++------ components/input/__tests__/Search.test.js | 31 +++++++++++++++++++ .../__snapshots__/Search.test.js.snap | 9 ++++++ 3 files changed, 49 insertions(+), 9 deletions(-) create mode 100644 components/input/__tests__/Search.test.js create mode 100644 components/input/__tests__/__snapshots__/Search.test.js.snap diff --git a/components/input/Search.jsx b/components/input/Search.jsx index b0b2a5ee0..11eb8c225 100644 --- a/components/input/Search.jsx +++ b/components/input/Search.jsx @@ -29,6 +29,13 @@ export default { this.$emit('search', this.$refs.input.stateValue) this.$refs.input.focus() }, + focus () { + this.$refs.input.focus() + }, + + blur () { + this.$refs.input.blur() + }, getButtonOrIcon () { const { prefixCls, size } = this const enterButton = getComponentFromProp(this, 'enterButton') @@ -45,7 +52,7 @@ export default { }, }) } else if (enterButtonAsElement.tag === 'button') { - return cloneElement(enterButtonAsElement[0], { + return cloneElement(enterButtonAsElement, { on: { click: this.onSearch, }, @@ -93,14 +100,7 @@ export default { {...inputProps} class={inputClassName} ref='input' - > - {/* */} - + /> ) }, } diff --git a/components/input/__tests__/Search.test.js b/components/input/__tests__/Search.test.js new file mode 100644 index 000000000..b55809067 --- /dev/null +++ b/components/input/__tests__/Search.test.js @@ -0,0 +1,31 @@ +import { mount } from '@vue/test-utils' +import { asyncExpect } from '@/tests/utils' +import Search from '../Search' +import Button from '../../button' +import focusTest from '../../../tests/shared/focusTest' + +describe('Input.Search', () => { + focusTest(Search) + + it('should support custom button', async () => { + const wrapper = mount({ + render () { + return ok} /> + }, + }, { sync: false }) + await asyncExpect(() => { + expect(wrapper.html()).toMatchSnapshot() + }) + }) + + it('should support custom Button', async () => { + const wrapper = mount({ + render () { + return ok} /> + }, + }, { sync: false }) + await asyncExpect(() => { + expect(wrapper.html()).toMatchSnapshot() + }) + }) +}) diff --git a/components/input/__tests__/__snapshots__/Search.test.js.snap b/components/input/__tests__/__snapshots__/Search.test.js.snap new file mode 100644 index 000000000..d3ab8cd48 --- /dev/null +++ b/components/input/__tests__/__snapshots__/Search.test.js.snap @@ -0,0 +1,9 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Input.Search should support custom Button 1`] = ` + + + +`; + +exports[`Input.Search should support custom button 1`] = ``;