xuguopeng/rrweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Resize and MediaInteraction events repeat generated after the iframe appeared (#1251)

Browse Source 
* fix: Resize and MediaInteraction events repeat generated after the iframe appeared

* Create nervous-buses-pump.md

* Apply formatting changes

---------

Co-authored-by: wangfukang <wangfukang@kuaishou.com>
Co-authored-by: wfk007 <wfk007@users.noreply.github.com>
This commit is contained in:
fukang wang
2026-04-01 12:00:00 +08:00
committed by GitHub
parent 7d91a1ad0c
commit 64328b8a0e
2 changed files with 19 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/nervous-buses-pump.md Normal file
View File

@@ -0,0 +1,5 @@
---
'rrweb': patch
---
fix: Resize and MediaInteraction events repeat generated after the iframe appeared

24
packages/rrweb/src/record/observer.ts
View File

@@ -378,9 +378,10 @@ export function initScrollObserver({
return on('scroll', updatePosition, doc); return on('scroll', updatePosition, doc);
} }
function initViewportResizeObserver({ function initViewportResizeObserver(
viewportResizeCb, { viewportResizeCb }: observerParam,
}: observerParam): listenerHandler { { win }: { win: IWindow },
): listenerHandler {
let lastH = -1; let lastH = -1;
let lastW = -1; let lastW = -1;
const updateDimension = callbackWrapper( const updateDimension = callbackWrapper(
@@ -400,7 +401,7 @@ function initViewportResizeObserver({
200, 200,
), ),
); );
return on('resize', updateDimension, window); return on('resize', updateDimension, win);
} }
function wrapEventWithUserTriggeredFlag( function wrapEventWithUserTriggeredFlag(
@@ -1035,6 +1036,7 @@ function initMediaInteractionObserver({
blockSelector, blockSelector,
mirror, mirror,
sampling, sampling,
doc,
}: observerParam): listenerHandler { }: observerParam): listenerHandler {
const handler = callbackWrapper((type: MediaInteractions) => const handler = callbackWrapper((type: MediaInteractions) =>
throttle( throttle(
@@ -1061,11 +1063,11 @@ function initMediaInteractionObserver({
), ),
); );
const handlers = [ const handlers = [
on('play', handler(MediaInteractions.Play)), on('play', handler(MediaInteractions.Play), doc),
on('pause', handler(MediaInteractions.Pause)), on('pause', handler(MediaInteractions.Pause), doc),
on('seeked', handler(MediaInteractions.Seeked)), on('seeked', handler(MediaInteractions.Seeked), doc),
on('volumechange', handler(MediaInteractions.VolumeChange)), on('volumechange', handler(MediaInteractions.VolumeChange), doc),
on('ratechange', handler(MediaInteractions.RateChange)), on('ratechange', handler(MediaInteractions.RateChange), doc),
]; ];
return callbackWrapper(() => { return callbackWrapper(() => {
handlers.forEach((h) => h()); handlers.forEach((h) => h());
@@ -1279,7 +1281,9 @@ export function initObservers(
const mousemoveHandler = initMoveObserver(o); const mousemoveHandler = initMoveObserver(o);
const mouseInteractionHandler = initMouseInteractionObserver(o); const mouseInteractionHandler = initMouseInteractionObserver(o);
const scrollHandler = initScrollObserver(o); const scrollHandler = initScrollObserver(o);
const viewportResizeHandler = initViewportResizeObserver(o); const viewportResizeHandler = initViewportResizeObserver(o, {
win: currentWindow,
});
const inputHandler = initInputObserver(o); const inputHandler = initInputObserver(o);
const mediaInteractionHandler = initMediaInteractionObserver(o); const mediaInteractionHandler = initMediaInteractionObserver(o);