surevine / govuk-react-jsx

govuk-frontend compatible React components
https://govuk-react-jsx.netlify.app/
MIT License
3 stars 0 forks source link

Button issue with Formik #99

Closed oddjones closed 3 years ago

oddjones commented 3 years ago

Hi there - I've noticed in the Formik example (and in a different Formik example I've been asked to review) that there's a recurrent Cannot read property 'addEventListener' of null at e.init (button.js:718) error being pumped into the console - I've been having the devil's own job chasing it down - has anybody there figured out what's causing it?

andymantell commented 3 years ago

ah, when you press the submit button?

oddjones commented 3 years ago

yep - although I'm making things hard for myself by trying to implement it in NextJS and I'm having it happen when I interact with any field on the form (works fine if I just use a regular button)

andymantell commented 3 years ago

I can reproduce the issue in the Formik and React-hook-form examples here:

https://surevine.github.io/govuk-react-jsx-examples/

I'm in the middle of something for a second, but I'll try and take a look at the end of today.

Does the button "work" apart from this? Or are you totally blocked from doing what you're doing?

oddjones commented 3 years ago

Ah mate - seriously - it's just bugging me ;-) The button does seem to work - but because my example uses NextJS it's way more shouty about the error (no console there - right up in your face) - it can wait - no rush at all

andymantell commented 3 years ago

ok that's good, so long as you can do what you need to do for the moment.

Thanks for raising it - I'll sort it out as soon as I can.

andymantell commented 3 years ago

I think this might be the answer:

https://stackoverflow.com/a/63033314

oddjones commented 3 years ago

With the UseEffect being inside Formik? (guesses)

On Thu, Jan 7, 2021 at 3:52 PM Andy Mantell notifications@github.com wrote:

I think this might be the answer:

https://stackoverflow.com/a/63033314

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/surevine/govuk-react-jsx/issues/99#issuecomment-756200952, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAVJKP37DWQWZB32BGFQTLSYXKB7ANCNFSM4VZDV2XQ .

andymantell commented 3 years ago

sorry that was sort of a note to myself. It's the way that I'm initialising the govuk-frontend button javascript inside my component. It's not something you can fix at your end...

oddjones commented 3 years ago

smiles<<

andymantell commented 3 years ago

@oddjones and @SamChatfield - I think I have a simple fix for this. So simple I am suspicious of it, but I'm hoping it's a goer.

I'm gonna pursue it this weekend and extend my pipeline to publish release candidates so that you can both test it out before I let it out into the wild...

oddjones commented 3 years ago

Nice - I'll keep an eye open http://about.me/dominic.jones

On Fri, Mar 12, 2021 at 3:37 PM Andy Mantell @.***> wrote:

@oddjones https://github.com/oddjones and @SamChatfield https://github.com/SamChatfield - I think I have a simple fix for this. So simple I am suspicious of it, but I'm hoping it's a goer.

I'm gonna pursue it this weekend and extend my pipeline to publish release candidates so that you can both test it out before I let it out into the wild...

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/surevine/govuk-react-jsx/issues/99#issuecomment-797568161, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAVJKNQYCIAG52DAMFCBADTDIYNNANCNFSM4VZDV2XQ .

andymantell commented 3 years ago

@oddjones I've published as a release candidate so you can give it a whirl. If you wouldn't mind doing npm install govuk-react-jsx@next and seeing how that goes that would be great. Thanks!

andymantell commented 3 years ago

@oddjones This has been released now as https://github.com/surevine/govuk-react-jsx/releases/tag/v5.1.0

Please let me know if you have any further issues.