@jarvis-agent/core 0.2.1 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"build-dom-tree.d.ts","sourceRoot":"","sources":["../../../src/agent/browser/build-dom-tree.ts"],"names":[],"mappings":"AACA,wBAAgB,kBAAkB,SAoxBjC"}
1
+ {"version":3,"file":"build-dom-tree.d.ts","sourceRoot":"","sources":["../../../src/agent/browser/build-dom-tree.ts"],"names":[],"mappings":"AACA,wBAAgB,kBAAkB,SAksBjC"}
package/dist/index.cjs CHANGED
@@ -42557,30 +42557,19 @@ function run_build_dom_tree() {
42557
42557
  /**
42558
42558
  * Get clickable elements on the page
42559
42559
  *
42560
- * @param {*} markHighlightElements Is mark highlighted
42560
+ * @param {*} doHighlightElements Is highlighted
42561
42561
  * @param {*} includeAttributes [attr_names...]
42562
- * @returns { element_str, client_rect, selector_map, area_map }
42562
+ * @returns { element_str, selector_map }
42563
42563
  */
42564
- function get_clickable_elements(markHighlightElements = true, includeAttributes) {
42564
+ function get_clickable_elements(doHighlightElements = true, includeAttributes) {
42565
42565
  window.clickable_elements = {};
42566
42566
  computedStyleCache = new WeakMap();
42567
42567
  document.querySelectorAll("[eko-user-highlight-id]").forEach(ele => ele.removeAttribute("eko-user-highlight-id"));
42568
- let page_tree = build_dom_tree(markHighlightElements);
42568
+ let page_tree = build_dom_tree(doHighlightElements);
42569
42569
  let element_tree = parse_node(page_tree);
42570
+ let selector_map = create_selector_map(element_tree);
42570
42571
  let element_str = clickable_elements_to_string(element_tree, includeAttributes);
42571
- let client_rect = {
42572
- width: window.innerWidth || document.documentElement.clientWidth,
42573
- height: window.innerHeight || document.documentElement.clientHeight,
42574
- };
42575
- if (markHighlightElements) {
42576
- let selector_map = {};
42577
- // selector_map = create_selector_map(element_tree);
42578
- return { element_str, client_rect, selector_map };
42579
- }
42580
- else {
42581
- let area_map = create_area_map(element_tree);
42582
- return { element_str, client_rect, area_map };
42583
- }
42572
+ return { element_str, selector_map };
42584
42573
  }
42585
42574
  function get_highlight_element(highlightIndex) {
42586
42575
  let element = document.querySelector(`[eko-user-highlight-id="eko-highlight-${highlightIndex}"]`);
@@ -42679,13 +42668,12 @@ function run_build_dom_tree() {
42679
42668
  process_node(element_tree);
42680
42669
  return formatted_text.join('\n');
42681
42670
  }
42682
- function create_area_map(element_tree) {
42683
- let area_map = {};
42671
+ function create_selector_map(element_tree) {
42672
+ let selector_map = {};
42684
42673
  function process_node(node) {
42685
42674
  if (node.tagName) {
42686
42675
  if (node.highlightIndex != null) {
42687
- const element = window.clickable_elements[node.highlightIndex];
42688
- area_map[node.highlightIndex] = get_element_real_bounding_rect(element);
42676
+ selector_map[node.highlightIndex] = node;
42689
42677
  }
42690
42678
  for (let i = 0; i < node.children.length; i++) {
42691
42679
  process_node(node.children[i]);
@@ -42693,38 +42681,7 @@ function run_build_dom_tree() {
42693
42681
  }
42694
42682
  }
42695
42683
  process_node(element_tree);
42696
- return area_map;
42697
- }
42698
- function get_element_real_bounding_rect(element) {
42699
- if (!element || !(element instanceof Element)) {
42700
- return { x: 0, y: 0, width: 0, height: 0 };
42701
- }
42702
- let rect = element.getBoundingClientRect();
42703
- let x = rect.left;
42704
- let y = rect.top;
42705
- let width = rect.width;
42706
- let height = rect.height;
42707
- let win = element.ownerDocument.defaultView;
42708
- let maxDepth = 10;
42709
- let depth = 0;
42710
- while (win && win !== win.parent && depth < maxDepth) {
42711
- depth++;
42712
- const frameElement = win.frameElement;
42713
- if (!frameElement) {
42714
- break;
42715
- }
42716
- const frameRect = frameElement.getBoundingClientRect();
42717
- x += frameRect.left;
42718
- y += frameRect.top;
42719
- // Consider the border and padding of the iframe.
42720
- const frameStyle = getCachedComputedStyle(frameElement);
42721
- x += parseFloat(frameStyle.borderLeftWidth) || 0;
42722
- y += parseFloat(frameStyle.borderTopWidth) || 0;
42723
- x += parseFloat(frameStyle.paddingLeft) || 0;
42724
- y += parseFloat(frameStyle.paddingTop) || 0;
42725
- win = win.parent;
42726
- }
42727
- return { x, y, width, height };
42684
+ return selector_map;
42728
42685
  }
42729
42686
  function parse_node(node_data, parent) {
42730
42687
  if (!node_data) {
@@ -42764,9 +42721,8 @@ function run_build_dom_tree() {
42764
42721
  }
42765
42722
  return element_node;
42766
42723
  }
42767
- function build_dom_tree(markHighlightElements) {
42724
+ function build_dom_tree(doHighlightElements) {
42768
42725
  let highlightIndex = 0; // Reset highlight index
42769
- let duplicates = new Set();
42770
42726
  function highlightElement(element, index, parentIframe = null) {
42771
42727
  // Create or get highlight container
42772
42728
  let container = document.getElementById('eko-highlight-container');
@@ -42965,36 +42921,13 @@ function run_build_dom_tree() {
42965
42921
  interactiveRoles.has(ariaRole) ||
42966
42922
  (tabIndex !== null && tabIndex !== '-1') ||
42967
42923
  element.getAttribute('data-action') === 'a-dropdown-select' ||
42968
- element.getAttribute('data-action') === 'a-dropdown-button' ||
42969
- element.getAttribute('contenteditable') === 'true';
42924
+ element.getAttribute('data-action') === 'a-dropdown-button';
42970
42925
  if (hasInteractiveRole)
42971
42926
  return true;
42972
- // const eventTypes = [
42973
- // 'click',
42974
- // 'mousedown',
42975
- // 'mouseup',
42976
- // 'touchstart',
42977
- // 'touchend',
42978
- // 'keydown',
42979
- // 'keyup',
42980
- // 'focus',
42981
- // 'blur',
42982
- // ];
42983
- const clickEventTypes = [
42984
- 'click',
42985
- 'mousedown',
42986
- 'mouseup',
42987
- 'touchstart',
42988
- 'touchend',
42989
- ];
42990
- // Filter elements that have no real event listeners at all
42991
- if (window.getEventListeners) {
42992
- const listeners = window.getEventListeners(element);
42993
- const hasRealClickListeners = clickEventTypes.some((type) => listeners[type]?.length > 0);
42994
- if (!hasRealClickListeners) {
42995
- return false;
42996
- }
42997
- }
42927
+ // Get computed style
42928
+ const style = getCachedComputedStyle(element);
42929
+ // Check if element has click-like styling
42930
+ const hasClickStyling = style.cursor === 'pointer' || element.style.cursor === 'pointer';
42998
42931
  // Check for event listeners
42999
42932
  const hasClickHandler = element.onclick !== null ||
43000
42933
  element.getAttribute('onclick') !== null ||
@@ -43002,10 +42935,24 @@ function run_build_dom_tree() {
43002
42935
  element.hasAttribute('@click') ||
43003
42936
  element.hasAttribute('v-on:click');
43004
42937
  // Helper function to safely get event listeners
43005
- function getElementEventListeners(el) {
42938
+ function getEventListeners(el) {
42939
+ // if (window.getEventListeners) {
42940
+ // return window.getEventListeners?.(el) || {};
42941
+ // }
43006
42942
  // List of common event types to check
43007
42943
  const listeners = {};
43008
- for (const type of clickEventTypes) {
42944
+ const eventTypes = [
42945
+ 'click',
42946
+ 'mousedown',
42947
+ 'mouseup',
42948
+ 'touchstart',
42949
+ 'touchend',
42950
+ 'keydown',
42951
+ 'keyup',
42952
+ 'focus',
42953
+ 'blur',
42954
+ ];
42955
+ for (const type of eventTypes) {
43009
42956
  const handler = el[`on${type}`];
43010
42957
  if (handler) {
43011
42958
  listeners[type] = [
@@ -43019,34 +42966,30 @@ function run_build_dom_tree() {
43019
42966
  return listeners;
43020
42967
  }
43021
42968
  // Check for click-related events on the element itself
43022
- const listeners = getElementEventListeners(element);
43023
- const hasClickListeners = clickEventTypes.some((type) => listeners[type]?.length > 0);
42969
+ const listeners = getEventListeners(element);
42970
+ const hasClickListeners = listeners &&
42971
+ (listeners.click?.length > 0 ||
42972
+ listeners.mousedown?.length > 0 ||
42973
+ listeners.mouseup?.length > 0 ||
42974
+ listeners.touchstart?.length > 0 ||
42975
+ listeners.touchend?.length > 0);
43024
42976
  // Check for ARIA properties that suggest interactivity
43025
42977
  const hasAriaProps = element.hasAttribute('aria-expanded') ||
43026
42978
  element.hasAttribute('aria-pressed') ||
43027
42979
  element.hasAttribute('aria-selected') ||
43028
42980
  element.hasAttribute('aria-checked');
42981
+ // Check for form-related functionality
42982
+ element.form !== undefined ||
42983
+ element.hasAttribute('contenteditable') ||
42984
+ (style && style.userSelect !== 'none');
43029
42985
  // Check if element is draggable
43030
42986
  const isDraggable = element.draggable || element.getAttribute('draggable') === 'true';
43031
- if (hasAriaProps || hasClickHandler || hasClickListeners || isDraggable) {
43032
- return true;
43033
- }
43034
- // Check if element has click-like styling
43035
- let hasClickStyling = element.style.cursor === 'pointer' || getCachedComputedStyle(element).cursor === 'pointer';
43036
- if (hasClickStyling) {
43037
- let count = 0;
43038
- let current = element.parentElement;
43039
- while (current && current !== document.documentElement) {
43040
- hasClickStyling = current.style.cursor === 'pointer' || getCachedComputedStyle(current).cursor === 'pointer';
43041
- if (hasClickStyling)
43042
- return false;
43043
- current = current.parentElement;
43044
- if (++count > 10)
43045
- break;
43046
- }
43047
- return true;
43048
- }
43049
- return false;
42987
+ return (hasAriaProps ||
42988
+ hasClickStyling ||
42989
+ hasClickHandler ||
42990
+ hasClickListeners ||
42991
+ // isFormRelated ||
42992
+ isDraggable);
43050
42993
  }
43051
42994
  // Helper function to check if element is visible
43052
42995
  function isElementVisible(element) {
@@ -43076,14 +43019,11 @@ function run_build_dom_tree() {
43076
43019
  if (!topEl)
43077
43020
  return false;
43078
43021
  // Check if the element or any of its parents match our target element
43079
- let count = 0;
43080
43022
  let current = topEl;
43081
43023
  while (current && current !== shadowRoot) {
43082
43024
  if (current === element)
43083
43025
  return true;
43084
43026
  current = current.parentElement;
43085
- if (++count > 15)
43086
- break;
43087
43027
  }
43088
43028
  return false;
43089
43029
  }
@@ -43098,14 +43038,11 @@ function run_build_dom_tree() {
43098
43038
  const topEl = document.elementFromPoint(point.x, point.y);
43099
43039
  if (!topEl)
43100
43040
  return false;
43101
- let count = 0;
43102
43041
  let current = topEl;
43103
43042
  while (current && current !== document.documentElement) {
43104
43043
  if (current === element)
43105
43044
  return true;
43106
43045
  current = current.parentElement;
43107
- if (++count > 15)
43108
- break;
43109
43046
  }
43110
43047
  return false;
43111
43048
  }
@@ -43129,10 +43066,8 @@ function run_build_dom_tree() {
43129
43066
  }
43130
43067
  // Function to traverse the DOM and create nested JSON
43131
43068
  function buildDomTree(node, parentIframe = null) {
43132
- if (!node || duplicates.has(node)) {
43069
+ if (!node)
43133
43070
  return null;
43134
- }
43135
- duplicates.add(node);
43136
43071
  // Special case for text nodes
43137
43072
  if (node.nodeType === Node.TEXT_NODE) {
43138
43073
  const textContent = node.textContent.trim();
@@ -43177,7 +43112,7 @@ function run_build_dom_tree() {
43177
43112
  if (shouldHighlight) {
43178
43113
  nodeData.highlightIndex = highlightIndex++;
43179
43114
  window.clickable_elements[nodeData.highlightIndex] = node;
43180
- if (markHighlightElements) {
43115
+ if (doHighlightElements) {
43181
43116
  highlightElement(node, nodeData.highlightIndex, parentIframe);
43182
43117
  }
43183
43118
  }
@@ -43192,7 +43127,7 @@ function run_build_dom_tree() {
43192
43127
  }
43193
43128
  // Handle shadow DOM
43194
43129
  if (node.shadowRoot) {
43195
- const shadowChildren = Array.from(node.shadowRoot.children).map((child) => buildDomTree(child, parentIframe)).filter(child => child !== null);
43130
+ const shadowChildren = Array.from(node.shadowRoot.childNodes).map((child) => buildDomTree(child, parentIframe));
43196
43131
  nodeData.children.push(...shadowChildren);
43197
43132
  }
43198
43133
  // Handle iframes
@@ -43200,7 +43135,7 @@ function run_build_dom_tree() {
43200
43135
  try {
43201
43136
  const iframeDoc = node.contentDocument || node.contentWindow.document;
43202
43137
  if (iframeDoc) {
43203
- const iframeChildren = Array.from(iframeDoc.body.children).map((child) => buildDomTree(child, node)).filter(child => child !== null);
43138
+ const iframeChildren = Array.from(iframeDoc.body.childNodes).map((child) => buildDomTree(child, node));
43204
43139
  nodeData.children.push(...iframeChildren);
43205
43140
  }
43206
43141
  }
@@ -43209,9 +43144,8 @@ function run_build_dom_tree() {
43209
43144
  }
43210
43145
  }
43211
43146
  else {
43212
- const style = getCachedComputedStyle(node);
43213
- if (style && style.display !== 'none') {
43214
- const children = Array.from(node.children).map((child) => buildDomTree(child, parentIframe)).filter(child => child !== null);
43147
+ if (nodeData.isVisible != false) {
43148
+ const children = Array.from(node.childNodes).map((child) => buildDomTree(child, parentIframe));
43215
43149
  nodeData.children.push(...children);
43216
43150
  }
43217
43151
  }