diff --git a/.changeset/title-deanimate-option.md b/.changeset/title-deanimate-option.md
new file mode 100644
index 0000000000..d568615f18
--- /dev/null
+++ b/.changeset/title-deanimate-option.md
@@ -0,0 +1,6 @@
+---
+"rrweb-snapshot": patch
+"rrweb": patch
+---
+
+Add slimDOM option to block animation on
tag; enabled when the 'all' value is used for slimDOM
diff --git a/packages/rrweb-snapshot/src/types.ts b/packages/rrweb-snapshot/src/types.ts
index 1abfe4d6c0..e4538a827a 100644
--- a/packages/rrweb-snapshot/src/types.ts
+++ b/packages/rrweb-snapshot/src/types.ts
@@ -169,6 +169,10 @@ export type SlimDOMOptions = Partial<{
headMetaHttpEquiv: boolean;
headMetaAuthorship: boolean;
headMetaVerification: boolean;
+ /**
+ * blocks title tag 'animations' which can generate a lot of mutations that aren't usually displayed in replayers
+ **/
+ headTitleMutations: boolean;
}>;
export type DataURLOptions = Partial<{
diff --git a/packages/rrweb/src/record/index.ts b/packages/rrweb/src/record/index.ts
index 080cf14549..ffc6f88b6d 100644
--- a/packages/rrweb/src/record/index.ts
+++ b/packages/rrweb/src/record/index.ts
@@ -174,6 +174,7 @@ function record(
// as they destroy some (hidden) info:
headMetaAuthorship: _slimDOMOptions === 'all',
headMetaDescKeywords: _slimDOMOptions === 'all',
+ headTitleMutations: _slimDOMOptions === 'all',
}
: _slimDOMOptions
? _slimDOMOptions
diff --git a/packages/rrweb/src/record/mutation.ts b/packages/rrweb/src/record/mutation.ts
index d96fab315d..a798441969 100644
--- a/packages/rrweb/src/record/mutation.ts
+++ b/packages/rrweb/src/record/mutation.ts
@@ -530,7 +530,7 @@ export default class MutationBuffer {
};
private processMutation = (m: mutationRecord) => {
- if (isIgnored(m.target, this.mirror)) {
+ if (isIgnored(m.target, this.mirror, this.slimDOMOptions)) {
return;
}
switch (m.type) {
@@ -688,7 +688,7 @@ export default class MutationBuffer {
: this.mirror.getId(m.target);
if (
isBlocked(m.target, this.blockClass, this.blockSelector, false) ||
- isIgnored(n, this.mirror) ||
+ isIgnored(n, this.mirror, this.slimDOMOptions) ||
!isSerialized(n, this.mirror)
) {
return;
@@ -747,7 +747,7 @@ export default class MutationBuffer {
if (this.addedSet.has(n) || this.movedSet.has(n)) return;
if (this.mirror.hasNode(n)) {
- if (isIgnored(n, this.mirror)) {
+ if (isIgnored(n, this.mirror, this.slimDOMOptions)) {
return;
}
this.movedSet.add(n);
diff --git a/packages/rrweb/src/utils.ts b/packages/rrweb/src/utils.ts
index f426689d2f..b7fa12506e 100644
--- a/packages/rrweb/src/utils.ts
+++ b/packages/rrweb/src/utils.ts
@@ -9,7 +9,7 @@ import type {
DeprecatedMirror,
textMutation,
} from '@rrweb/types';
-import type { IMirror, Mirror } from 'rrweb-snapshot';
+import type { IMirror, Mirror, SlimDOMOptions } from 'rrweb-snapshot';
import { isShadowRoot, IGNORED_NODE, classMatchesRegex } from 'rrweb-snapshot';
import type { RRNode, RRIFrameElement } from 'rrdom';
@@ -276,7 +276,17 @@ export function isSerialized(n: Node, mirror: Mirror): boolean {
return mirror.getId(n) !== -1;
}
-export function isIgnored(n: Node, mirror: Mirror): boolean {
+export function isIgnored(
+ n: Node,
+ mirror: Mirror,
+ slimDOMOptions: SlimDOMOptions,
+): boolean {
+ if ((n as Element).tagName === 'TITLE' && slimDOMOptions.headTitleMutations) {
+ // we do this check here but not in rrweb-snapshot
+ // to block mutations/animations on the title.
+ // the headTitleMutations option isn't intended to block recording of the initial value
+ return true;
+ }
// The main part of the slimDOM check happens in
// rrweb-snapshot::serializeNodeWithId
return mirror.getId(n) === IGNORED_NODE;