react-date-range icon indicating copy to clipboard operation
react-date-range copied to clipboard

Facing Cannot read property 'findIndex' of undefined /node_modules/react-date-range/dist/ utils.js

Open kaleshasheik opened this issue 4 years ago • 7 comments

Subject of the issue

Describe your issue here. Getting Cannot read property 'findIndex' of undefined. Any suggestion ?

[BUG] Bug Reproduce Steps

Tell us how to reproduce this issue.

[BUG] Expected behaviour

Environment

Package Version: React version: Node version: Browser:

kaleshasheik avatar Mar 11 '20 09:03 kaleshasheik

Hello. Thanks for reporting this. Have you ran npm install date-fns in your project folder?. This issue might be related. If the problem continues please let me know so I can examine it. Thanks.

onurkerimov avatar Mar 12 '20 12:03 onurkerimov

I had (I think) the same issue and installing date-fns does not resolve it. The error appears on the following line of utils.js:

function findNextRangeIndex(ranges) {
  var currentRangeIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
  var nextIndex = ranges.findIndex(function (range, i) { // <-- ERROR OCCURS HERE
    return i > currentRangeIndex && range.autoFocus !== false && !range.disabled;
  });
  if (nextIndex !== -1) return nextIndex;
  return ranges.findIndex(function (range) {
    return range.autoFocus !== false && !range.disabled;
  });
}
}

Passing in an empty range resolves the issue. I also had to pass an empty onChange as clicking a date without it also causes it to crash -- though other issues remain unfortunately.

<DateRangePicker 
    ranges={[]}
    onChange={() => {}}
/>

kiddailey avatar Mar 20 '20 21:03 kiddailey

Any Solution to this issue yet ?

M-iEak47D avatar Sep 24 '20 04:09 M-iEak47D

Hello, I am also experiencing this exact issue and previously mentioned remedies have not worked. Has there been any progress on this front? Thanks in advance!

UbiJRL avatar Apr 09 '21 20:04 UbiJRL

+1 and we are using NextJS if that helps.

adventurini avatar Apr 19 '21 16:04 adventurini

By the way, it works as intended. You have to double check that you are modifying your state object to be exactly the way it is on the package with the selection and comparison.

adventurini avatar Apr 19 '21 16:04 adventurini

You get this error when ranges is malformed, in my case my object was:

{
    "startDate": "2022-06-01T00:00:00.000Z",
    "endDate": "2022-06-29T00:00:00.000Z",
    "key": "selection"
}

when ranges should be

[
    {
        "startDate": "2022-06-01T00:00:00.000Z",
        "endDate": "2022-06-29T00:00:00.000Z",
        "key": "selection"
    }
]

it should be of type array, not object

StanlyLife avatar Jul 30 '22 15:07 StanlyLife