Browser Application and Locator Spy Usage

To enable convenient record/replay, Silk Performer provides its own Browser Application. The application offers the following main parts:

The following image shows the most important elements of the Browser Application.

Note: Tracking of UI elements must be enabled before you can select a DOM object. When tracking is enabled, a green rectangle appears around UI elements as your cursor passes over them. Click Enable Tracking if tracking is not currently enabled.

Record/Replay Window

This window displays logging information during both record and replay. It allows you to start/stop and pause/resume recording during record mode and to pause/resume replay during replay mode.

Browser Navigation Bar

The bar enables standard browser navigation.

Highlighted DOM Element

When you move your mouse over a web page, the DOM elements under the cursor are being highlighted in green. The green rectangles help you to get a feeling for the architecture of the web page and its DOM hierarchy.

Inspected DOM Element

Pressing Pause/Break triggers the following actions:

  • The highlighted DOM element becomes the inspected DOM element.
  • The position of the inspected DOM element is indicated by blue highlighting.
  • The DOM hierarchy tree of the current page is determined and displayed in the Locator Spy by the HTML tags of the DOM elements.
  • The path to the inspected DOM element is expanded and the inspected DOM element is selected.
  • The attributes of the inspected DOM element are displayed.
  • The locator for the inspected DOM element is determined and displayed in the Locator field.

To search within the Locator Spy, press Ctrl+F on your keyboard. Alternatively, select Actions > Find in DOM Tree. You can search for strings within Tags, Property names, or Property values.

To change the inspected DOM element, press Pause/Break on any highlighted DOM element or select another DOM element within the DOM hierarchy tree.

When you select another DOM element in the DOM hierarchy tree, the locator for the DOM element is determined and displayed next to its HTML tag. The locator field is updated and the DOM element is highlighted in blue.

When a page’s DOM becomes invalid after pressing Pause/Break and the locator for the newly selected DOM element can not be found, a red border is displayed around the locator field. Press Pause/Break to refresh the hierarchy tree and to highlight the current DOM object. Locator strings in the DOM hierarchy tree are also removed as they are now invalid.

Locator Field

The locator field shows the locator string of the currently inspected DOM element. Whenever the inspected DOM element changes, the locator string is updated.

The locator field can be used to copy a locator string to another location, for example to a BDL script. Or you can use the field to manually edit locator strings. When you edit a locator, it is automatically being validated. If the locator is invalid, it is highlighted in red. If the locator is valid, it is highlighted in green.

If you want to add a verification during a try script run, pause the replay and click Add Verification. Adding verifications during a try script run works exactly as during recording.

In the right window of the Locator Spy, you can right-click a property and copy the property name, the property value, or both to the clipboard. If you copy both, the string will be saved in the form @name='value'. A real-world example is @hideFocus='false'. This way, you can conveniently exchange properties in the locator field.

Attributes of Inspected DOM Element

This is a list of attributes (name/value pairs) belonging to the currently inspected DOM element. If the current locator string does not fit your needs, you can manually build a specific locator string using some of the listed attributes.