opt exp

scripts/content.js

@@ -3,6 +3,7 @@
     let previousHighlight = null;
     let copyButton = null;
     let isCopyModeEnabled = false;
+    let copyMessage = null;
 
     // 创建复制按钮
     function createCopyButton() {
@@ -22,6 +23,10 @@
                 const command = `web.find_by_xpath("${xpath}").${action}`;
                 navigator.clipboard.writeText(command).then(() => {
                     console.log('Command copied to clipboard:', command);
+                    copyMessage.style.display = 'block';
+                    setTimeout(() => {
+                        copyMessage.style.display = 'none';
+                    }, 3000);
                 });
             }
         });
@@ -29,6 +34,28 @@
         return button;
     }
 
+    // 创建复制消息提示
+    function createCopyMessage() {
+        const message = document.createElement('div');
+        message.innerHTML = '已拷贝! <span style="cursor: pointer;">x</span> <span id="copied-xpath" style="color: yellow;"></span>';
+        message.style.position = 'fixed';
+        message.style.top = '10px';
+        message.style.left = '50%';
+        message.style.transform = 'translateX(-50%)';
+        message.style.background = '#98FB98'; // 更好看的浅绿色背景
+        message.style.color = 'white';
+        message.style.padding = '10px';
+        message.style.borderRadius = '5px';
+        message.style.display = 'none';
+        message.style.zIndex = '1001';
+        message.style.fontSize = '16px'; // 增大字体
+        message.querySelector('span').addEventListener('click', function () {
+            message.style.display = 'none';
+        });
+        document.body.appendChild(message);
+        return message;
+    }
+
     // 获取元素的 XPath
     function getElementXPath(element) {
         if (element.id) {
@@ -67,9 +94,9 @@
 
         // 移除上一次高亮
         if (previousHighlight) {
+            previousHighlight.style.background = '';
+            previousHighlight.style.backgroundImage = '';
             previousHighlight.style.border = '';
-            previousHighlight.style.borderRadius = '';
-            previousHighlight.style.boxShadow = '';
             copyButton.style.display = 'none';
         }
 
@@ -83,7 +110,10 @@
         // 如果有元素，添加高亮样式并输出对应的 XPath
         if (element && element !== document.body) {
             previousHighlight = element;
-            element.style.border = '2px solid red';
+            element.style.background = 'rgba(255, 182, 193, 0.5)'; // 浅红色背景
+            element.style.backgroundImage = 'linear-gradient(45deg, rgba(255, 182, 193, 0.5) 25%, transparent 25%, transparent 50%, rgba(255, 182, 193, 0.5) 50%, rgba(255, 182, 193, 0.5) 75%, transparent 75%, transparent)'; // 浅红色斜线
+            element.style.backgroundSize = '10px 10px';
+            element.style.border = '2px solid rgba(255, 105, 135, 0.8)'; // 边框颜色稍深
             element.style.borderRadius = '5px';
 
             // 设置复制按钮位置并显示
@@ -112,5 +142,47 @@
         }
     });
 
+    // 监听键盘事件以启用或禁用拷贝模式
+    document.addEventListener('keydown', function (event) {
+        console.log(event.key);
+        if (event.altKey && event.key === 'r') {
+            isCopyModeEnabled = true;
+            console.log('Copy mode enabled');
+        } else if (event.key === 'Escape') {
+            isCopyModeEnabled = false;
+            if (previousHighlight) {
+                previousHighlight.style.background = '';
+                previousHighlight.style.backgroundImage = '';
+                previousHighlight.style.border = '';
+                copyButton.style.display = 'none';
+                previousHighlight = null;
+            }
+            console.log('Copy mode disabled');
+        } else if (event.ctrlKey && event.key === 'c' && previousHighlight) {
+            const xpath = getElementXPath(previousHighlight);
+            const action = previousHighlight.tagName.toLowerCase() === 'input' ? 'input("your_text")' : 'click()';
+            const command = `web.find_by_xpath("${xpath}").${action}`;
+            navigator.clipboard.writeText(command).then(() => {
+                console.log('Command copied to clipboard:', command);
+                const truncatedXPath = xpath.length > 20 ? xpath.substring(0, 20) + '...' : xpath;
+                document.getElementById('copied-xpath').innerText = truncatedXPath;
+                copyMessage.style.display = 'block';
+                setTimeout(() => {
+                    copyMessage.style.display = 'none';
+                }, 3000);
+                isCopyModeEnabled = false;
+                if (previousHighlight) {
+                    previousHighlight.style.background = '';
+                    previousHighlight.style.backgroundImage = '';
+                    previousHighlight.style.border = '';
+                    copyButton.style.display = 'none';
+                    previousHighlight = null;
+                }
+                console.log('Copy mode disabled');
+            });
+        }
+    });
+
     copyButton = createCopyButton();
+    copyMessage = createCopyMessage();
 })();