Google Chrome Developer tools

Use

The Chrome Developer Tools foris AIQa Troubleshootingdebugging

Usetool built into Google Chrome Browser. The DevTools provide the user deep access into the internals of the browser and their web application.

Accessing the DevTools:

To access the DevTools, open a web page or web app in Google Chrome. Either:

The DevTools window will open at the bottom of your Chrome browser.

Inspecting the DOM:

The Elemets panel lets you see everything in one DOM tree, and allows inspection of DOM elements. You will often visit the Elements tabs when you need to identify the HTML snippet for some aspect of the page.

DOM:

The DOM tree view displays the DOM structure of the current web page. The DOM tree is a tree of DOM nodes that represent individual HTML elements, such as <body> and <p>. For ease of reading, the DOM tree view displays the HTML element tags instead of the DOM node types: for example, <p> instead ofHTMLParagraphElement.

Inspecting elements:
There are several ways to inspect applicationan behaviorelement:
• duringRight-click troubleshooting,any but relyelement on AIQthe executionpage outputthe page and logsselect Inspect Element.
• Click the Inspect Element button at the top of the DevTools window to go into Inspect Element Mode, then click an element.

Working with the Console:
The JavaScript Console provides two primary functions for repeatablethe testuser evidence.

Recommendedweb guidance

• Use DevTools for local diagnosis of network, console, DOM,pages and performanceapplications. symptoms.
• DoIt notis requirea manualplace DevToolsto:
  • stepsLog fordiagnostic automatedinformation Scenarioin Editorthe execution.
• Avoiddevelopment capturingprocess.
  • secrets,A tokens,shell orprompt personalwhich datacan frombe used to interact with the document and DevTools.
  You may log diagnostic information using methods provided by the Console API. Such as console.log()

  Network:

  The Network panel provides insights into resources that are requested and downloaded over the network traces.

• Translatein findingsreal intotime. stableIdentifying locators,and waits,addressing validations,those orrequests environmenttaking fixes.

Validationthan workflow

1. Reproduceis thean issueessential step in aoptimizing controlledyour browserpage. session.
2. Inspect
   console,

   ---

   network,

   Last DOM,updated: orJune performance26, signals2023

   as

   If needed.

3. Updateyou thehave AIQany scenario or environment basedfeedback on confirmedthis findings.
4. Validatetopic, theplease fixcontact withus aat fresh AIQ execution.

Last updated: September 20, 2026documentation@appvance.ai