return stopper function as the result of record

src/record/index.ts

@@ -7,6 +7,7 @@ import {
   eventWithTime,
   recordOptions,
   IncrementalSource,
+  listenerHandler,
 } from '../types';
 
 function wrapEvent(e: event): eventWithTime {
@@ -16,13 +17,15 @@ function wrapEvent(e: event): eventWithTime {
   };
 }
 
-function record(options: recordOptions = {}) {
+function record(options: recordOptions = {}): listenerHandler | undefined {
   const { emit } = options;
   // runtime checks for user options
   if (!emit) {
     throw new Error('emit function is required');
   }
   try {
+    const handlers: listenerHandler[] = [];
+    handlers.push(
       on('DOMContentLoaded', () => {
         emit(
           wrapEvent({
@@ -30,7 +33,8 @@ function record(options: recordOptions = {}) {
             data: {},
           }),
         );
-    });
+      }),
+    );
     const init = () => {
       emit(
         wrapEvent({
@@ -59,6 +63,7 @@ function record(options: recordOptions = {}) {
           },
         }),
       );
+      handlers.push(
         initObservers({
           mutationCb: m =>
             emit(
@@ -120,7 +125,8 @@ function record(options: recordOptions = {}) {
                 },
               }),
             ),
-      });
+        }),
+      );
     };
     if (
       document.readyState === 'interactive' ||
@@ -128,6 +134,7 @@ function record(options: recordOptions = {}) {
     ) {
       init();
     } else {
+      handlers.push(
         on(
           'load',
           () => {
@@ -140,8 +147,12 @@ function record(options: recordOptions = {}) {
             init();
           },
           window,
+        ),
       );
     }
+    return () => {
+      handlers.forEach(h => h());
+    };
   } catch (error) {
     // TODO: handle internal error
     console.warn(error);

src/record/observer.ts

@@ -365,7 +365,7 @@ function initInputObserver(cb: inputCallback): listenerHandler {
   };
 }
 
-export default function initObservers(o: observerParam) {
+export default function initObservers(o: observerParam): listenerHandler {
   const mutationObserver = initMutationObserver(o.mutationCb);
   const mousemoveHandler = initMousemoveObserver(o.mousemoveCb);
   const mouseInteractionHandler = initMouseInteractionObserver(
@@ -374,12 +374,12 @@ export default function initObservers(o: observerParam) {
   const scrollHandler = initScrollObserver(o.scrollCb);
   const viewportResizeHandler = initViewportResizeObserver(o.viewportResizeCb);
   const inputHandler = initInputObserver(o.inputCb);
-  return {
+  return () => {
-    mutationObserver,
+    mutationObserver.disconnect();
-    mousemoveHandler,
+    mousemoveHandler();
-    mouseInteractionHandler,
+    mouseInteractionHandler();
-    scrollHandler,
+    scrollHandler();
-    viewportResizeHandler,
+    viewportResizeHandler();
-    inputHandler,
+    inputHandler();
   };
 }

src/utils.ts

@@ -11,8 +11,9 @@ export function on(
   fn: EventListenerOrEventListenerObject,
   target: Document | Window = document,
 ): listenerHandler {
-  target.addEventListener(type, fn, { capture: true, passive: true });
+  const options = { capture: true, passive: true };
-  return () => target.removeEventListener(type, fn);
+  target.addEventListener(type, fn, options);
+  return () => target.removeEventListener(type, fn, options);
 }
 
 export const mirror: Mirror = {