zdfs / toscani

This is a jQuery-based, progressively-enhanced solution for creating a single-field credit card input. The idea is to create a more streamlined credit card entry process.
872 stars 102 forks source link

Fix Safari Issues #2

Closed zdfs closed 11 years ago

zdfs commented 11 years ago

Payment Info: Safari is crashing on both Desktop and mobile. Doesn't seem to like the new transitions for the CC. Will need to try something else.

paularmstrong commented 11 years ago

Reproduces reliably for me. As soon as I finish entering a valid CC number, Safari crashes. OS X Safari 6.0.2 (8536.26.17)

zdfs commented 11 years ago

Yeah. It doesn't like the CSS transitions. Chrome is fine, Firefox is ok, but Safari will crash. I'll take another look soon. Thanks for reproducing.

zdfs commented 11 years ago

After some research, I discovered what is happening. The credit card field uses a calculated width right now, and there seems to be a bug in Safari 6.0.1 that crashes on elements that use a calculated width and transitions. Bug is here: https://bugs.webkit.org/show_bug.cgi?id=100568

The reason for calculated widths was because I wanted to make the field fluid somewhat, but it might just be better to make it all hard pixel widths for now.

zdfs commented 11 years ago

Fixed.

Duke3D commented 11 years ago

Did you fix it by using hard pixel width? Was this implemented across all browsers or is it sniffing for Safari? Or did you find another approach/solution to remaining fluid? Thank you for this great contribution!!!!!!!!!

zdfs commented 11 years ago

Hey Duke. Yes, I fixed it by using a hard pixel width across the board, for now. I'm already planning a major refactor that might affect this in the future, with the hope of more fluidity to the component. But for now, I'm calling it fixed.