Listen for messages

Add one listener to the page that holds the embed, and check two things before you trust a message: it came from your store's address, and it came from the studio's iframe. Your store's address is the one you sign in to your bench at, with no path and no slash at the end, such as https://yourstore.diamra.com. A store in a group, embedded on its own, uses its full address with the two dashes, such as https://yourstore--group.diamra.com.

On a group's page, embedded with data-diamra-enterprise, select [data-diamra-enterprise] iframe instead. The studio starts on the group's sign-in page at https://diamra.comand moves to the customer's store, so accept both addresses.

const STUDIO_ORIGIN = "https://yourstore.diamra.com";
const studio = () => document.querySelector("[data-diamra-store] iframe");

window.addEventListener("message", (event) => {
  if (event.origin !== STUDIO_ORIGIN) return;
  if (event.source !== studio()?.contentWindow) return;
  const msg = event.data;
  if (!msg || typeof msg.type !== "string") return;
  if (!msg.type.startsWith("diamra:")) return;
  console.log(msg.type, msg);
});

Test on your live page

Open the page that frames the studio, open the browser console and paste the snippet below. It prints every message except diamra:resize, which comes too often to read. Then walk through the studio as a customer would: sign in, generate a design, keep one, look at its price, tap Continue. Each step prints a line.

window.addEventListener("message", (e) => {
  const t = e.data?.type;
  if (t?.startsWith("diamra:") && t !== "diamra:resize") console.log(t, e.data);
});

Seeing nothing at all? Some site builders wrap custom code in a frame of their own, and messages only reach the studio's direct parent. Run document.querySelector("[data-diamra-store] iframe, [data-diamra-enterprise] iframe") in the top frame. If it returns null, the studio sits inside a nested frame: switch the console's frame picker from top to that frame, paste the snippet again, and put your listener there too.

For a worked example that sends an accepted price to a point of sale, read Send accepted orders to your jewelry POS.