Configure page interaction

Configuration for page interactions can be found under your Trakr project settings. Here you will be able to configure a number of page interaction “sets”.

A set of page interactions

Page interaction set

A set of page interaction has 3 parts:

  • URI – This comes from the list of URIs you have in the project. It targets the interactions in this set to that specific URI.
  • Event – The type of interaction you wish to trigger. Currently, Trakr only supports “click” and “wait” events. We look to add more event types such as a keypress, typing (keyboard assignments) and others.
  • CSS Selector – The target page element to trigger the event. You can use any valid CSS Selectors to target an element. In the case of the “wait” event, the value of the selector is the number of milliseconds to wait.

Interaction sets for the same URI

You can create multiple interaction sets for the same URI. This can useful if you want to take screenshots of the same page with different events triggered.

Order of events

If you are adding multiple event/selector pairs in your page interaction set, be mindful of the ordering of the events. Trakr will attempt to interact with the page in the order defined within each page interaction set. This means if your interactions have dependencies (e.g. switch to a tab before expanding a fieldset), you should configure them in the correct order.

Order interaction

Additionally, it is a good idea to add a small wait time (200 to 1000 ms) after an interaction if there are UI transition effects, etc for that interaction.

CSS Selectors

Finding the correct CSS selectors sometimes can be tricky. It’s possible to use web browser extensions such as Unique CSS Selector finder on Chrome.

The most robust method to test the CSS selector is to use the web browser console and javascript function such as “document.querySelector”

browser console