@midscene/recorder 1.9.6 → 1.9.7

package/dist/RecordTimeline.js

@@ -1,11 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { AimOutlined, CompassOutlined, CopyOutlined, EditOutlined, KeyOutlined, VerticalAlignTopOutlined } from "@ant-design/icons";
-import { Button, Card, Image, Space, Timeline, Typography, message } from "antd";
+import { getMidsceneRecorderEventDescription, getMidsceneRecorderSemantic } from "@midscene/shared/recorder";
+import { App, Button, Card, Image, Space, Timeline, Typography } from "antd";
 import { useEffect, useRef, useState } from "react";
 import { ShinyText } from "./components/shiny-text.js";
 import "./RecordTimeline.css";
 const { Text } = Typography;
 const RecordTimeline = ({ events, onEventClick })=>{
+    const { message } = App.useApp();
     const [expandedEvents, setExpandedEvents] = useState(new Set());
     const timelineRootRef = useRef(null);
     useEffect(()=>{
@@ -119,7 +121,7 @@ const RecordTimeline = ({ events, onEventClick })=>{
         }
     };
     const isCoordinateValue = (value)=>Boolean(value && /^\s*\d+(?:\.\d+)?,\s*\d+(?:\.\d+)?\s*$/.test(value));
-    const getDisplayDescription = (event)=>event.elementDescription || event.actionSummary || event.replayInstruction;
+    const getDisplayDescription = (event)=>getMidsceneRecorderEventDescription(event);
     const getEventTitle = (event)=>{
         switch(event.type){
             case 'click':
@@ -147,7 +149,7 @@ const RecordTimeline = ({ events, onEventClick })=>{
         switch(event.type){
             case 'click':
             case 'drag':
-                if (true === event.descriptionLoading) return /*#__PURE__*/ jsxs("span", {
+                if (getMidsceneRecorderSemantic(event)?.status === 'pending') return /*#__PURE__*/ jsxs("span", {
                     style: {
                         display: 'flex',
                         alignItems: 'center',
@@ -168,7 +170,7 @@ const RecordTimeline = ({ events, onEventClick })=>{
                         })
                     ]
                 });
-                if (false === event.descriptionLoading && getDisplayDescription(event)) return /*#__PURE__*/ jsxs(Text, {
+                if (getMidsceneRecorderSemantic(event)?.status === 'ready') return /*#__PURE__*/ jsxs(Text, {
                     children: [
                         eventTitle,
                         " - ",
@@ -179,7 +181,7 @@ const RecordTimeline = ({ events, onEventClick })=>{
                     children: eventTitle
                 });
             case 'input':
-                if (false === event.descriptionLoading && getDisplayDescription(event)) return /*#__PURE__*/ jsxs(Text, {
+                if (getMidsceneRecorderSemantic(event)?.status === 'ready') return /*#__PURE__*/ jsxs(Text, {
                     children: [
                         eventTitle,
                         " - ",
@@ -224,7 +226,7 @@ const RecordTimeline = ({ events, onEventClick })=>{
                 });
             case 'navigation':
                 {
-                    const navigationDescription = event.actionSummary || event.replayInstruction || event.elementDescription;
+                    const navigationDescription = getDisplayDescription(event);
                     if (navigationDescription) return /*#__PURE__*/ jsxs(Text, {
                         children: [
                             eventTitle,
@@ -401,8 +403,10 @@ const RecordTimeline = ({ events, onEventClick })=>{
                                 style: {
                                     backgroundColor: '#f5f5f5'
                                 },
-                                bodyStyle: {
-                                    padding: '0px'
+                                styles: {
+                                    body: {
+                                        padding: '0px'
+                                    }
                                 },
                                 children: /*#__PURE__*/ jsxs("div", {
                                     style: {

package/dist/recorder.js

@@ -311,8 +311,7 @@ function convertToChromeEvent(event) {
         pageInfo: event.pageInfo,
         screenshotBefore: event.screenshotBefore,
         screenshotAfter: event.screenshotAfter,
-        elementDescription: event.elementDescription,
-        descriptionLoading: event.descriptionLoading,
+        semantic: event.semantic,
         screenshotWithBox: event.screenshotWithBox,
         timestamp: event.timestamp,
         hashId: event.hashId

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@midscene/recorder",
-  "version": "1.9.6",
+  "version": "1.9.7",
   "repository": {
     "type": "git",
     "url": "https://github.com/web-infra-dev/midscene.git",
@@ -29,7 +29,7 @@
     "antd": "^5.21.6",
     "dayjs": "^1.11.11",
     "react-dom": "18.3.1",
-    "@midscene/shared": "1.9.6"
+    "@midscene/shared": "1.9.7"
   },
   "peerDependencies": {
     "react": "18.3.1",