Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

John/hig-1121-add-rrweb-patch-for-element-blocking #49

Merged
merged 3 commits into from
Sep 13, 2021
Merged

John/hig-1121-add-rrweb-patch-for-element-blocking #49

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
17d066c
Apply #696
Sep 13, 2021
37b62c6
Apply 693
Sep 13, 2021
67e7914
Bump version
Sep 13, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@highlight-run/rrweb",
"version": "0.12.9",
"version": "0.12.10",
"description": "record and replay the web",
"scripts": {
"test": "npm run bundle:browser && cross-env TS_NODE_CACHE=false TS_NODE_FILES=true mocha -r ts-node/register -r ignore-styles -r jsdom-global/register test/**.test.ts",
Expand Down
18 changes: 6 additions & 12 deletions src/record/mutation.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -264,9 +264,6 @@ export default class MutationBuffer {
ns = ns && ns.nextSibling;
nextId = ns && this.mirror.getId((ns as unknown) as INode);
}
if (nextId === -1 && isBlocked(n.nextSibling, this.blockClass)) {
nextId = null;
}
return nextId;
};
const pushAdd = (n: Node) => {
Expand Down Expand Up @@ -506,11 +503,7 @@ export default class MutationBuffer {
const parentId = isShadowRoot(m.target)
? this.mirror.getId((m.target.host as unknown) as INode)
: this.mirror.getId(m.target as INode);
if (
isBlocked(n, this.blockClass) ||
isBlocked(m.target, this.blockClass) ||
isIgnored(n)
) {
if (isBlocked(m.target, this.blockClass) || isIgnored(n)) {
return;
}
// removed node has not been serialized yet, just remove it from the Set
Expand Down Expand Up @@ -554,9 +547,7 @@ export default class MutationBuffer {
};

private genAdds = (n: Node | INode, target?: Node | INode) => {
if (isBlocked(n, this.blockClass)) {
return;
}
// parent was blocked, so we can ignore this node
if (target && isBlocked(target, this.blockClass)) {
return;
}
Expand All @@ -576,7 +567,10 @@ export default class MutationBuffer {
this.addedSet.add(n);
this.droppedSet.delete(n);
}
n.childNodes.forEach((childN) => this.genAdds(childN));
// if this node is blocked `serializeNode` will turn it into a placeholder element
// but we have to remove it's children otherwise they will be added as placeholders too
if (!isBlocked(n, this.blockClass))
n.childNodes.forEach((childN) => this.genAdds(childN));
};
}

Expand Down
14 changes: 13 additions & 1 deletion src/record/observer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,8 @@ type WindowWithAngularZone = Window & {

export const mutationBuffers: MutationBuffer[] = [];

const isCSSGroupingRuleSupported = typeof CSSGroupingRule !== 'undefined';

function getEventTarget(event: Event): EventTarget | null {
try {
if ('composedPath' in event) {
Expand Down Expand Up @@ -500,7 +502,10 @@ function initInputObserver(
function getNestedCSSRulePositions(rule: CSSRule): number[] {
const positions: number[] = [];
function recurse(childRule: CSSRule, pos: number[]) {
if (childRule.parentRule instanceof CSSGroupingRule) {
if (
isCSSGroupingRuleSupported &&
childRule.parentRule instanceof CSSGroupingRule
) {
const rules = Array.from(
(childRule.parentRule as CSSGroupingRule).cssRules,
);
Expand Down Expand Up @@ -544,6 +549,13 @@ function initStyleSheetObserver(
return deleteRule.apply(this, arguments);
};

if (!isCSSGroupingRuleSupported) {
return () => {
CSSStyleSheet.prototype.insertRule = insertRule;
CSSStyleSheet.prototype.deleteRule = deleteRule;
};
}

const groupingInsertRule = CSSGroupingRule.prototype.insertRule;
CSSGroupingRule.prototype.insertRule = function (
rule: string,
Expand Down