fix: adapt the scrollbar in firefox and ie, and update test case

cypress/integration/timePicker.spec.js

@@ -31,12 +31,12 @@ describe('timePicker', () => {
 
     it('clear', () => {
         cy.visit('http://127.0.0.1:6006/iframe.html?id=timepicker--range-picker&args=&viewMode=story');
-        cy.get('.semi-input').eq(0).click();
+        cy.get('.semi-input').eq(1).click();
         cy.wait(500);
 
-        cy.get('.semi-input').eq(0).trigger('mouseover');
+        cy.get('.semi-input').eq(1).trigger('mouseover');
         cy.get('.semi-input-clearbtn').click();
-        cy.get('.semi-input').eq(0).should('have.value', '');
+        cy.get('.semi-input').eq(1).should('have.value', '');
     });
 
     it('custom trigger', () => {
@@ -44,13 +44,13 @@ describe('timePicker', () => {
         cy.get('.semi-button-content').click();
         cy.wait(500);
 
-        cy.get('.semi-timepicker-panel-list-hour .semi-scrolllist-list-outer').scrollTo('top');
-        cy.get('#root').trigger('mousedown','right');
+        cy.get('.semi-timepicker-panel-list-hour').scrollTo('top');
+        cy.get('#root').trigger('mousedown', 'right');
     });
 
     it('blur', () => {
         cy.visit('http://127.0.0.1:6006/iframe.html?id=timepicker--time-picker-panel-default&args=&viewMode=story');
-        cy.get('.semi-input-default').eq(1).click();
+        cy.get('.semi-input-default').eq(1).click(); 
         cy.get('body').click('right');
         cy.get('.semi-input-default').eq(1).should('have.value', '10:24:18');
 

packages/semi-foundation/datePicker/datePicker.scss

@@ -10,10 +10,14 @@ $module-list: #{$prefix}-scrolllist;
     vertical-align: top;
 
     .#{$module-list}-body {
-
         .#{$module-list}-item {
+            -ms-overflow-style: none; /* Internet Explorer 10+ */
+            scrollbar-width: none; /* Firefox */
+
             &::-webkit-scrollbar {
                 display: none;
+                width: 0;
+                height: 0;
             }
         }
     }

packages/semi-foundation/timePicker/timePicker.scss

@@ -24,9 +24,15 @@ $module-list: #{$prefix}-scrolllist;
                     padding-bottom: ($height-timePicker_panel_body - $height-scrollList_item) * 0.5;
                 }
             }
+
             .#{$module-list}-item {
+                -ms-overflow-style: none; /* Internet Explorer 10+ */
+                scrollbar-width: none; /* Firefox */
+                
                 &::-webkit-scrollbar {
                     display: none;
+                    width: 0;
+                    height: 0;
                 }
             }
 

packages/semi-ui/timePicker/__test__/timePicker.test.js

@@ -33,7 +33,7 @@ describe(`TimePicker`, () => {
                 locale={Locale.TimePicker}
                 localeCode={Locale.code}
                 defaultOpen={true}
-                scrollItemProps={{ cycled: false }}
+                scrollItemProps={{ mode: 'wheel', cycled: false }}
                 format={'HH:mm:ss'}
                 defaultValue={`${defaultHour}:${defaultMinute}:${defaultSeconds}`}
                 panelFooter={<strong>Select Time</strong>}
@@ -303,7 +303,7 @@ describe(`TimePicker`, () => {
             autofocus: true,
             locale: Locale.TimePicker,
             localeCode: Locale.code,
-            scrollItemProps: { cycled: false }
+            scrollItemProps: { mode: 'wheel', cycled: false }
         };
         const elem = mount(<TimePicker {...props} />);
         // click minute