React-slick: TypeError: images.forEach is not a function - <InnerSlider> component

[fjeansilva]

Hi everyone, I'm getting the following error when I run my application on the ipad:

_TypeError: images.forEach is not a function. (In 'images.forEach', 'images.forEach' is undefined)
InnerSlider_componentDidUpdate_

Debugging the code it renders the component in the view, but when it executes this function it throws the error.

Only on the iPad does this happen, anyone have any idea what it could be?

[jmschlmrs]

This is the same issue as https://github.com/akiran/react-slick/issues/1132.

Some (older) browsers do not provide the method 'forEach' for NodeLists, which is the return value of document.querySelectorAll().

[fjeansilva]

Thanks @jmschlmrs, i'll close this issue.

[nihlton]

Heh, we both closed our issues. Oops.

[laveesingh]

Although the problem should have been fixed by the latest verson 0.22 3.

[nihlton]

Are you referring to changes here?

https://github.com/akiran/react-slick/commit/46b10cec38df95a53dab6234e59fde1b46fc9cdb

Array.from is not supported by IE (less than edge). This will continue to be an issue unless you've polyfilled .from()

[laveesingh]

Could you tell me if either of the following would work:
Converting to an array by spreading the NodeList object

[...images].forEach

Converting to an array by the slice method from Arrays:

Array.prototype.slice.call(images).forEach

[jmschlmrs]

@laveesingh, can confirm that Array.prototype.forEach.call(images, function(e){}); worked for me on IE11.

On a related note, looks like react-slick is using babel-polyfill. I'm assuming NodeList.forEach() is set to be added to that after core-js (which babel-polyfill uses) releases their V3: https://github.com/zloirock/core-js/issues/329.

[laveesingh]

The referenced commit should take care of it, the changes will be released soon.

[nihlton]

thanks :D