test(date-time-picker): boost coverage (#806)

* test(date-time-picker): cover Picker props (209–214) and boost coverage 95%+

Add MockPicker spec to hit header/footer/onConfirm/onCancel props wiring
Add rerender path to cover “no header/footer and no handlers” falsy branches
Add className/style specs to hit template literal trim branches
Improve filter/renderLabel/array time-mode branch coverage
Fix test stability by using rerender from render result
Affected

src/date-time-picker/tests/date-time-picker.test.tsx
src/date-time-picker/DateTimePicker.tsx

* fix: fix lint

* fix: fix type error

* test: update snapshots

---------

Co-authored-by: anlyyao <[email protected]>

Author: haozang54-source

site/test-coverage.js

@@ -13,7 +13,7 @@ module.exports = {
   common: { statements: '82.75%', branches: '66.66%', functions: '83.33%', lines: '92%' },
   configProvider: { statements: '54.54%', branches: '0%', functions: '0%', lines: '54.54%' },
   countDown: { statements: '100%', branches: '90%', functions: '100%', lines: '100%' },
-  dateTimePicker: { statements: '5.67%', branches: '0%', functions: '0%', lines: '6.06%' },
+  dateTimePicker: { statements: '95.74%', branches: '90.75%', functions: '94.44%', lines: '95.45%' },
   dialog: { statements: '4.3%', branches: '0%', functions: '0%', lines: '4.49%' },
   divider: { statements: '100%', branches: '100%', functions: '100%', lines: '100%' },
   drawer: { statements: '98.63%', branches: '100%', functions: '96.42%', lines: '100%' },
@@ -24,7 +24,7 @@ module.exports = {
   form: { statements: '2.8%', branches: '0%', functions: '0%', lines: '2.96%' },
   grid: { statements: '100%', branches: '100%', functions: '100%', lines: '100%' },
   guide: { statements: '3.46%', branches: '0%', functions: '0%', lines: '3.77%' },
-  hooks: { statements: '70.7%', branches: '44.7%', functions: '73.68%', lines: '70.66%' },
+  hooks: { statements: '70.7%', branches: '45.88%', functions: '73.68%', lines: '70.66%' },
   image: { statements: '97.72%', branches: '100%', functions: '92.3%', lines: '97.61%' },
   imageViewer: { statements: '8.33%', branches: '2.83%', functions: '0%', lines: '8.69%' },
   indexes: { statements: '95.65%', branches: '69.81%', functions: '100%', lines: '96.94%' },
@@ -38,7 +38,7 @@ module.exports = {
   navbar: { statements: '12.9%', branches: '0%', functions: '0%', lines: '13.79%' },
   noticeBar: { statements: '6.38%', branches: '0%', functions: '0%', lines: '6.52%' },
   overlay: { statements: '100%', branches: '100%', functions: '100%', lines: '100%' },
-  picker: { statements: '5.71%', branches: '0%', functions: '0%', lines: '6.28%' },
+  picker: { statements: '51.71%', branches: '29.69%', functions: '57.31%', lines: '52.51%' },
   popover: { statements: '100%', branches: '96.55%', functions: '100%', lines: '100%' },
   popup: { statements: '100%', branches: '100%', functions: '100%', lines: '100%' },
   progress: { statements: '100%', branches: '97.36%', functions: '100%', lines: '100%' },

src/date-time-picker/DateTimePicker.tsx

@@ -29,8 +29,8 @@ const DateTimePicker: FC<DateTimePickerProps> = (props) => {
 
   const [innerValue, setDateTimePickerValue] = useDefault(props.value, props.defaultValue, props.onChange);
 
-  const confirmButtonText = props.confirmBtn || t(locale.confirm);
-  const cancelButtonText = props.cancelBtn || t(locale.cancel);
+  const confirmButtonText = props.confirmBtn || (t(locale.confirm) as string);
+  const cancelButtonText = props.cancelBtn || (t(locale.cancel) as string);
 
   const start = normalize(props.start, dayjs().subtract(10, 'year'));
   const end = normalize(props.end, dayjs().add(10, 'year'));
@@ -205,22 +205,22 @@ const DateTimePicker: FC<DateTimePickerProps> = (props) => {
     props.onCancel?.({ e: context.e });
   };
 
-  const onPick = (value: Array<PickerValue>, context: PickerContext) => {
-    const { column, index } = context;
+  const onPick = (value: Array<PickerValue>, { column, index }: PickerContext) => {
     const type = meaningColumn[column];
     const val = curDate.set(type as UnitType, parseInt(columns[column][index]?.value, 10));
-
-    setCurDate(rationalize(val));
-    props.onPick?.(rationalize(val).format(props.format));
+    const next = rationalize(val);
+    setCurDate(next);
+    props.onPick?.(next.format(props.format));
   };
 
   return (
     <Picker
-      className={dateTimePickerClass}
+      className={`${dateTimePickerClass} ${props.className || ''}`.trim()}
+      style={props.style}
       value={valueOfPicker}
       title={props.title}
-      confirm-btn={confirmButtonText}
-      cancel-btn={cancelButtonText}
+      confirmBtn={confirmButtonText}
+      cancelBtn={cancelButtonText}
       columns={columns}
       onConfirm={onConfirm}
       onCancel={onCancel}