68 lines
2.3 KiB
JavaScript
68 lines
2.3 KiB
JavaScript
function processElement(element) {
|
|
const rect = element.getBoundingClientRect();
|
|
if (!element.offsetParent && element !== document.body) return null;
|
|
if (rect.width === 0 || rect.height === 0) return null;
|
|
|
|
const viewportWidth = window.innerWidth;
|
|
const viewportHeight = window.innerHeight;
|
|
if (rect.bottom < 0 || rect.top > viewportHeight ||
|
|
rect.right < 0 || rect.left > viewportWidth) {
|
|
return null;
|
|
}
|
|
|
|
const styles = window.getComputedStyle(element);
|
|
|
|
const text = Array.from(element.childNodes)
|
|
.filter(node => node.nodeType === Node.TEXT_NODE)
|
|
.map(node => node.textContent.trim())
|
|
.join(' ');
|
|
|
|
const interactions = [];
|
|
if (element.tagName === 'BUTTON' || element.tagName === 'A' ||
|
|
element.getAttribute('role') === 'button' ||
|
|
element.getAttribute('onclick') ||
|
|
styles.cursor === 'pointer') {
|
|
interactions.push('click');
|
|
}
|
|
|
|
if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA' ||
|
|
element.getAttribute('contenteditable') === 'true') {
|
|
interactions.push('text_input');
|
|
const placeholder = element.getAttribute('placeholder');
|
|
if (placeholder) interactions.push('placeholder:' + placeholder);
|
|
}
|
|
|
|
if (element.tagName === 'SELECT' ||
|
|
element.getAttribute('role') === 'listbox' ||
|
|
element.getAttribute('type') === 'checkbox' ||
|
|
element.getAttribute('type') === 'radio') {
|
|
interactions.push('select');
|
|
}
|
|
|
|
if (element.scrollHeight > element.clientHeight ||
|
|
element.scrollWidth > element.clientWidth) {
|
|
interactions.push('scroll');
|
|
}
|
|
|
|
const children = Array.from(element.children)
|
|
.map(child => processElement(child))
|
|
.filter(child => child !== null);
|
|
|
|
return {
|
|
tag: element.tagName.toLowerCase(),
|
|
text,
|
|
location: {x: Math.round(rect.left), y: Math.round(rect.top)},
|
|
size: {width: Math.round(rect.width), height: Math.round(rect.height)},
|
|
interactions,
|
|
children
|
|
};
|
|
}
|
|
|
|
function analyzePageContent() {
|
|
const body = document.body;
|
|
return {
|
|
viewport: getViewportInfo(),
|
|
content: body ? processElement(body) : null
|
|
};
|
|
}
|