Testing and Execution Environments

Testing the checkout via iframe allows validating the integration behavior in different scenarios. It helps verify loading, communication, visual behavior, fallback, and overall stability of the journey before the final release.

Production Testing

Production tests allow validating the final checkout experience. They help verify:

  • Loading of the iframe with HTTPS and active TLS;
  • Message exchange via postMessage during the flow;
  • Visual behavior, response time, and real environment experience;
  • Activation of the fallback when the checkout does not load within the defined time.

The traditional redirect flow remains available, allowing evaluation of the embedded checkout without changing the store's existing flow.

Using the POC for Validation

The POC facilitates quick validation of essential behaviors for the checkout via iframe. It uses a fixed URL for tests and allows observing loading, height adjustments, error states, and fallback. This simplified environment helps validate different scenarios without requiring a complete structure from the store.

The analysis can be carried out using the same component shown in the Implementation Examples section of the Technical Implementation page, where the code used in the POC is available.

iframe Inspection

Technical inspection helps diagnose the iframe's behavior during the flow. In the browser's DevTools, it is possible to:

  • Check the URL loaded by the iframe;
  • Analyze the permissions applied by the sandbox attribute;
  • Observe the execution of scripts associated with the checkout;
  • Monitor the messages exchanged via postMessage;
  • Check visual behavior during loading, resizing, and fallback.

This process helps identify communication, loading, or browser compatibility issues.

iframe Sandbox

The sandbox attribute controls what the iframe can execute within the store's page. The recommended configuration allows only the essential features for the checkout to work:

sandbox="allow-scripts allow-same-origin allow-forms"