Iframe

<div class="pt-iframe-container" hidden>
  <iframe id="pt-iframe" title="PayTomorrow financing application"></iframe>
</div>

<style>
  /* Keep both transparent. The application draws its own dimmed backdrop over your page. */
  .pt-iframe-container {
    position: fixed;
    inset: 0;
    z-index: 9999;
  }
  .pt-iframe-container > iframe {
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
    color-scheme: normal;
  }
</style>

<script>
  // Only accept messages from PayTomorrow. Compare exact origins, never a regex or substring.
  const PAYTOMORROW_ORIGINS = new Set([
    'https://consumer.paytomorrow.com',
    'https://consumer-staging.paytomorrow.com', // remove in production
  ]);

  const container = document.querySelector('.pt-iframe-container');
  const iframe = document.getElementById('pt-iframe');

  function openPayTomorrow(applicationUrl) {
    iframe.src = applicationUrl;
    container.hidden = false;
    document.body.style.overflow = 'hidden';
  }

  function closePayTomorrow() {
    container.hidden = true;
    iframe.src = 'about:blank';
    document.body.style.overflow = '';
  }

  window.addEventListener('message', (event) => {
    if (!PAYTOMORROW_ORIGINS.has(event.origin) || event.source !== iframe.contentWindow) return;

    // Some events arrive twice: once as a string, once as an object.
    const type = typeof event.data === 'string' ? event.data : event.data?.message;

    switch (type) {
      case 'pt-confirmation':
        closePayTomorrow();
        // Show a "processing" state. Your server reconciles authenticated status after a postback.
        window.location.assign('/checkout/paytomorrow/success');
        break;
      case 'pt-close':
      case 'pt-finished':
        closePayTomorrow();
        break;
      case 'pt-decline':
      case 'pt-error':
        closePayTomorrow();
        window.location.assign('/checkout?payment=declined');
        break;
    }
  });

  // `applicationUrl` comes from your server's Create order call.
  openPayTomorrow(applicationUrl);
</script>