From 365c7d0febeb635b0999dacb4aeeebff0ff314f7 Mon Sep 17 00:00:00 2001
From: Pareder <ruskc2beat@gmail.com>
Date: Wed, 23 Aug 2023 10:59:14 +0300
Subject: [PATCH] fix: marks calculation when boolean or number is passed

---
 src/components/ReactSlider/ReactSlider.jsx    |   4 +-
 .../ReactSlider/__tests__/ReactSlider.test.js | 126 ++++++++++++++++++
 2 files changed, 128 insertions(+), 2 deletions(-)

diff --git a/src/components/ReactSlider/ReactSlider.jsx b/src/components/ReactSlider/ReactSlider.jsx
index e4c49ea..44903e0 100644
--- a/src/components/ReactSlider/ReactSlider.jsx
+++ b/src/components/ReactSlider/ReactSlider.jsx
@@ -1102,10 +1102,10 @@ class ReactSlider extends React.Component {
         const range = this.props.max - this.props.min + 1;
 
         if (typeof marks === 'boolean') {
-            marks = Array.from({ length: range }).map((_, key) => key);
+            marks = Array.from({ length: range }).map((_, key) => key + this.props.min);
         } else if (typeof marks === 'number') {
             marks = Array.from({ length: range })
-                .map((_, key) => key)
+                .map((_, key) => key + this.props.min)
                 .filter(key => key % marks === 0);
         }
 
diff --git a/src/components/ReactSlider/__tests__/ReactSlider.test.js b/src/components/ReactSlider/__tests__/ReactSlider.test.js
index f71008c..26a11ee 100644
--- a/src/components/ReactSlider/__tests__/ReactSlider.test.js
+++ b/src/components/ReactSlider/__tests__/ReactSlider.test.js
@@ -320,4 +320,130 @@ describe('<ReactSlider>', () => {
         expect(mockRenderThumb).toHaveBeenCalledTimes(2);
         expect(mockRenderThumb.mock.calls[1][1].value).toBe(mockSecondValue);
     });
+
+    describe('marks prop', () => {
+        describe('boolean value', () => {
+            it('should not render marks if "false" is passed', () => {
+                const mockRenderMark = jest.fn();
+                renderer.create(
+                    <ReactSlider
+                        value={0}
+                        min={0}
+                        max={100}
+                        marks={false}
+                        renderMark={mockRenderMark}
+                    />
+                );
+
+                expect(mockRenderMark).not.toHaveBeenCalled();
+            });
+
+            it('should render marks if "true" is passed', () => {
+                const mockedMin = 0;
+                const mockedMax = 10;
+                const mockRenderMark = jest.fn();
+                renderer.create(
+                    <ReactSlider
+                        value={0}
+                        min={mockedMin}
+                        max={mockedMax}
+                        marks
+                        renderMark={mockRenderMark}
+                    />
+                );
+
+                expect(mockRenderMark).toHaveBeenCalledTimes(mockedMax + 1);
+                mockRenderMark.mock.calls.forEach(([call], index) => {
+                    expect(call.key).toBe(mockedMin + index);
+                });
+            });
+
+            it('should render marks if "true" is passed and "min" is not 0', () => {
+                const mockedMin = 10;
+                const mockedMax = 20;
+                const mockRenderMark = jest.fn();
+                renderer.create(
+                    <ReactSlider
+                        value={0}
+                        min={mockedMin}
+                        max={mockedMax}
+                        marks
+                        renderMark={mockRenderMark}
+                    />
+                );
+
+                expect(mockRenderMark).toHaveBeenCalledTimes(mockedMax - mockedMin + 1);
+                mockRenderMark.mock.calls.forEach(([call], index) => {
+                    expect(call.key).toBe(mockedMin + index);
+                });
+            });
+        });
+
+        describe('number value', () => {
+            it('should render correct marks', () => {
+                const mockedMin = 0;
+                const mockedMax = 10;
+                const mockedMarks = 2;
+                const mockRenderMark = jest.fn();
+                renderer.create(
+                    <ReactSlider
+                        value={0}
+                        min={mockedMin}
+                        max={mockedMax}
+                        marks={mockedMarks}
+                        renderMark={mockRenderMark}
+                    />
+                );
+
+                expect(mockRenderMark).toHaveBeenCalledTimes(6);
+                mockRenderMark.mock.calls.forEach(([call], index) => {
+                    expect(call.key).toBe(mockedMin + mockedMarks * index);
+                });
+            });
+
+            it('should render correct marks if "min" is not 0', () => {
+                const mockedMin = 10;
+                const mockedMax = 20;
+                const mockedMarks = 2;
+                const mockRenderMark = jest.fn();
+                renderer.create(
+                    <ReactSlider
+                        value={0}
+                        min={mockedMin}
+                        max={mockedMax}
+                        marks={mockedMarks}
+                        renderMark={mockRenderMark}
+                    />
+                );
+
+                expect(mockRenderMark).toHaveBeenCalledTimes(6);
+                mockRenderMark.mock.calls.forEach(([call], index) => {
+                    expect(call.key).toBe(mockedMin + mockedMarks * index);
+                });
+            });
+        });
+
+        describe('array of numbers is passed', () => {
+            it('should render correct marks', () => {
+                const mockedMin = 0;
+                const mockedMax = 10;
+                const mockedMarks = [1, 2, 3, 4, 5];
+                const mockRenderMark = jest.fn();
+                renderer.create(
+                    <ReactSlider
+                        value={0}
+                        min={mockedMin}
+                        max={mockedMax}
+                        marks={mockedMarks}
+                        renderMark={mockRenderMark}
+                    />
+                );
+
+                expect(mockRenderMark).toHaveBeenCalledTimes(mockedMarks.length);
+                mockRenderMark.mock.calls.forEach(([call], index) => {
+                    expect(call.key).toBe(mockedMarks[index]);
+                });
+            });
+        });
+    });
 });