hrydgard / ppsspp-site

New PPSSPP website
60 stars 26 forks source link

Buttons not always working on /buygold #11

Closed hrydgard closed 1 year ago

hrydgard commented 1 year ago

Seems to be some timing issue.

unknownbrackets commented 1 year ago

Yeah, the way it's working right now has a race condition. You probably need to use the fastspring JS API rather than the HTML attributes, i.e. https://developer.fastspring.com/docs/methods. I think just reset/add/checkout.

The reason there's a race condition is that the fastspring library basically looks for those special attributes on its startup. So if React renders the HTML to the DOM before fastspring loads, you're fine. If fastspring wins the race, it finds nothing and doesn't attach to anything.

This is generally a problem also because React may re-create the nodes at any time. It tries to keep the nodes the same (this is good for speed and accessibility, creating new nodes is expensive), so this usually won't happen, but it's not "guaranteed" not to happen. If they're recreated, same issue, fastspring won't be attached anymore and won't notice them.

You could keep using the HTML way if there's a way to trigger it to rescan the DOM. Then you would trigger this using useEffect() so that it rescans each time the component re-renders. Not sure if they have such a method, though.

-[Unknown]

hrydgard commented 1 year ago

Thanks for the advice! Switched to the JS API, wasn't too hard after all.

Closing.