49 lines
1.5 KiB
JavaScript
49 lines
1.5 KiB
JavaScript
// content.js - Listens for clicks and sends element attributes to local server
|
|
|
|
const SERVER_URL = "http://localhost:3000/record";
|
|
|
|
document.addEventListener("click", async (event) => {
|
|
let el = event.target;
|
|
|
|
// Walk up the DOM until we find a button, link, or element with aria-label
|
|
while (
|
|
el &&
|
|
el !== document.body &&
|
|
el.tagName.toLowerCase() !== "button" &&
|
|
el.tagName.toLowerCase() !== "a" &&
|
|
!el.getAttribute("aria-label")
|
|
) {
|
|
el = el.parentElement;
|
|
console.log("[Cypress Recorder] Walking up from:", el.tagName, el.className);
|
|
}
|
|
|
|
// Fall back to original target if nothing useful found
|
|
if (!el || el === document.body) el = event.target;
|
|
|
|
// ... rest stays the same
|
|
|
|
const payload = {
|
|
classes: Array.from(el.classList),
|
|
id: el.id || null,
|
|
ariaLabel: el.getAttribute("aria-label") || null,
|
|
tag: el.tagName.toLowerCase(),
|
|
text: el.innerText?.trim().slice(0, 100) || null, // bonus: visible text
|
|
};
|
|
|
|
console.log("[Cypress Recorder] Click captured:", payload);
|
|
|
|
try {
|
|
const response = await fetch(SERVER_URL, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(payload),
|
|
});
|
|
|
|
if (!response.ok) {
|
|
console.error("[Cypress Recorder] Server responded with:", response.status);
|
|
}
|
|
} catch (err) {
|
|
console.error("[Cypress Recorder] Could not reach local server:", err.message);
|
|
}
|
|
}, true); // useCapture: true so we catch clicks on all elements
|