Hotfix/recaptcha-placement-error

[dean-smart]

Fix reCAPTCHA Placement Render Error

Summary

This fixes a reCAPTCHA placement issue on the payment step by making the v2 checkbox render target stable and preventing repeated renders into the same placement.

The previous template swapped between separate visible and invisible container elements. That could leave grecaptcha.render() targeting a stale or missing element when the placement visibility changed. The component now keeps a single container, toggles its class, waits for Vue to flush the DOM, and stores the rendered widget id so it only renders once.

Changes

• Updated the payment page reCAPTCHA component to:
  • render a single stable container element;
  • use a ref instead of rendering by string id;
  • wait for nextTick() before calling grecaptcha.render();
  • verify the container is still attached to the DOM;
  • avoid duplicate v2 widget renders with recaptchaWidgetId.