0

I have the following widget on my website which loads a booking system. Is there a way to press the Next button after 5 seconds of loading?

<!-- Practice Better Booking Widget: start -->
<style>.better-inline-booking-widget{position:relative;overflow:hidden}.better-inline-booking-widget iframe{position:absolute;top:0;left:0;width:100%;height:100%}</style>

<div class="better-inline-booking-widget" data-url="https://my.practicebetter.io" data-course="63bdc7debc7ce781dd1860e0" data-hash="600ad6742a9c2416e0768660" data-theme="54a288" data-theme-accent="d74b33" style="width:100%;max-width:550px;height:800px;" data-scrollbar-visible="false"></div>

<script type="text/javascript" src="https://cdn.practicebetter.io/assets/js/booking.widget.js"></script>
<!-- Practice Better Booking Widget: end -->

I tried to add setTimeout(document.getElementsByName("Next").click(),5000); with no success

Panagiotis
  • 1
  • 1

1 Answers1

0

The button that's being rendered by your JavaScript is actually contained in an i-frame. i-frames follow the same-origin policy. This means that if you want to interact with the contents of the i-frame (including the button) via JavaScript in the page hosting the i-frame they both need to be on the same domain. If they are in the same domain then this is how you would click the button with JavaScript.

setTimeout(() => {
    let button = document.querySelector('.better-inline-booking-widget iframe').contentWindow.document.querySelector('button');
    button.click();  // This will throw an error unless the site is the same domain as the iframe
}, 5000);
TechDan
  • 58
  • 7
  • Thanks a lot for your reply. Unfortunately they are not on the same domain. Are there any other ways to go around this? – Panagiotis Jan 18 '23 at 16:47
  • Unfortunately, the only other way around this is getting the server of the i-frame to enable cross-origin resource sharing by adding your domain to their list or if you own both domains you can use this [workaround](https://stackoverflow.com/questions/25098021/securityerror-blocked-a-frame-with-origin-from-accessing-a-cross-origin-frame). Check out this [explanation](https://stackoverflow.com/questions/27365303/what-is-the-issue-cors-is-trying-to-solve) of why this security feature was designed as it is. – TechDan Jan 18 '23 at 17:00