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.

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

Reduce verbosity/redundancy of new pointerType attribute #1206

Merged
merged 9 commits into from
Apr 16, 2023
2 changes: 1 addition & 1 deletion .changeset/little-suits-leave.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,4 @@
'@rrweb/types': minor
---

click events (as well as mousedown/mouseup/touchstart/touchend events) now include a `.pointerType` attribute which distinguishes between ['pen', 'mouse' and 'touch' events](https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType)
click events now include a `.pointerType` attribute which distinguishes between ['pen', 'mouse' and 'touch' events](https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType). There is no new PenDown/PenUp events, but these can be detected with a MouseDown/MouseUp + pointerType=pen
30 changes: 21 additions & 9 deletions packages/rrweb/src/record/observer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -244,14 +244,17 @@ function initMouseInteractionObserver({
let pointerType: PointerTypes | null = null;
let thisEventKey = eventKey;
if ('pointerType' in event) {
Object.keys(PointerTypes).forEach(
(pointerKey: keyof typeof PointerTypes) => {
if (event.pointerType === pointerKey.toLowerCase()) {
pointerType = PointerTypes[pointerKey];
return;
}
},
);
switch (event.pointerType) {
case 'mouse':
pointerType = PointerTypes.Mouse;
break;
case 'touch':
pointerType = PointerTypes.Touch;
break;
case 'pen':
pointerType = PointerTypes.Pen;
break;
}
if (pointerType === PointerTypes.Touch) {
if (MouseInteractions[eventKey] === MouseInteractions.MouseDown) {
// we are actually listening on 'pointerdown'
Expand All @@ -262,14 +265,23 @@ function initMouseInteractionObserver({
// we are actually listening on 'pointerup'
thisEventKey = 'TouchEnd';
}
} else if (pointerType == PointerTypes.Pen) {
} else if (pointerType === PointerTypes.Pen) {
// TODO: these will get incorrectly emitted as MouseDown/MouseUp
}
} else if (legacy_isTouchEvent(event)) {
pointerType = PointerTypes.Touch;
}
if (pointerType !== null) {
currentPointerType = pointerType;
if (
(thisEventKey.startsWith('Touch') &&
pointerType === PointerTypes.Touch) ||
(thisEventKey.startsWith('Mouse') &&
pointerType === PointerTypes.Mouse)
) {
// don't output redundant info
pointerType = null;
}
} else if (MouseInteractions[eventKey] === MouseInteractions.Click) {
pointerType = currentPointerType;
currentPointerType = null; // cleanup as we've used it
Expand Down
Loading