From 94d783a31c0f44e7cf68929fdedc37e317c38c47 Mon Sep 17 00:00:00 2001 From: wuxh Date: Mon, 27 Feb 2023 16:09:53 +0800 Subject: [PATCH 1/8] test: add case --- tests/__snapshots__/picker.spec.tsx.snap | 267 +++++++++++++++++++++++ tests/picker.spec.tsx | 12 + 2 files changed, 279 insertions(+) diff --git a/tests/__snapshots__/picker.spec.tsx.snap b/tests/__snapshots__/picker.spec.tsx.snap index 11780579a..715816126 100644 --- a/tests/__snapshots__/picker.spec.tsx.snap +++ b/tests/__snapshots__/picker.spec.tsx.snap @@ -103,3 +103,270 @@ exports[`Picker.Basic should render correctly in rtl 1`] = ` `; + +exports[`Picker.Basic time step should show integer when step is not integer (hour) 1`] = ` + +`; + +exports[`Picker.Basic time step should show integer when step is not integer (minute) 1`] = ` + +`; + +exports[`Picker.Basic time step should show integer when step is not integer (second) 1`] = ` + +`; diff --git a/tests/picker.spec.tsx b/tests/picker.spec.tsx index c41044171..82fe7bad3 100644 --- a/tests/picker.spec.tsx +++ b/tests/picker.spec.tsx @@ -616,6 +616,18 @@ describe('Picker.Basic', () => { ); spy.mockRestore(); }); + + // https://github.com/ant-design/ant-design/issues/40914 + ;['hour', 'minute', 'second'].forEach((unit, index) => { + it(`should show integer when step is not integer (${unit})`, () => { + const props = { + [`${unit}Step`]: 5.5, + } + const { container } = render(); + openPicker(container); + expect(document.querySelectorAll('.rc-picker-time-panel-column')[index]).toMatchSnapshot(); + }); + }); }); it('pass data- & aria- & role', () => { From 54e1609917c5c46d757df94f7018665214ea65fe Mon Sep 17 00:00:00 2001 From: wuxh Date: Mon, 27 Feb 2023 16:29:47 +0800 Subject: [PATCH 2/8] chore: optimize time selector panel step precision logic --- src/panels/TimePanel/TimeBody.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/panels/TimePanel/TimeBody.tsx b/src/panels/TimePanel/TimeBody.tsx index 186182a4e..e5062146f 100644 --- a/src/panels/TimePanel/TimeBody.tsx +++ b/src/panels/TimePanel/TimeBody.tsx @@ -24,7 +24,8 @@ function generateUnits( disabledUnits: number[] | undefined, ) { const units: Unit[] = []; - for (let i = start; i <= end; i += step) { + const integerStep = Math.floor(step); + for (let i = start; i <= end; i += integerStep) { units.push({ label: leftPad(i, 2), value: i, From 5f473325f0f650274a2e94bffaa0b836c4338e4c Mon Sep 17 00:00:00 2001 From: wuxh Date: Mon, 27 Feb 2023 16:31:54 +0800 Subject: [PATCH 3/8] test: update snapshot --- tests/__snapshots__/picker.spec.tsx.snap | 62 +++++++++++++++--------- 1 file changed, 40 insertions(+), 22 deletions(-) diff --git a/tests/__snapshots__/picker.spec.tsx.snap b/tests/__snapshots__/picker.spec.tsx.snap index 715816126..81d64bd6d 100644 --- a/tests/__snapshots__/picker.spec.tsx.snap +++ b/tests/__snapshots__/picker.spec.tsx.snap @@ -124,7 +124,7 @@ exports[`Picker.Basic time step should show integer when step is not integer (ho
- 5.5 + 05
  • - 11 + 10
  • - 16.5 + 15
  • - 22 + 20
    • @@ -177,7 +177,7 @@ exports[`Picker.Basic time step should show integer when step is not integer (mi
    - 5.5 + 05
  • - 11 + 10
  • - 16.5 + 15
  • - 22 + 20
  • - 27.5 + 25
  • - 33 + 30
  • - 38.5 + 35
  • - 44 + 40
  • - 49.5 + 45 + +
    • +
  • +
    + 50
  • - 5.5 + 05 + +
    • +
  • +
    + 10
  • - 11 + 15
  • - 16.5 + 20
  • - 22 + 25
  • - 27.5 + 30
  • - 33 + 35
  • - 38.5 + 40
  • - 44 + 45
  • - 49.5 + 50
  • Date: Mon, 27 Feb 2023 17:28:26 +0800 Subject: [PATCH 4/8] feat(type): update TS type --- src/interface.ts | 7 +++++++ src/panels/TimePanel/index.tsx | 8 ++++---- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/interface.ts b/src/interface.ts index 537ca4968..9f6f682e7 100644 --- a/src/interface.ts +++ b/src/interface.ts @@ -112,3 +112,10 @@ export interface PresetDate { label: React.ReactNode; value: T; } + +// https://stackoverflow.com/a/39495173; need TypeScript >= 4.5 +type Enumerate = Acc['length'] extends N + ? Acc[number] + : Enumerate + +export type IntRange = Exclude, Enumerate> diff --git a/src/panels/TimePanel/index.tsx b/src/panels/TimePanel/index.tsx index 8025a3a14..a402523ef 100644 --- a/src/panels/TimePanel/index.tsx +++ b/src/panels/TimePanel/index.tsx @@ -3,7 +3,7 @@ import classNames from 'classnames'; import TimeHeader from './TimeHeader'; import type { BodyOperationRef } from './TimeBody'; import TimeBody from './TimeBody'; -import type { PanelSharedProps, DisabledTimes } from '../../interface'; +import type { PanelSharedProps, DisabledTimes, IntRange } from '../../interface'; import { createKeyDownHandler } from '../../utils/uiUtil'; export type SharedTimeProps = { @@ -13,9 +13,9 @@ export type SharedTimeProps = { showMinute?: boolean; showSecond?: boolean; use12Hours?: boolean; - hourStep?: number; - minuteStep?: number; - secondStep?: number; + hourStep?: IntRange<1, 23>; + minuteStep?: IntRange<1, 59>; + secondStep?: IntRange<1, 59>; hideDisabledOptions?: boolean; defaultValue?: DateType; From b4aa280f089591ab5396811b3c9a1858d825ce89 Mon Sep 17 00:00:00 2001 From: wuxh Date: Mon, 27 Feb 2023 17:38:31 +0800 Subject: [PATCH 5/8] test: add case --- tests/picker.spec.tsx | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/tests/picker.spec.tsx b/tests/picker.spec.tsx index 82fe7bad3..733f27906 100644 --- a/tests/picker.spec.tsx +++ b/tests/picker.spec.tsx @@ -628,6 +628,13 @@ describe('Picker.Basic', () => { expect(document.querySelectorAll('.rc-picker-time-panel-column')[index]).toMatchSnapshot(); }); }); + + it('should work when hourStep < 0', () => { + // @ts-ignore + const { container } = render(); + openPicker(container); + expect(document.querySelectorAll('.rc-picker-time-panel-column')[0].children.length).toBe(24); + }); }); it('pass data- & aria- & role', () => { From 515430790338b8b07c8bb24698d1074710721d05 Mon Sep 17 00:00:00 2001 From: wuxh Date: Mon, 27 Feb 2023 17:46:15 +0800 Subject: [PATCH 6/8] fix: fix negative number error --- src/panels/TimePanel/TimeBody.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/panels/TimePanel/TimeBody.tsx b/src/panels/TimePanel/TimeBody.tsx index e5062146f..5fd4db3ee 100644 --- a/src/panels/TimePanel/TimeBody.tsx +++ b/src/panels/TimePanel/TimeBody.tsx @@ -24,7 +24,7 @@ function generateUnits( disabledUnits: number[] | undefined, ) { const units: Unit[] = []; - const integerStep = Math.floor(step); + const integerStep = Math.max(1, Math.floor(step)); for (let i = start; i <= end; i += integerStep) { units.push({ label: leftPad(i, 2), From 4fe87d2b8231fdc98685c056d6e34051b836d955 Mon Sep 17 00:00:00 2001 From: wuxh Date: Mon, 27 Feb 2023 17:57:49 +0800 Subject: [PATCH 7/8] perf: update performance --- src/panels/TimePanel/TimeBody.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/panels/TimePanel/TimeBody.tsx b/src/panels/TimePanel/TimeBody.tsx index 5fd4db3ee..533415a77 100644 --- a/src/panels/TimePanel/TimeBody.tsx +++ b/src/panels/TimePanel/TimeBody.tsx @@ -24,7 +24,7 @@ function generateUnits( disabledUnits: number[] | undefined, ) { const units: Unit[] = []; - const integerStep = Math.max(1, Math.floor(step)); + const integerStep = step >= 1 ? step | 0 : 1 for (let i = start; i <= end; i += integerStep) { units.push({ label: leftPad(i, 2), From 68d4cfc82b462c13d7c15fca265af8e981c3a55d Mon Sep 17 00:00:00 2001 From: Wuxh Date: Mon, 27 Feb 2023 18:02:18 +0800 Subject: [PATCH 8/8] Update tests/picker.spec.tsx Co-authored-by: MadCcc <1075746765@qq.com> --- tests/picker.spec.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/picker.spec.tsx b/tests/picker.spec.tsx index 733f27906..d870aabef 100644 --- a/tests/picker.spec.tsx +++ b/tests/picker.spec.tsx @@ -618,7 +618,7 @@ describe('Picker.Basic', () => { }); // https://github.com/ant-design/ant-design/issues/40914 - ;['hour', 'minute', 'second'].forEach((unit, index) => { + ['hour', 'minute', 'second'].forEach((unit, index) => { it(`should show integer when step is not integer (${unit})`, () => { const props = { [`${unit}Step`]: 5.5,