From 7473233bc95b587232afed64c3d5ef8269fb8023 Mon Sep 17 00:00:00 2001 From: tangjinzhou <415800467@qq.com> Date: Wed, 6 Jul 2022 19:10:14 +0800 Subject: [PATCH] test: update focus test --- .../generatePicker/generateRangePicker.tsx | 11 +---------- .../generatePicker/generateSinglePicker.tsx | 11 +---------- components/input-number/index.tsx | 11 +---------- components/input/Input.tsx | 5 ----- components/input/TextArea.tsx | 8 -------- components/mentions/index.tsx | 12 +----------- components/vc-checkbox/Checkbox.tsx | 11 +---------- components/vc-select/Selector/Input.tsx | 13 +------------ tests/shared/focusTest.js | 6 +++++- 9 files changed, 11 insertions(+), 77 deletions(-) diff --git a/components/date-picker/generatePicker/generateRangePicker.tsx b/components/date-picker/generatePicker/generateRangePicker.tsx index ca497f0bb..991b708a9 100644 --- a/components/date-picker/generatePicker/generateRangePicker.tsx +++ b/components/date-picker/generatePicker/generateRangePicker.tsx @@ -8,7 +8,7 @@ import enUS from '../locale/en_US'; import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver'; import { getRangePlaceholder } from '../util'; import { getTimeProps, Components } from '.'; -import { computed, defineComponent, nextTick, onMounted, ref } from 'vue'; +import { computed, defineComponent, ref } from 'vue'; import useConfigInject from '../../_util/hooks/useConfigInject'; import classNames from '../../_util/classNames'; import type { CommonProps, RangePickerProps } from './props'; @@ -56,15 +56,6 @@ export default function generateRangePicker<DateType, ExtraProps = {}>( props, ); const pickerRef = ref(); - onMounted(() => { - nextTick(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus) { - pickerRef.value?.focus(); - } - } - }); - }); expose({ focus: () => { pickerRef.value?.focus(); diff --git a/components/date-picker/generatePicker/generateSinglePicker.tsx b/components/date-picker/generatePicker/generateSinglePicker.tsx index 8bab74622..cf2cd2755 100644 --- a/components/date-picker/generatePicker/generateSinglePicker.tsx +++ b/components/date-picker/generatePicker/generateSinglePicker.tsx @@ -8,7 +8,7 @@ import enUS from '../locale/en_US'; import { getPlaceholder } from '../util'; import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver'; import { getTimeProps, Components } from '.'; -import { computed, defineComponent, nextTick, onMounted, ref } from 'vue'; +import { computed, defineComponent, ref } from 'vue'; import useConfigInject from '../../_util/hooks/useConfigInject'; import classNames from '../../_util/classNames'; import type { CommonProps, DatePickerProps } from './props'; @@ -65,15 +65,6 @@ export default function generateSinglePicker<DateType, ExtraProps = {}>( props, ); const pickerRef = ref(); - onMounted(() => { - nextTick(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus) { - pickerRef.value?.focus(); - } - } - }); - }); expose({ focus: () => { pickerRef.value?.focus(); diff --git a/components/input-number/index.tsx b/components/input-number/index.tsx index 718b62c3f..1bdcbf092 100644 --- a/components/input-number/index.tsx +++ b/components/input-number/index.tsx @@ -1,5 +1,5 @@ import type { PropType, ExtractPropTypes, HTMLAttributes, App } from 'vue'; -import { watch, defineComponent, nextTick, onMounted, ref } from 'vue'; +import { watch, defineComponent, ref } from 'vue'; import classNames from '../_util/classNames'; import UpOutlined from '@ant-design/icons-vue/UpOutlined'; import DownOutlined from '@ant-design/icons-vue/DownOutlined'; @@ -74,15 +74,6 @@ const InputNumber = defineComponent({ focused.value = true; emit('focus', e); }; - onMounted(() => { - nextTick(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus && !props.disabled) { - focus(); - } - } - }); - }); return () => { const { class: className, diff --git a/components/input/Input.tsx b/components/input/Input.tsx index 5f2d9ee8e..698d5c110 100644 --- a/components/input/Input.tsx +++ b/components/input/Input.tsx @@ -246,11 +246,6 @@ export default defineComponent({ }; onMounted(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus) { - focus(); - } - } clearPasswordValueAttribute(); }); onBeforeUnmount(() => { diff --git a/components/input/TextArea.tsx b/components/input/TextArea.tsx index a78e1bd7d..689676f0b 100644 --- a/components/input/TextArea.tsx +++ b/components/input/TextArea.tsx @@ -4,7 +4,6 @@ import { defineComponent, getCurrentInstance, nextTick, - onMounted, ref, watch, watchEffect, @@ -215,13 +214,6 @@ export default defineComponent({ ); }; - onMounted(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus) { - focus(); - } - } - }); expose({ focus, blur, diff --git a/components/mentions/index.tsx b/components/mentions/index.tsx index d4e14cfae..92860e4ea 100644 --- a/components/mentions/index.tsx +++ b/components/mentions/index.tsx @@ -1,5 +1,5 @@ import type { App, PropType, ExtractPropTypes } from 'vue'; -import { watch, ref, onMounted, defineComponent, nextTick } from 'vue'; +import { watch, ref, defineComponent } from 'vue'; import classNames from '../_util/classNames'; import PropTypes from '../_util/vue-types'; import VcMentions, { Option } from '../vc-mentions'; @@ -156,16 +156,6 @@ const Mentions = defineComponent({ expose({ focus, blur }); - onMounted(() => { - nextTick(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus) { - focus(); - } - } - }); - }); - return () => { const { disabled, diff --git a/components/vc-checkbox/Checkbox.tsx b/components/vc-checkbox/Checkbox.tsx index 0220c58c0..987a14dd1 100644 --- a/components/vc-checkbox/Checkbox.tsx +++ b/components/vc-checkbox/Checkbox.tsx @@ -1,6 +1,6 @@ // based on rc-checkbox 2.3.2 import type { HTMLAttributes } from 'vue'; -import { nextTick, defineComponent, ref, watch, onMounted } from 'vue'; +import { defineComponent, ref, watch } from 'vue'; import classNames from '../_util/classNames'; import PropTypes from '../_util/vue-types'; import { initDefaultProps } from '../_util/props-util'; @@ -37,15 +37,6 @@ export default defineComponent({ checked.value = props.checked; }, ); - onMounted(() => { - nextTick(() => { - if (process.env.NODE_ENV === 'test') { - if (props.autofocus) { - inputRef.value?.focus(); - } - } - }); - }); expose({ focus() { inputRef.value?.focus(); diff --git a/components/vc-select/Selector/Input.tsx b/components/vc-select/Selector/Input.tsx index 16bc6eacb..8d5a1eb49 100644 --- a/components/vc-select/Selector/Input.tsx +++ b/components/vc-select/Selector/Input.tsx @@ -1,6 +1,6 @@ import { cloneElement } from '../../_util/vnode'; import type { ExtractPropTypes, PropType, VNode } from 'vue'; -import { defineComponent, getCurrentInstance, inject, onMounted, withDirectives } from 'vue'; +import { defineComponent, inject, withDirectives } from 'vue'; import PropTypes from '../../_util/vue-types'; import antInput from '../../_util/antInputDirective'; import classNames from '../../_util/classNames'; @@ -48,17 +48,6 @@ const Input = defineComponent({ let blurTimeout = null; const VCSelectContainerEvent = inject('VCSelectContainerEvent') as any; - if (process.env.NODE_ENV === 'test') { - onMounted(() => { - const ins = getCurrentInstance(); - if (props.autofocus) { - if (ins.vnode && ins.vnode.el) { - ins.vnode.el.focus(); - } - } - }); - } - return () => { const { prefixCls, diff --git a/tests/shared/focusTest.js b/tests/shared/focusTest.js index 780d62bfd..b11957f66 100644 --- a/tests/shared/focusTest.js +++ b/tests/shared/focusTest.js @@ -48,7 +48,7 @@ export default function focusTest(Component) { it('autofocus', async () => { const handleFocus = jest.fn(); - mount( + const wrapper = mount( { render() { return <Component autofocus onFocus={handleFocus} />; @@ -57,6 +57,10 @@ export default function focusTest(Component) { { attachTo: container, sync: false }, ); await sleep(); + const focusEle = wrapper.findAll('[autofocus]'); + if (focusEle.length) { + focusEle[0].trigger('focus'); + } expect(handleFocus).toBeCalled(); }); });