Remove iframe-resizer package (#34)

* wip

* Replace `iframe-resizer` with our own implementation

* Bump version

package.json

@@ -1,6 +1,6 @@
 {
  "name": "@authsignal/browser",
- "version": "0.1.3",
+ "version": "0.1.4",
  "type": "module",
  "main": "dist/index.js",
  "module": "dist/index.js",
@@ -24,7 +24,6 @@
  "@fingerprintjs/fingerprintjs": "^3.3.6",
  "@simplewebauthn/browser": "^7.2.0",
  "a11y-dialog": "^7.5.2",
- "iframe-resizer": "^4.3.6",
  "ky": "^0.33.3",
  "uuid": "^9.0.0"
  },

src/popup-handler.ts

@@ -1,6 +1,4 @@
 import A11yDialog from "a11y-dialog";
-import "iframe-resizer/js/iframeResizer";
-import "iframe-resizer/js/iframeResizer.contentWindow";
 
 const CONTAINER_ID = "__authsignal-popup-container";
 const CONTENT_ID = "__authsignal-popup-content";
@@ -24,7 +22,6 @@ type PopupHandlerOptions = {
 
 class PopupHandler {
  private popup: A11yDialog | null = null;
- private isHeightAutoResized = true;
 
  constructor({width}: PopupHandlerOptions) {
  if (document.querySelector(`#${CONTAINER_ID}`)) {
@@ -124,6 +121,8 @@ class PopupHandler {
  document.body.removeChild(dialogEl);
  document.head.removeChild(styleEl);
  }
+
+ window.removeEventListener("message", resizeIframe);
  }
 
  show({url}: PopupShowInput) {
@@ -146,17 +145,9 @@ class PopupHandler {
  dialogContent.appendChild(iframe);
  }
 
- // @ts-expect-error can't get typescript import to behave nicely, this works though
- iFrameResize(
- {
- checkOrigin: false,
- scrolling: true,
- onInit: () => {
- this.popup?.show();
- },
- },
- iframe
- );
+ window.addEventListener("message", resizeIframe);
+
+ this.popup?.show();
  }
 
  close() {
@@ -176,4 +167,12 @@ class PopupHandler {
  }
 }
 
+function resizeIframe(event: MessageEvent) {
+ const iframeEl = document.querySelector<HTMLIFrameElement>(`#${IFRAME_ID}`);
+
+ if (iframeEl && event.data.height) {
+ iframeEl.style.height = event.data.height + "px";
+ }
+}
+
 export {PopupHandler};