pass fromEl and toEl to hook beforeUpdate

assets/js/phoenix_live_view/view.js

@@ -543,7 +543,7 @@ export default class View {
       !fromEl.isEqualNode(toEl) &&
       !(isIgnored && isEqualObj(fromEl.dataset, toEl.dataset))
     ) {
-      hook.__beforeUpdate();
+      hook.__beforeUpdate(fromEl, toEl);
       return hook;
     }
   }

assets/js/phoenix_live_view/view_hook.ts

@@ -35,7 +35,7 @@ export interface HookInterface<E extends HTMLElement = HTMLElement> {
    * Called when the element is about to be updated in the DOM.
    * Note: any call here must be synchronous as the operation cannot be deferred or cancelled.
    */
-  beforeUpdate?: () => void;
+  beforeUpdate?: (fromEl: E, toEl: E) => void;
 
   /**
    * The updated callback.
@@ -173,7 +173,7 @@ export interface Hook<T = object, E extends HTMLElement = HTMLElement> {
    * Called when the element is about to be updated in the DOM.
    * Note: any call here must be synchronous as the operation cannot be deferred or cancelled.
    */
-  beforeUpdate?: (this: T & HookInterface<E>) => void;
+  beforeUpdate?: (this: T & HookInterface<E>, fromEl: E, toEl: E) => void;
 
   /**
    * The updated callback.
@@ -347,7 +347,7 @@ export class ViewHook<E extends HTMLElement = HTMLElement>
 
   // Default lifecycle methods
   mounted(): void {}
-  beforeUpdate(): void {}
+  beforeUpdate(_fromEl: E, _toEl: E): void {}
   updated(): void {}
   destroyed(): void {}
   disconnected(): void {}
@@ -364,8 +364,8 @@ export class ViewHook<E extends HTMLElement = HTMLElement>
     this.updated();
   }
   /** @internal */
-  __beforeUpdate() {
-    this.beforeUpdate();
+  __beforeUpdate(fromEl, toEl) {
+    this.beforeUpdate(fromEl, toEl);
   }
   /** @internal */
   __destroyed() {