diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts
index ca76b11ab3e9..52f1198833c6 100644
--- a/src/runtime/internal/dom.ts
+++ b/src/runtime/internal/dom.ts
@@ -624,6 +624,10 @@ export function add_resize_listener(node: HTMLElement, fn: () => void) {
 		iframe.src = 'about:blank';
 		iframe.onload = () => {
 			unsubscribe = listen(iframe.contentWindow, 'resize', fn);
+
+			// make sure an initial resize event is fired _after_ the iframe is loaded (which is asynchronous)
+			// see https://github.com/sveltejs/svelte/issues/4233
+			fn();
 		};
 	}
 
diff --git a/test/runtime-puppeteer/samples/binding-width-height-initialize/_config.js b/test/runtime-puppeteer/samples/binding-width-height-initialize/_config.js
new file mode 100644
index 000000000000..d67299ad5654
--- /dev/null
+++ b/test/runtime-puppeteer/samples/binding-width-height-initialize/_config.js
@@ -0,0 +1,6 @@
+export default {
+	async test({ assert, component }) {
+		assert.equal(component.toggle, true);
+		assert.equal(component.offsetHeight, 800);
+	}
+};
diff --git a/test/runtime-puppeteer/samples/binding-width-height-initialize/main.svelte b/test/runtime-puppeteer/samples/binding-width-height-initialize/main.svelte
new file mode 100644
index 000000000000..6136365a1d09
--- /dev/null
+++ b/test/runtime-puppeteer/samples/binding-width-height-initialize/main.svelte
@@ -0,0 +1,18 @@
+<script>
+  export let offsetHeight;
+  export let offsetWidth;
+  export let toggle = false;
+  $: if (offsetWidth) {
+    toggle = true;
+  }
+</script>
+
+<div class:toggle>
+  <div bind:offsetHeight bind:offsetWidth>{offsetHeight}</div>
+</div>
+
+<style>
+  .toggle > div {
+    height: 800px;
+  }
+</style>