move browser related APIs into runtime

src/record/observer.ts

@@ -314,12 +314,6 @@ function initViewportResizeObserver(
 }
 
 const INPUT_TAGS = ['INPUT', 'TEXTAREA', 'SELECT'];
-const HOOK_PROPERTIES: Array<[HTMLElement, string]> = [
-  [HTMLInputElement.prototype, 'value'],
-  [HTMLInputElement.prototype, 'checked'],
-  [HTMLSelectElement.prototype, 'value'],
-  [HTMLTextAreaElement.prototype, 'value'],
-];
 const lastInputValueMap: WeakMap<EventTarget, inputValue> = new WeakMap();
 function initInputObserver(
   cb: inputCallback,
@@ -388,9 +382,15 @@ function initInputObserver(
     HTMLInputElement.prototype,
     'value',
   );
+  const hookProperties: Array<[HTMLElement, string]> = [
+    [HTMLInputElement.prototype, 'value'],
+    [HTMLInputElement.prototype, 'checked'],
+    [HTMLSelectElement.prototype, 'value'],
+    [HTMLTextAreaElement.prototype, 'value'],
+  ];
   if (propertyDescriptor && propertyDescriptor.set) {
     handlers.push(
-      ...HOOK_PROPERTIES.map(p =>
+      ...hookProperties.map(p =>
         hookSetter<HTMLElement>(p[0], p[1], {
           set() {
             // mock to a normal event

src/replay/index.ts

@@ -26,8 +26,6 @@ import './styles/style.css';
 const SKIP_TIME_THRESHOLD = 10 * 1000;
 const SKIP_TIME_INTERVAL = 5 * 1000;
 
-smoothscroll.polyfill();
-
 // https://github.com/rollup/rollup/issues/1267#issuecomment-296395734
 // tslint:disable-next-line
 const mitt = (mittProxy as any).default || mittProxy;
@@ -75,6 +73,7 @@ export class Replayer {
     this.config = Object.assign({}, defaultConfig, config);
 
     this.timer = new Timer(this.config);
+    smoothscroll.polyfill();
     this.setupDom();
     this.emitter.on('resize', this.handleResize as mitt.Handler);
   }

src/types.ts

@@ -267,4 +267,5 @@ export enum ReplayerEvents {
   LoadStylesheetEnd = 'load-stylesheet-end',
   SkipStart = 'skip-start',
   SkipEnd = 'skip-end',
+  MouseInteraction = 'mouse-interaction',
 }