feat(Stepper): add long-press prop

src/stepper/README.md

@@ -116,6 +116,7 @@ export default {
 | button-size `v2.0.5` | Button size | *string \| number* | `28px` |
 | show-plus `v2.1.2` | Whether to show plus button | *boolean* | `true` |
 | show-minus `v2.1.2` | Whether to show minus button | *boolean* | `true` |
+| long-press `v2.4.3` | Whether to allow long press | *boolean* | `true` |
 | decimal-length `v2.2.1` | Decimal length | *number* | - |
 
 ### Events

src/stepper/README.zh-CN.md

@@ -138,6 +138,7 @@ export default {
 | button-size `v2.0.5` | 按钮大小以及输入框高度，默认单位为`px` | *string \| number* | `28px` |
 | show-plus `v2.1.2` | 是否显示增加按钮 | *boolean* | `true` |
 | show-minus `v2.1.2` | 是否显示减少按钮 | *boolean* | `true` |
+| long-press `v2.4.3` | 是否开启长按手势 | *boolean* | `true` |
 | decimal-length `v2.2.1` | 固定显示的小数位数 | *number* | - |
 
 ### Events

src/stepper/index.js

@@ -56,6 +56,10 @@ export default createComponent({
     showMinus: {
       type: Boolean,
       default: true
+    },
+    longPress: {
+      type: Boolean,
+      default: true
     }
   },
 
@@ -222,12 +226,16 @@ export default createComponent({
 
     longPressStep() {
       this.longPressTimer = setTimeout(() => {
-        this.onChange(this.type);
+        this.onChange();
         this.longPressStep(this.type);
       }, LONG_PRESS_INTERVAL);
     },
 
     onTouchStart() {
+      if (!this.longPress) {
+        return;
+      }
+
       clearTimeout(this.longPressTimer);
       this.isLongPress = false;
 
@@ -239,6 +247,10 @@ export default createComponent({
     },
 
     onTouchEnd(event) {
+      if (!this.longPress) {
+        return;
+      }
+
       clearTimeout(this.longPressTimer);
 
       if (this.isLongPress) {
@@ -256,7 +268,7 @@ export default createComponent({
         },
         touchstart: () => {
           this.type = type;
-          this.onTouchStart(type);
+          this.onTouchStart();
         },
         touchend: this.onTouchEnd,
         touchcancel: this.onTouchEnd

src/stepper/test/__snapshots__/index.spec.js.snap

@@ -1,5 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`button-size prop 1`] = `<div class="van-stepper"><button type="button" class="van-stepper__minus van-stepper__minus--disabled" style="width: 2rem; height: 2rem;"></button><input type="number" role="spinbutton" aria-valuemax="Infinity" aria-valuemin="1" aria-valuenow="1" class="van-stepper__input" style="height: 2rem;"><button type="button" class="van-stepper__plus" style="width: 2rem; height: 2rem;"></button></div>`;
+
 exports[`disable stepper input 1`] = `<div class="van-stepper"><button type="button" class="van-stepper__minus van-stepper__minus--disabled"></button><input type="number" role="spinbutton" aria-valuemax="Infinity" aria-valuemin="1" aria-valuenow="1" disabled="disabled" class="van-stepper__input"><button type="button" class="van-stepper__plus"></button></div>`;
 
 exports[`disabled stepper 1`] = `<div class="van-stepper"><button type="button" class="van-stepper__minus van-stepper__minus--disabled"></button><input type="number" role="spinbutton" aria-valuemax="Infinity" aria-valuemin="1" aria-valuenow="1" disabled="disabled" class="van-stepper__input"><button type="button" class="van-stepper__plus van-stepper__plus--disabled"></button></div>`;

src/stepper/test/index.spec.js

@@ -89,6 +89,22 @@ test('long press', async () => {
   expect(wrapper.emitted('input')).toEqual([[2], [3], [4]]);
 });
 
+test('disable long press', async () => {
+  const wrapper = mount(Stepper, {
+    propsData: {
+      value: 1,
+      longPress: false
+    }
+  });
+
+  const plus = wrapper.find('.van-stepper__plus');
+  plus.trigger('touchstart');
+  await later(800);
+  plus.trigger('touchend');
+
+  expect(wrapper.emitted('input')).toBeFalsy();
+});
+
 test('filter value during user input', () => {
   const wrapper = mount(Stepper, {
     propsData: {
@@ -178,6 +194,15 @@ test('input-width prop', () => {
   expect(wrapper).toMatchSnapshot();
 });
 
+test('button-size prop', () => {
+  const wrapper = mount(Stepper, {
+    propsData: {
+      buttonSize: '2rem'
+    }
+  });
+  expect(wrapper).toMatchSnapshot();
+});
+
 test('async-change prop', () => {
   const wrapper = mount(Stepper, {
     propsData: {