Test manager UI overview

This page provides a general description of the Eyes Test Manager GUI and its main elements. You will find that many of the pages and editors have a common look and feel, and this page summarizes the basic controls and tools that you will find on many of the pages.

The page navigator

This control is used to navigate between the main pages of the Test manager, and shows the name of the current page. See The page navigator for more information.

The branch selector

You will find this control on pages that show branch specific information. The branch selector is used to select and display the current branch. When you change the current branch, it will apply to all pages that have a branch navigator. See Selecting a branch on a page for more information.

Tables and grids in the Test manager display

The information on many pages is organized into tables, with rows displaying information such as test results, steps in a test, or other entities. Tables usually have columns that display various attributes of the entities. Other pages, for example the Test results batch step view, display many entities (e.g. step thumbnails) in a grid.

Eyes Test Manager provides various tools that allow you to control which information is shown, and how it is shown:

Navigating large amounts of information

When Test manager displays information such as test results, steps, and baselines, it will only show up to 1000 entities at a time in order that the browser will respond in a reasonable amount of time. When more information is available, Test manager provides pagination buttons that allow you to browse the rest of the entities.

Most Test Manager operations, such as deleting, assigning, or accepting selected tests results, apply to the information that is currently displayed. When you use the Filter to view only data that meets the selected criteria, Eyes will search all the existing information, and will then display the first 1000 entities that match.

Sort rows by column type

When data is presented in rows with columns of information, you can sort the rows by any column by clicking on the header of that column. Each click will toggle the current order. The sort is only done on the information currently loaded in the browser.

Filter control

Many pages that display information allow you to filter the data so that you can view only the data that meets specific criteria. After you click the button, Eyes Test Manager displays various categories and allows you to select one or more required values for each category. When you click Apply,Eyes Test Manager searches all of the data and displays only the data that matches one of the selected values in each of the selected categories.

The filter is applied to all of the data available to Eyes, not just the currently visible entities. The updated table is filled with the filtered entities up to the maximum number of rows, and then you can use the pagination buttons to see other entities.

The set of criteria available for you to choose from depends on the information displayed on the page.

Group by control

Some pages that display information provide a "group by" control . This allows you to organize the information hierarchically, based on various criteria. For example, you can show test results grouped by the browser, and then for each browser, group test results by operating system.

To define grouping click on to open a dialog with all the groups defined for the current page in the available group column on the left. Click on one or more groups to select them, and then click on to transfer the selected attributes to the Active group column on the right. You can select and transfer as many groups as are available, to form a hierarchy of criteria. Click on to remove a group from the active group. Use the and buttons to change the order of the groups in the active groups column. After you click the Confirm button the information on the page will be updated, and the information on the page will be ordered to reflect your selected group hierarchy. The grouping is only done on the information currently loaded in the browser. If the table has a pagination control then additional information may be found by paging forwards or backwards using the control.

To the left of each group, there are toggle controls that allow you to expand and collapse that group, and at the top of the pane there are controls that display the current grouping and allow you expand or collapse all the groups and to remove the grouping. At the start of each row is a checkbox used to select/deselect that row for some operation. When you click a row which is a node in the tree you select/deselect all the items in that group.

Page refresh

This button appears on various pages where the information displayed may become out of date as test runs in the background and more information, such as test results, becomes available. The button is animated when more information is available. Clicking on the button refreshes the screen and the latest information is displayed.

Select/Deselect all visible rows

On pages that display rows of data, this button allows you to select or deselect all the visible rows. Click on the checkbox to toggle the current state. Click on the triangle menu icon to choose between selecting all of the visible items or selecting none of them.

For example, on many pages this feature can be used together with the Delete selected itemsbutton (see below) to delete all selected rows.

This button is often used together with the filter tool, to select or deselect rows that have some required attributes.
  1. To select rows with required attributes, use the filter to set the appropriate attributes, and then select the "All" option from the menu.
  2. To select all rows apart from those with the required attributes, first choose the "All" option from the menu, then apply the appropriate filter, then choose "None" from the menu, and finally turn the filter off.

Usually, the items being selected also have a checkbox and you can use that to fine tune which items are selected.

Delete selected items

On many pages, you can select items and then click on this button to delete them. Depending on the page you may, or may not get a warning dialog before the information is deleted.

The step thumbnail

You will find this control on several pages and views. A small thumbnail is displayed of either the baseline image or the captured image and sometimes other information. Other features are also available when you hover over a thumbnail:

  1. A dialog is displayed to the right of the image that provides additional information.
  2. A button bar is displayed below the image that offers various features including a menu button .
  3. You can enlarge the image by clicking on it. This will open a viewer or editor that allows you to zoom in on parts of the image and access other page-specific functionality.

Step timeline control

This control is available in various editors that give you access to the steps of a test or baseline. The playback control provides a way to navigate between the steps of a test, and to play them back as an animation. See Step navigator control for more information.

Select visible layer control

This control is available in several viewers and editors, and allows you to control what information is overlaid on the baseline or captured image. You can choose whether to view differences, remarks and issues, regions, and viewport borders. See Test editor select visible layer for more information.

Editor image zoom level

This control is available in several viewers and editors, and allows you to control the zoom level of the baseline or captured image. See Test editor zoom controls for more information.