fetch node labels via script execution (#93225)

x-pack/test/functional/page_objects/graph_page.ts

@@ -26,6 +26,7 @@ export function GraphPageProvider({ getService, getPageObjects }: FtrProviderCon
  const testSubjects = getService('testSubjects');
  const PageObjects = getPageObjects(['common', 'header']);
  const retry = getService('retry');
+ const browser = getService('browser');
 
  class GraphPage {
  async selectIndexPattern(pattern: string) {
@@ -124,9 +125,12 @@ export function GraphPageProvider({ getService, getPageObjects }: FtrProviderCon
 
  async getGraphObjects() {
  await this.stopLayout();
- const graphElements = await find.allByCssSelector(
- '#graphSvg line, #graphSvg circle, #graphSvg text.gphNode__label'
- );
+ // read node labels directly from DOM because getVisibleText is not reliable for the way the graph is rendered
+ const nodeNames: string[] = await browser.execute(`
+ const elements = document.querySelectorAll('#graphSvg text.gphNode__label');
+ return [...elements].map(element => element.innerHTML);
+ `);
+ const graphElements = await find.allByCssSelector('#graphSvg line, #graphSvg circle');
  const nodes: Node[] = [];
  const nodePositionMap: Record<string, number> = {};
  const edges: Edge[] = [];
@@ -136,15 +140,10 @@ export function GraphPageProvider({ getService, getPageObjects }: FtrProviderCon
  const tagName: string = await element.getTagName();
  // check the position of the circle element
  if (tagName === 'circle') {
- nodes.push({ circle: element, label: '' });
+ nodes.push({ circle: element, label: nodeNames[nodes.length] });
  const position = await this.getCirclePosition(element);
  nodePositionMap[position] = nodes.length - 1;
  }
- // get the label for the node from the text element
- if (tagName === 'text') {
- const text = await element.getVisibleText();
- nodes[nodes.length - 1].label = text;
- }
  }
 
  // find all edges