Apple Pay and Google Pay buttons are not displayed during the payment step when using multistep checkout plugins.
Reason
Multistep checkout plugins hide elements of the checkout page using JavaScript and display them at later steps to create a wizard-like experience. Since the payment buttons are in the last step, they remain hidden on page load and do not initialize as expected.
Solution
Implement a simple timer that periodically checks the visibility of the payment-wrapper element and initializes the payment buttons once it becomes visible.
Implementation
Added a new helper class to monitor the visibility of the payment-wrapper element on page load.
If the payment-wrapper is visible, the helper exits without action.
If the payment-wrapper is hidden, an interval timer checks the DOM every 150ms.
When the payment-wrapper becomes visible, a custom event is triggered.
Event listeners in the ApplePay and GooglePay modules refresh the buttons when the custom event is received.
Problem
Apple Pay and Google Pay buttons are not displayed during the payment step when using multistep checkout plugins.
Reason
Multistep checkout plugins hide elements of the checkout page using JavaScript and display them at later steps to create a wizard-like experience. Since the payment buttons are in the last step, they remain hidden on page load and do not initialize as expected.
Solution
Implement a simple timer that periodically checks the visibility of the payment-wrapper element and initializes the payment buttons once it becomes visible.
Implementation