fix_updating_progress_slider_from_mobile (#1304)

Real-Dev-Squad · Dec 26, 2024 · c43c180 · c43c180
1 parent 8d6aecd
commit c43c180
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/__tests__/Unit/Components/Tasks/ProgressSlider.test.tsx b/__tests__/Unit/Components/Tasks/ProgressSlider.test.tsx
@@ -30,6 +30,16 @@ describe('Progress Slider', () => {
         expect(sliderInput).toBeInTheDocument();
     });
 
+    test('should render range input field and handle touch events', async () => {
+        render(
+            <ProgressSlider {...DEFAULT_PROPS} value={40} isLoading={false} />
+        );
+        const sliderInput = screen.getByRole('slider');
+        fireEvent.touchEnd(sliderInput, { target: { value: 50 } });
+        expect(DEFAULT_PROPS.debounceSlider).toHaveBeenCalled();
+        expect(sliderInput).toBeInTheDocument();
+    });
+
     test('should render with dev mode styles when dev query is true', async () => {
         (useRouter as jest.Mock).mockImplementation(() => ({
             query: { dev: 'true' },

diff --git a/src/components/tasks/card/progressContainer/ProgressSlider.tsx b/src/components/tasks/card/progressContainer/ProgressSlider.tsx
@@ -18,6 +18,7 @@ const ProgressSlider: FC<ProgressSliderProps> = ({
             max="100"
             step="10"
             onChange={(e) => handleProgressChange(e)}
+            onTouchEnd={() => debounceSlider(1000)}
             onMouseUp={() => debounceSlider(1000)}
             disabled={isLoading}
             style={