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

upgrade TS

Browse Source
This commit is contained in:
Yanzhen Yu
2020-04-12 00:06:57 +08:00
parent 1bb7ffd8fc
commit f159d7711f
4 changed files with 43 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -55,7 +55,7 @@
"ts-node": "^7.0.1", "ts-node": "^7.0.1",
"tslib": "^1.9.3", "tslib": "^1.9.3",
"tslint": "^4.5.1", "tslint": "^4.5.1",
"typescript": "^3.4.1" "typescript": "^3.8.3"
}, },
"dependencies": { "dependencies": {
"@types/smoothscroll-polyfill": "^0.3.0", "@types/smoothscroll-polyfill": "^0.3.0",

28
src/record/index.ts
View File

@@ -97,20 +97,20 @@ function record<T = eventWithTime>(
data: { data: {
node, node,
initialOffset: { initialOffset: {
left: (window.pageXOffset !== undefined) ? left:
window.pageXOffset : ( window.pageXOffset !== undefined
document!.documentElement.scrollLeft || ? window.pageXOffset
document!.body!.parentNode.scrollLeft || : document?.documentElement.scrollLeft ||
document!.body.scrollLeft || document?.body?.parentElement?.scrollLeft ||
0 document?.body.scrollLeft ||
), 0,
top: (window.pageYOffset !== undefined) ? top:
window.pageYOffset : ( window.pageYOffset !== undefined
document!.documentElement.scrollTop || ? window.pageYOffset
document!.body!.parentNode.scrollTop || : document?.documentElement.scrollTop ||
document!.body.scrollTop || document?.body?.parentElement?.scrollTop ||
0 document?.body.scrollTop ||
), 0,
}, },
}, },
}), }),

50
src/record/observer.ts
View File

@@ -65,7 +65,7 @@ function initMutationObserver(
inlineStylesheet: boolean, inlineStylesheet: boolean,
maskAllInputs: boolean, maskAllInputs: boolean,
): MutationObserver { ): MutationObserver {
const observer = new MutationObserver(mutations => { const observer = new MutationObserver((mutations) => {
const texts: textCursor[] = []; const texts: textCursor[] = [];
const attributes: attributeCursor[] = []; const attributes: attributeCursor[] = [];
let removes: removedNodeMutation[] = []; let removes: removedNodeMutation[] = [];
@@ -94,10 +94,10 @@ function initMutationObserver(
addedSet.add(n); addedSet.add(n);
droppedSet.delete(n); droppedSet.delete(n);
} }
n.childNodes.forEach(childN => genAdds(childN)); n.childNodes.forEach((childN) => genAdds(childN));
}; };
mutations.forEach(mutation => { mutations.forEach((mutation) => {
const { const {
type, type,
target, target,
@@ -123,7 +123,7 @@ function initMutationObserver(
return; return;
} }
let item: attributeCursor | undefined = attributes.find( let item: attributeCursor | undefined = attributes.find(
a => a.node === target, (a) => a.node === target,
); );
if (!item) { if (!item) {
item = { item = {
@@ -141,8 +141,8 @@ function initMutationObserver(
break; break;
} }
case 'childList': { case 'childList': {
addedNodes.forEach(n => genAdds(n, target)); addedNodes.forEach((n) => genAdds(n, target));
removedNodes.forEach(n => { removedNodes.forEach((n) => {
const nodeId = mirror.getId(n as INode); const nodeId = mirror.getId(n as INode);
const parentId = mirror.getId(target as INode); const parentId = mirror.getId(target as INode);
if (isBlocked(n, blockClass)) { if (isBlocked(n, blockClass)) {
@@ -198,7 +198,7 @@ function initMutationObserver(
parentId, parentId,
previousId: !n.previousSibling previousId: !n.previousSibling
? n.previousSibling ? n.previousSibling
: mirror.getId(n.previousSibling as INode), : mirror.getId((n.previousSibling as unknown) as INode),
nextId: !n.nextSibling nextId: !n.nextSibling
? n.nextSibling ? n.nextSibling
: mirror.getId((n.nextSibling as unknown) as INode), : mirror.getId((n.nextSibling as unknown) as INode),
@@ -231,7 +231,7 @@ function initMutationObserver(
while (addQueue.length) { while (addQueue.length) {
if ( if (
addQueue.every( addQueue.every(
n => mirror.getId((n.parentNode as Node) as INode) === -1, (n) => mirror.getId((n.parentNode as Node) as INode) === -1,
) )
) { ) {
/** /**
@@ -246,19 +246,19 @@ function initMutationObserver(
const payload = { const payload = {
texts: texts texts: texts
.map(text => ({ .map((text) => ({
id: mirror.getId(text.node as INode), id: mirror.getId(text.node as INode),
value: text.value, value: text.value,
})) }))
// text mutation's id was not in the mirror map means the target node has been removed // text mutation's id was not in the mirror map means the target node has been removed
.filter(text => mirror.has(text.id)), .filter((text) => mirror.has(text.id)),
attributes: attributes attributes: attributes
.map(attribute => ({ .map((attribute) => ({
id: mirror.getId(attribute.node as INode), id: mirror.getId(attribute.node as INode),
attributes: attribute.attributes, attributes: attribute.attributes,
})) }))
// attribute mutation's id was not in the mirror map means the target node has been removed // attribute mutation's id was not in the mirror map means the target node has been removed
.filter(attribute => mirror.has(attribute.id)), .filter((attribute) => mirror.has(attribute.id)),
removes, removes,
adds, adds,
}; };
@@ -293,7 +293,7 @@ function initMoveObserver(
const wrappedCb = throttle((isTouch: boolean) => { const wrappedCb = throttle((isTouch: boolean) => {
const totalOffset = Date.now() - timeBaseline!; const totalOffset = Date.now() - timeBaseline!;
cb( cb(
positions.map(p => { positions.map((p) => {
p.timeOffset -= totalOffset; p.timeOffset -= totalOffset;
return p; return p;
}), }),
@@ -303,7 +303,7 @@ function initMoveObserver(
timeBaseline = null; timeBaseline = null;
}, 500); }, 500);
const updatePosition = throttle<MouseEvent | TouchEvent>( const updatePosition = throttle<MouseEvent | TouchEvent>(
evt => { (evt) => {
const { target } = evt; const { target } = evt;
const { clientX, clientY } = isTouchEvent(evt) const { clientX, clientY } = isTouchEvent(evt)
? evt.changedTouches[0] ? evt.changedTouches[0]
@@ -329,7 +329,7 @@ function initMoveObserver(
on('touchmove', updatePosition), on('touchmove', updatePosition),
]; ];
return () => { return () => {
handlers.forEach(h => h()); handlers.forEach((h) => h());
}; };
} }
@@ -356,14 +356,14 @@ function initMouseInteractionObserver(
}; };
}; };
Object.keys(MouseInteractions) Object.keys(MouseInteractions)
.filter(key => Number.isNaN(Number(key)) && !key.endsWith('_Departed')) .filter((key) => Number.isNaN(Number(key)) && !key.endsWith('_Departed'))
.forEach((eventKey: keyof typeof MouseInteractions) => { .forEach((eventKey: keyof typeof MouseInteractions) => {
const eventName = eventKey.toLowerCase(); const eventName = eventKey.toLowerCase();
const handler = getHandler(eventKey); const handler = getHandler(eventKey);
handlers.push(on(eventName, handler)); handlers.push(on(eventName, handler));
}); });
return () => { return () => {
handlers.forEach(h => h()); handlers.forEach((h) => h());
}; };
} }
@@ -371,7 +371,7 @@ function initScrollObserver(
cb: scrollCallback, cb: scrollCallback,
blockClass: blockClass, blockClass: blockClass,
): listenerHandler { ): listenerHandler {
const updatePosition = throttle<UIEvent>(evt => { const updatePosition = throttle<UIEvent>((evt) => {
if (!evt.target || isBlocked(evt.target as Node, blockClass)) { if (!evt.target || isBlocked(evt.target as Node, blockClass)) {
return; return;
} }
@@ -464,7 +464,7 @@ function initInputObserver(
if (type === 'radio' && name && isChecked) { if (type === 'radio' && name && isChecked) {
document document
.querySelectorAll(`input[type="radio"][name="${name}"]`) .querySelectorAll(`input[type="radio"][name="${name}"]`)
.forEach(el => { .forEach((el) => {
if (el !== target) { if (el !== target) {
cbWithDedup(el, { cbWithDedup(el, {
text: (el as HTMLInputElement).value, text: (el as HTMLInputElement).value,
@@ -492,7 +492,7 @@ function initInputObserver(
const handlers: Array<listenerHandler | hookResetter> = [ const handlers: Array<listenerHandler | hookResetter> = [
'input', 'input',
'change', 'change',
].map(eventName => on(eventName, eventHandler)); ].map((eventName) => on(eventName, eventHandler));
const propertyDescriptor = Object.getOwnPropertyDescriptor( const propertyDescriptor = Object.getOwnPropertyDescriptor(
HTMLInputElement.prototype, HTMLInputElement.prototype,
'value', 'value',
@@ -505,7 +505,7 @@ function initInputObserver(
]; ];
if (propertyDescriptor && propertyDescriptor.set) { if (propertyDescriptor && propertyDescriptor.set) {
handlers.push( handlers.push(
...hookProperties.map(p => ...hookProperties.map((p) =>
hookSetter<HTMLElement>(p[0], p[1], { hookSetter<HTMLElement>(p[0], p[1], {
set() { set() {
// mock to a normal event // mock to a normal event
@@ -516,13 +516,13 @@ function initInputObserver(
); );
} }
return () => { return () => {
handlers.forEach(h => h()); handlers.forEach((h) => h());
}; };
} }
function initStyleSheetObserver(cb: styleSheetRuleCallback): listenerHandler { function initStyleSheetObserver(cb: styleSheetRuleCallback): listenerHandler {
const insertRule = CSSStyleSheet.prototype.insertRule; const insertRule = CSSStyleSheet.prototype.insertRule;
CSSStyleSheet.prototype.insertRule = function(rule: string, index?: number) { CSSStyleSheet.prototype.insertRule = function (rule: string, index?: number) {
const id = mirror.getId(this.ownerNode as INode); const id = mirror.getId(this.ownerNode as INode);
if (id !== -1) { if (id !== -1) {
cb({ cb({
@@ -534,7 +534,7 @@ function initStyleSheetObserver(cb: styleSheetRuleCallback): listenerHandler {
}; };
const deleteRule = CSSStyleSheet.prototype.deleteRule; const deleteRule = CSSStyleSheet.prototype.deleteRule;
CSSStyleSheet.prototype.deleteRule = function(index: number) { CSSStyleSheet.prototype.deleteRule = function (index: number) {
const id = mirror.getId(this.ownerNode as INode); const id = mirror.getId(this.ownerNode as INode);
if (id !== -1) { if (id !== -1) {
cb({ cb({
@@ -567,7 +567,7 @@ function initMediaInteractionObserver(
}; };
const handlers = [on('play', handler('play')), on('pause', handler('pause'))]; const handlers = [on('play', handler('play')), on('pause', handler('pause'))];
return () => { return () => {
handlers.forEach(h => h()); handlers.forEach((h) => h());
}; };
} }

5
src/replay/index.ts
View File

@@ -100,8 +100,9 @@ export class Replayer {
} }
public setConfig(config: Partial<playerConfig>) { public setConfig(config: Partial<playerConfig>) {
Object.keys(config).forEach((key: keyof playerConfig) => { Object.keys(config).forEach((key) => {
this.config[key] = config[key]!; // @ts-ignore
this.config[key] = config[key];
}); });
if (!this.config.skipInactive) { if (!this.config.skipInactive) {
this.noramlSpeed = -1; this.noramlSpeed = -1;