From 65547535bb972615a6e5bfaa4bd35f5f8d124c31 Mon Sep 17 00:00:00 2001
From: katspaugh <katspaugh@gmail.com>
Date: Thu, 4 Jan 2024 21:32:14 +0100
Subject: [PATCH] Fix: limit resize observer to width

---
 src/renderer.ts | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/renderer.ts b/src/renderer.ts
index 67d411fcd..bb8ec114f 100644
--- a/src/renderer.ts
+++ b/src/renderer.ts
@@ -24,6 +24,7 @@ class Renderer extends EventEmitter<RendererEvents> {
   private isScrollable = false
   private audioData: AudioBuffer | null = null
   private resizeObserver: ResizeObserver | null = null
+  private lastContainerWidth = 0
   private isDragging = false
 
   constructor(options: WaveSurferOptions, audioElement?: HTMLElement) {
@@ -103,11 +104,18 @@ class Renderer extends EventEmitter<RendererEvents> {
     // Re-render the waveform on container resize
     const delay = this.createDelay(100)
     this.resizeObserver = new ResizeObserver(() => {
-      delay(() => this.reRender())
+      delay(() => this.onContainerResize())
     })
     this.resizeObserver.observe(this.scrollContainer)
   }
 
+  private onContainerResize() {
+    const width = this.parent.clientWidth
+    if (width === this.lastContainerWidth && this.options.height !== 'auto') return
+    this.lastContainerWidth = width
+    this.reRender()
+  }
+
   private initDrag() {
     makeDraggable(
       this.wrapper,