Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Card brand not working with a pasted card number #37

Open
JamesBurgoon opened this issue Apr 6, 2022 · 9 comments
Open

Card brand not working with a pasted card number #37

JamesBurgoon opened this issue Apr 6, 2022 · 9 comments

Comments

@JamesBurgoon
Copy link

Can replicate issue on the example page:
https://wuori.github.io/vue-credit-card-validation/example/

If the user immediately pastes in their credit card number, the number is formatted and the card type is set on "data-card-brand", but apparently is not passed to cardBrandClass.

Screen Shot 2022-04-06 at 9 41 44 AM

Screen Shot 2022-04-06 at 9 41 14 AM

@wuori
Copy link
Owner

wuori commented Apr 7, 2022

Thank you for the detailed report! I'll try to get this fixed within the next week - but feel free to submit a PR in the meantime.

@wuori
Copy link
Owner

wuori commented Apr 7, 2022

@JamesBurgoon @stefanheimann

I've fixed this by adding a paste event listener on a timeout that just triggers the existing keyup event so none of the core code had to be changed. Perhaps not the "best" fix but as this plugin is already very listener-heavy I don't believe the impacts, at least performance-wise, will be increased much.

Update to v1.0.4 and you should be good to go. Please let me know if you have any issues!

@wuori
Copy link
Owner

wuori commented Apr 7, 2022

Actually, make that v1.0.5 as I addressed some security vulnerabilities.

@9mm
Copy link

9mm commented Sep 6, 2022

I noticed this has a weird issue where if you paste a number 4420504121201482 the spaces will disappear even though its valid. you have to actually type the full number and then the spaces remain

@9mm
Copy link

9mm commented Sep 6, 2022

You also have stray console.logs in your code that make debugging kind of a pain. IMO you should delete those

@wuori
Copy link
Owner

wuori commented Sep 7, 2022

@9mm I'll try to get a fix in for this. If you need it immediately please feel free to submit a PR and I'll merge. Thanks for the feedback... and sorry about the console.logs :|

@9mm
Copy link

9mm commented Sep 7, 2022

No worries! I'm glad I found your library, it is filling a great void. I am super grateful!

@wuori
Copy link
Owner

wuori commented Sep 7, 2022

@9mm Glad it could help! The project I built it for went nowhere so glad it wasn't all a waste. Also, I believe I allowed it to paste numbers without spaces so that it would work with another package I made for USB magnetic card readers: https://www.npmjs.com/package/vue-cardswipe so I'll see about making that an option to toggle upon instantiation.

@9mm
Copy link

9mm commented Sep 7, 2022

Yeah man, it definitely did not go to waste. IMO you have the base for a great project, simply because most card libraries out there are all dead, they are very slim pickins if one is not using stripe. Yours is "most stripe like" and very flexible which is why I chose it!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants