send-beacon-in-iframe.html | Explore in Territory

<!doctype html>
<!--
  This page appends an iframe that calls `navigator.sendBeacon()` with the provided encoded URL and
  payload specs.
-->
<head>
<title>navigator.sendBeacon() in iframe</title>
</head>
<body>
<script>
const PARAMS = new URL(location.href).searchParams;
const TARGET_URL = PARAMS.get('url') ? decodeURIComponent(PARAMS.get('url')) : '';
const PAYLOAD_TYPE = PARAMS.get('payload_type');
const PAYLOAD_CONTENT_TYPE= PARAMS.get('payload_content_type');
const PAYLOAD_SIZE = 100;
const DELAY_IFRAME_REMOVAL_MS = parseInt(PARAMS.get('delay_iframe_removal_ms'), 10);

function makePayload(payloadType, payloadSize, payloadContentType) {
  if (!payloadType) return null;

  const prefix = String(payloadSize) + ':';
  const data = prefix + '*'.repeat(payloadSize - prefix.length);

  switch (payloadType) {
    case 'string':
      return data;
    case 'arraybuffer':
      return new TextEncoder().encode(data).buffer;
    case 'form':
      const formData = new FormData()
      formData.append('payload', data);
      return formData;
    case 'blob':
      const options = payloadContentType ? {type: payloadContentType} : undefined;
      const blob = new Blob([data], options);
      return blob;
    default:
      throw Error('invalid payload type');
  }
}

const iframe = document.createElement('iframe');
document.body.appendChild(iframe);
const payload = makePayload(PAYLOAD_TYPE, PAYLOAD_SIZE, PAYLOAD_CONTENT_TYPE);
if (payload) {
  iframe.contentWindow.navigator.sendBeacon(TARGET_URL, payload);
} else {
  iframe.contentWindow.navigator.sendBeacon(TARGET_URL);
}
if (!isNaN(DELAY_IFRAME_REMOVAL_MS) && DELAY_IFRAME_REMOVAL_MS >= 0) {
  setTimeout(() => iframe.remove(), DELAY_IFRAME_REMOVAL_MS);
} else {
  iframe.remove();
}
</script>
</body>
chromium/content/test/data/send-beacon-in-iframe.html
