ghosh / Micromodal

⭕ Tiny javascript library for creating accessible modal dialogs
https://micromodal.now.sh/
MIT License
3.53k stars 229 forks source link

Invalid attempt to spread non-iterable instance #316

Open t3db0t opened 4 years ago

t3db0t commented 4 years ago

Hi there! I just came back to a project from about a year ago and I'm now getting this error on a previously working codebase that I hadn't made any changes to:

jquery.min.js:2 jQuery.Deferred exception: Invalid attempt to spread non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method. TypeError: Invalid attempt to spread non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
    at https://unpkg.com/micromodal@0.4.6/dist/micromodal.min.js:1:847
    at t (https://unpkg.com/micromodal@0.4.6/dist/micromodal.min.js:1:997)
    at Object.init (https://unpkg.com/micromodal@0.4.6/dist/micromodal.min.js:1:6393)
    at HTMLDocument.<anonymous> (http://127.0.0.1:8887/lib/index.js:77:16)
    at j (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js:2:29588)
    at k (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js:2:29902)

This is in Chrome 80.0.3987.162. When I comment out any use of micromodal everything works again.

Kilbourne commented 4 years ago

I have the same problem. I think is due to Micromodal switching to babel7 while having an error in code that was silently accepted by Babel 6 https://github.com/babel/babel/issues/9942#issuecomment-489389297 This pull request https://github.com/ghosh/Micromodal/pull/313 should resolve it

joshvickerson commented 4 years ago

I'm having the same issue in a codebase still using Babel 6 - even if I try to run micrmodal through Babel at build time for my app, I still have the issue. I've also attempted using the polyfills suggested in #49 - I'm not using WebPack so the other recommendations don't work.

I have no idea how to fix this issue myself, but if #313 will fix it, I hope this can be merged soon.

joshvickerson commented 4 years ago

I was able to fix this for my own use - see my comment in #315

bennlich commented 3 years ago

I'm also seeing this in chrome

bennlich commented 3 years ago

It appears to happen when the Array prototype gets messed with before calling micromodal.init(), which jquery seems to do on import.

E.g. to reproduce:

Array.prototype.randomElement = function () {
  console.log('hello')
}

MicroModal.init()
tomgreenhill commented 3 years ago

Anyone have an idea on a fix for this at all please? Having to pull in jQuery for some 3rd party code and it's breaking my code...