Browse Source

Merge branch 'next' of https://github.com/Mindyzone/nutui into next

zongyue3 4 years ago
parent
commit
f411c664a3

+ 124 - 0
src/packages/__VUE/input/__tests__/input.spec.ts

@@ -0,0 +1,124 @@
+import { mount } from '@vue/test-utils';
+import Input from '../index.vue';
+
+test('base', () => {
+  const wrapper = mount(Input, { props: { modelValue: 3 } });
+  const input = wrapper.find('input');
+  expect(input.exists()).toBe(true);
+  expect(input.element.value).toBe('3');
+});
+test('should emit focuse event when input is focus', () => {
+  const wrapper = mount(Input);
+  wrapper.find('input').trigger('focus');
+  expect(wrapper.emitted('focus')).toBeTruthy();
+});
+test('should emit blur event when input is blur', () => {
+  const wrapper = mount(Input);
+  wrapper.find('input').trigger('blur');
+  expect(wrapper.emitted('blur')).toBeTruthy();
+});
+test('should emit blur event when input is blur', () => {
+  const wrapper = mount(Input);
+  wrapper.find('input').trigger('input');
+  expect(wrapper.emitted('change')).toBeTruthy();
+});
+test('should clear  when event clear', () => {
+  const wrapper = mount(Input, { props: { modelValue: 3 } });
+  const input = wrapper.find('input');
+  const clear = wrapper.find('.nut-textinput-clear');
+  wrapper.find('input').trigger('input');
+  clear.trigger('click');
+  expect(clear.exists()).toBe(true);
+  setTimeout(() => {
+    expect(input.element.value).toBe('');
+  });
+});
+// //测试只能是数字
+test('should format input value when type is number', () => {
+  const wrapper = mount(Input, {
+    props: {
+      type: 'number',
+      modelValue: ''
+    }
+  });
+  const input = wrapper.find('input');
+  input.element.value = '1';
+  input.trigger('input');
+  expect((wrapper.emitted('change') as any)[0][0]).toEqual('1');
+
+  input.element.value = '1.2';
+  input.trigger('input');
+  expect((wrapper.emitted('change') as any)[1][0]).toEqual('12');
+});
+test('should format input value when type is number', () => {
+  const wrapper = mount(Input, {
+    props: {
+      type: 'number',
+      modelValue: '123abc'
+    }
+  });
+  const input = wrapper.find('input');
+  input.trigger('blur');
+  expect((wrapper.emitted('blur') as any)[0][0]).toEqual('');
+});
+// //测试小数
+test('should format input value when type is digit', () => {
+  const wrapper = mount(Input, {
+    props: {
+      type: 'digit',
+      modelValue: ''
+    }
+  });
+  const input = wrapper.find('input');
+  input.element.value = '1';
+  input.trigger('input');
+  expect((wrapper.emitted('change') as any)[0][0]).toEqual('1');
+
+  input.element.value = '1.2';
+  input.trigger('input');
+  expect((wrapper.emitted('change') as any)[1][0]).toEqual('1.2');
+});
+
+test('should limit maxlength of input value when using maxlength prop', async () => {
+  const wrapper = mount(Input, {
+    props: {
+      maxLength: 3,
+      modelValue: '1234'
+    }
+  });
+
+  const input = wrapper.find('input');
+  input.trigger('input');
+  expect((wrapper.emitted('change') as any)[0][0]).toEqual('123');
+  input.element.value = '1234';
+  input.trigger('input');
+  expect((wrapper.emitted('change') as any)[0][0]).toEqual('123');
+});
+test('should label', () => {
+  const wrapper = mount(Input, {
+    props: {
+      label: '文本'
+    }
+  });
+  const label = wrapper.find('.label-string');
+
+  expect(label.text()).toBe('文本');
+});
+test('should disabled', () => {
+  const wrapper = mount(Input, {
+    props: {
+      disabled: true
+    }
+  });
+  const input = wrapper.find('input');
+  expect(input.attributes('disabled')).toBe('');
+});
+test('should readonly', () => {
+  const wrapper = mount(Input, {
+    props: {
+      readonly: true
+    }
+  });
+  const input = wrapper.find('input');
+  expect(input.attributes('readonly')).toBe('');
+});

+ 6 - 3
src/packages/__VUE/input/index.vue

@@ -104,15 +104,15 @@ export default create({
       const input = event.target as HTMLInputElement;
       const input = event.target as HTMLInputElement;
       let val = input.value;
       let val = input.value;
 
 
-      if (props.maxLength && val.length > Number(props.maxLength)) {
-        val = val.slice(0, Number(props.maxLength));
-      }
       if (props.type === 'digit') {
       if (props.type === 'digit') {
         val = formatNumber(val, true);
         val = formatNumber(val, true);
       }
       }
       if (props.type === 'number') {
       if (props.type === 'number') {
         val = formatNumber(val, false);
         val = formatNumber(val, false);
       }
       }
+      if (props.maxLength && val.length > Number(props.maxLength)) {
+        val = val.slice(0, Number(props.maxLength));
+      }
       emit('change', val, event);
       emit('change', val, event);
       emit('update:modelValue', val, event);
       emit('update:modelValue', val, event);
     };
     };
@@ -131,6 +131,9 @@ export default create({
 
 
       const input = event.target as HTMLInputElement;
       const input = event.target as HTMLInputElement;
       let value = input.value;
       let value = input.value;
+      if (props.maxLength && value.length > Number(props.maxLength)) {
+        value = value.slice(0, Number(props.maxLength));
+      }
       emit('blur', value, event);
       emit('blur', value, event);
     };
     };
 
 

+ 3 - 0
src/packages/__VUE/picker/doc.md

@@ -166,6 +166,9 @@ export default createDemo({
 | title        | 设置标题                         | String | -                |
 | title        | 设置标题                         | String | -                |
 | list-data         | 列表数据 | Array | -                |
 | list-data         | 列表数据 | Array | -                |
 | default-value-index         | 初始选中项的索引,默认为 0 | number | 0                |
 | default-value-index         | 初始选中项的索引,默认为 0 | number | 0                |
+| teleport               | 指定挂载节点                          | String  | "body"   |
+| close-on-click-overlay | 点击蒙层是否关闭对话框                | Boolean | false    |
+| lock-scroll            | 背景是否锁定                          | Boolean | false    |
    
    
 ### Events
 ### Events
     
     

+ 5 - 5
src/packages/__VUE/picker/index.vue

@@ -4,6 +4,9 @@
       position="bottom"
       position="bottom"
       :style="{ height: height + 56 + 'px' }"
       :style="{ height: height + 56 + 'px' }"
       v-model:visible="show"
       v-model:visible="show"
+      :teleport="teleport"
+      :lock-scroll="lockScroll"
+      :close-on-click-overlay="closeOnClickOverlay"
       @close="close"
       @close="close"
     >
     >
       <view class="nut-picker__bar">
       <view class="nut-picker__bar">
@@ -47,7 +50,7 @@
 import { reactive, watch, computed, toRaw, toRefs } from 'vue';
 import { reactive, watch, computed, toRaw, toRefs } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { createComponent } from '@/packages/utils/create';
 import column from './Column.vue';
 import column from './Column.vue';
-import popup from '@/packages/__VUE/popup/index.vue';
+import popup, { popupProps } from '@/packages/__VUE/popup/index.vue';
 import { commonProps } from './commonProps';
 import { commonProps } from './commonProps';
 import {
 import {
   PickerObjOpt,
   PickerObjOpt,
@@ -63,10 +66,7 @@ export default create({
     [popup.name]: popup
     [popup.name]: popup
   },
   },
   props: {
   props: {
-    visible: {
-      type: Boolean,
-      default: false
-    },
+    ...popupProps,
     title: {
     title: {
       type: String,
       type: String,
       default: ''
       default: ''

+ 1 - 1
src/packages/__VUE/popup/doc.md

@@ -97,7 +97,7 @@ app.use(Popup);
 | duration               | 动画时长,单位秒                                            | String、Number | `0.3`         |
 | duration               | 动画时长,单位秒                                            | String、Number | `0.3`         |
 | overlay-class          | 自定义遮罩类名                                              | String         | -             |
 | overlay-class          | 自定义遮罩类名                                              | String         | -             |
 | overlay-style          | 自定义遮罩样式                                              | CSSProperties  | -             |
 | overlay-style          | 自定义遮罩样式                                              | CSSProperties  | -             |
-| lock-scroll            | 背景是否锁定                                                | Boolean        | `false`       |
+| lock-scroll            | 背景是否锁定                                                | Boolean        | `true`       |
 | overlay                | 是否显示遮罩                                                | Boolean        | `true`        |
 | overlay                | 是否显示遮罩                                                | Boolean        | `true`        |
 | close-on-click-overlay | 是否点击遮罩关闭                                            | Boolean        | `true`        |
 | close-on-click-overlay | 是否点击遮罩关闭                                            | Boolean        | `true`        |
 | position               | 弹出位置(top,bottom,left,right,center)                    | String         | `"center"`    |
 | position               | 弹出位置(top,bottom,left,right,center)                    | String         | `"center"`    |

+ 10 - 0
src/packages/__VUE/textarea/__tests__/textarea.spec.ts

@@ -0,0 +1,10 @@
+import { mount } from '@vue/test-utils';
+
+import Textarea from '../index.vue';
+
+test('Textarea base', () => {
+  const wrapper = mount(Textarea);
+  // const input = wrapper.find('input');
+  // expect(input.exists()).toBe(true);
+  // expect(input.element.value).toBe("3");
+});