diff --git a/scripts/content.js b/scripts/content.js
index aa9f0cc..a4c624e 100644
--- a/scripts/content.js
+++ b/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 = '已拷贝! x ';
+ 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();
})();