Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(input-number): 支持透传属性至 input 元素 #3008

Merged
merged 2 commits into from
Apr 7, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,9 @@
import { Left, Right } from '@nutui/icons-vue'

test('InputNumber: should render modelValue', () => {
const wrapper = mount(InputNumber, {
props: {
modelValue: 12
}
const wrapper = mount(() => {
return <InputNumber modelValue={12} />
})

const input = wrapper.find('input').element as HTMLInputElement
expect(input.value).toBe('12')
})
Expand All @@ -30,8 +27,8 @@
expect((wrapper.emitted('change')![0] as any[])[0]).toEqual('3')
expect((wrapper.emitted('update:modelValue')![0] as any[])[0]).toEqual('3')
})

Check warning on line 30 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L30

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
test('InputNumber: should minis step 2 when trigger click left button', async () => {

Check warning on line 31 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L31

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
const wrapper = mount(InputNumber, {
props: {
modelValue: 3,
Expand All @@ -47,8 +44,8 @@
expect((wrapper.emitted('change')![0] as any[])[0]).toEqual('1')
expect((wrapper.emitted('update:modelValue')![0] as any[])[0]).toEqual('1')
})

Check warning on line 47 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L47

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
test('InputNumber: should render max and min props', async () => {

Check warning on line 48 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L48

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
const wrapper = mount(InputNumber, {
props: {
modelValue: 100,
Expand Down Expand Up @@ -86,11 +83,11 @@
expect((wrapper.emitted('update:modelValue')![0] as any[])[0]).toEqual('1')

const iconMinus = wrapper.find('.nut-input-number__left')
await iconMinus.trigger('click')

Check warning on line 86 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L86

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
expect((wrapper.emitted('update:modelValue')![0] as any[])[0]).toEqual('1')
})

test('InputNumber: should not focus input when readonly props to be true', async () => {

Check warning on line 90 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L90

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
const wrapper = mount(InputNumber, {
props: {
readonly: true,
Expand All @@ -105,7 +102,7 @@
expect((wrapper.emitted('update:modelValue')![0] as any[])[0]).toEqual('1')

expect(wrapper.emitted('focus')).toBeFalsy()
})

Check warning on line 105 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L105

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)

test('InputNumber: should render decimal when step props to be 0.2', async () => {
const wrapper = mount(InputNumber, {
Expand All @@ -122,7 +119,7 @@
expect((wrapper.emitted('change')![0] as any[])[0]).toEqual('2.2')
})

test('InputNumber: should render size when buttonSize and inputWidth props setted', async () => {

Check warning on line 122 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L122

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
const wrapper = mount(InputNumber, {
props: {
buttonSize: '30px',
Expand Down Expand Up @@ -153,7 +150,7 @@
expect((wrapper.emitted('update:modelValue')![0] as any[])[0]).toEqual('100')
})

test('InputNumber: should render icon when leftIcon and rightIcon slots setted', async () => {

Check warning on line 153 in src/packages/__VUE/inputnumber/__tests__/index.spec.tsx

View check run for this annotation

codefactor.io / CodeFactor

src/packages/__VUE/inputnumber/__tests__/index.spec.tsx#L153

Unexpected any. Specify a different type. (@typescript-eslint/no-explicit-any)
const wrapper = mount(InputNumber, {
slots: {
leftIcon: h(Left, {
Expand Down Expand Up @@ -189,3 +186,15 @@
expect(wrapper.emitted()['update:modelValue']).toHaveLength(1)
expect(wrapper.emitted()['update:modelValue'][0]).toStrictEqual(['7', {}])
})

test('InputNumber: v-bind="$attrs"', async () => {
const testClass = 'test-attr-class'
const customAttr = 'custom-attr'
const wrapper = mount(() => {
return <InputNumber modelValue={12} class={testClass} custom-attr={customAttr} />
})

const input = wrapper.find('input').element as HTMLInputElement
expect(input.getAttribute('class')).includes(testClass)
expect(input.getAttribute(customAttr)).includes(customAttr)
})
4 changes: 4 additions & 0 deletions src/packages/__VUE/inputnumber/doc.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,10 @@ Set step size `step` 0.1 `decimal places` keep 1 decimal place
| disabled | Disable all features | boolean | `false` |
| readonly | Read only status disables input box operation behavior | boolean | `false` |

### Attrs version

The attributes on `InputNumber` will be inherited by `input` element.

### Slots

| Name | Description |
Expand Down
4 changes: 4 additions & 0 deletions src/packages/__VUE/inputnumber/doc.md
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,10 @@ app.use(InputNumber)
| disabled | 禁用所有功能 | boolean | `false` |
| readonly | 只读状态禁用输入框操作行为 | boolean | `false` |

### Attrs version

支持透传属性至组件内部的 input 元素。

### Slots

| 名称 | 说明 |
Expand Down
4 changes: 4 additions & 0 deletions src/packages/__VUE/inputnumber/doc.taro.md
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,10 @@ app.use(InputNumber)
| disabled | 禁用所有功能 | boolean | `false` |
| readonly | 只读状态禁用输入框操作行为 | boolean | `false` |

### Attrs version

支持透传属性至组件内部的 input 元素。

### Slots

| 名称 | 说明 |
Expand Down
4 changes: 3 additions & 1 deletion src/packages/__VUE/inputnumber/input-number.taro.vue
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
v-else
class="nut-input-number__text--input"
type="number"
v-bind="$attrs"
:min="min"
:max="max"
:style="{ width: pxCheck(inputWidth), height: pxCheck(buttonSize) }"
Expand Down Expand Up @@ -44,7 +45,8 @@ import { Minus, Plus } from '@nutui/icons-vue-taro'
import { useFormDisabled } from '../form/common'

defineOptions({
name: 'NutInputNumber'
name: 'NutInputNumber',
inheritAttrs: false
})

export type InputNumberProps = Partial<{
Expand Down
4 changes: 3 additions & 1 deletion src/packages/__VUE/inputnumber/input-number.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
</view>
<input
type="number"
v-bind="$attrs"
:min="min"
:max="max"
:style="{ width: pxCheck(inputWidth), height: pxCheck(buttonSize) }"
Expand Down Expand Up @@ -39,7 +40,8 @@ import { Minus, Plus } from '@nutui/icons-vue'
import { useFormDisabled } from '../form/common'

defineOptions({
name: 'NutInputNumber'
name: 'NutInputNumber',
inheritAttrs: false
})

export type InputNumberProps = Partial<{
Expand Down