Fix regression in attaching event handlers

[awalker-stripe]

Summary & motivation

Fix for #365

In some integrations, the useEffect that calls elements.on seemed run while elementRef.current was still null, resulting in the event handler never being attached. This (hopefully) fixes the issue by explicitly attaching the event handler any time we set elementRef.current.

Testing & documentation

• Existing tests pass, added 1 extra unit test to make sure we weren't double-adding events
• Manually testing following same approach in Only call element.on when the merchant passes in a callback #360.
• I couldn't reproduce the issue in [BUG]: LinkAuthenticationElement no longer fires onChange event when it is mounted. #365 in my own integration; I will reach out on that thread after to confirm whether the fix was successful.

[awalker-stripe]

useLayoutEffect instead of useEffect makes sure we only call element.on once when first rendering. This is because this layout effect will execute before the layout effect that creates the element, meaning when rendering, elementRef.current is null and it'll exit early on line 16. (Please lmk if there's a better way around this!)

[awalker-stripe]

r? @jackieosborn-stripe