@midscene/recorder 0.19.1 → 0.20.0

package/dist/RecordTimeline.js

@@ -4,10 +4,6 @@ import * as __WEBPACK_EXTERNAL_MODULE_antd__ from "antd";
 import "react";
 const { Text, Title } = __WEBPACK_EXTERNAL_MODULE_antd__.Typography;
 const RecordTimeline = ({ events, onEventClick })=>{
-    console.log('[RecordTimeline] events: ', {
-        events,
-        length: events.length
-    });
     const getEventIcon = (type)=>{
         switch(type){
             case 'click':
@@ -175,6 +171,13 @@ const RecordTimeline = ({ events, onEventClick })=>{
                     size: "small",
                     children: event.url && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Text, {
                         type: "secondary",
+                        style: {
+                            display: '-webkit-box',
+                            WebkitLineClamp: 2,
+                            WebkitBoxOrient: 'vertical',
+                            overflow: 'hidden',
+                            wordBreak: 'break-all'
+                        },
                         children: event.url
                     })
                 });

package/dist/recorder-iife.js

@@ -76,7 +76,7 @@
                 this.eventCallback(navigationEvent);
                 debugLog('Added final navigation event', navigationEvent);
             }, 0);
-            document.addEventListener('click', this.handleClick);
+            document.addEventListener('click', this.handleClick, true);
             document.addEventListener('input', this.handleInput);
             document.addEventListener('scroll', this.handleScroll, {
                 passive: true
@@ -106,12 +106,8 @@
             if (!this.isRecording) return;
             const target = event.target;
             const { isLabelClick, labelInfo } = this.checkLabelClick(target);
-            const rect = target.getBoundingClientRect();
+            target.getBoundingClientRect();
             const elementRect = {
-                left: Number(rect.left.toFixed(2)),
-                top: Number(rect.top.toFixed(2)),
-                width: Number(rect.width.toFixed(2)),
-                height: Number(rect.height.toFixed(2)),
                 x: Number(event.clientX.toFixed(2)),
                 y: Number(event.clientY.toFixed(2))
             };
@@ -180,6 +176,7 @@
         handleInput = (event)=>{
             if (!this.isRecording) return;
             const target = event.target;
+            if ('checkbox' === target.type) return;
             const rect = target.getBoundingClientRect();
             const elementRect = {
                 left: Number(rect.left.toFixed(2)),
@@ -189,7 +186,7 @@
             };
             const inputEvent = {
                 type: 'input',
-                value: target.value,
+                value: 'password' !== target.type ? target.value : '*****',
                 timestamp: Date.now(),
                 hashId: generateHashId('input', {
                     ...elementRect

package/dist/recorder.d.ts

@@ -4,10 +4,10 @@ export interface ChromeRecordedEvent {
     title?: string;
     value?: string;
     elementRect?: {
-        left: number;
-        top: number;
-        width: number;
-        height: number;
+        left?: number;
+        top?: number;
+        width?: number;
+        height?: number;
         x?: number;
         y?: number;
     };

package/dist/recorder.js

@@ -74,7 +74,7 @@ class EventRecorder {
             this.eventCallback(navigationEvent);
             debugLog('Added final navigation event', navigationEvent);
         }, 0);
-        document.addEventListener('click', this.handleClick);
+        document.addEventListener('click', this.handleClick, true);
         document.addEventListener('input', this.handleInput);
         document.addEventListener('scroll', this.handleScroll, {
             passive: true
@@ -104,12 +104,8 @@ class EventRecorder {
         if (!this.isRecording) return;
         const target = event.target;
         const { isLabelClick, labelInfo } = this.checkLabelClick(target);
-        const rect = target.getBoundingClientRect();
+        target.getBoundingClientRect();
         const elementRect = {
-            left: Number(rect.left.toFixed(2)),
-            top: Number(rect.top.toFixed(2)),
-            width: Number(rect.width.toFixed(2)),
-            height: Number(rect.height.toFixed(2)),
             x: Number(event.clientX.toFixed(2)),
             y: Number(event.clientY.toFixed(2))
         };
@@ -178,6 +174,7 @@ class EventRecorder {
     handleInput = (event)=>{
         if (!this.isRecording) return;
         const target = event.target;
+        if ('checkbox' === target.type) return;
         const rect = target.getBoundingClientRect();
         const elementRect = {
             left: Number(rect.left.toFixed(2)),
@@ -187,7 +184,7 @@ class EventRecorder {
         };
         const inputEvent = {
             type: 'input',
-            value: target.value,
+            value: 'password' !== target.type ? target.value : '*****',
             timestamp: Date.now(),
             hashId: generateHashId('input', {
                 ...elementRect

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@midscene/recorder",
-  "version": "0.19.1",
+  "version": "0.20.0",
   "type": "module",
   "exports": {
     ".": {
@@ -24,7 +24,7 @@
     "antd": "^5.21.6",
     "dayjs": "^1.11.11",
     "react-dom": "18.3.1",
-    "@midscene/shared": "0.19.1"
+    "@midscene/shared": "0.20.0"
   },
   "peerDependencies": {
     "react": "18.3.1",