Pre-Action
To see the page before the action occurred, you use the Browser Playback tool’s Pre-Action Browser Contents tab. For example, here is the Browser Playback tool showing what the web page looked like before the Click "Athletic" action —an action that mimics a user narrowing search results to include only athletic shoes.
You can see the HTML for a given element by right-clicking that element, then choosing Inspect <Element> from the shortcut menu.
Post-Action
To see the page after the action occurred, you use the Browser Contents Viewer tool. For example, here is the Browser Contents Viewer tool showing what the same web page looked like after the Click "Athletic" action.
Colored Borders
Note that various colored borders are used to highlight elements that are the source of operations such as extractions, validations, user actions, etc.
The following table explains what each colored border indicates.
| Color | Marks the source of |
|---|---|
| Blue | User actions |
| Red | Validations |
| Gray | Data bank extractions |
| Green | Wait conditions |
| Purple | Validations + databank extractions |
