Test Manager UI overview

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

Navigating between Eyes Test Manager pages

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

Selecting a baseline branch

You will find the Baseline branch selector 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, and baselines.

Some tables have columns that display various attributes of the entities being displayed. 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:

Changing the visible columns of a table

In tables where there are many attributes, by default, not all of the attribute columns are shown. You can control which columns are displayed and which are hidden, as well as the order of columns from left to right, by using the Table customization tool.

When you click the Table customization button, a dialog opens showing all of the available columns. The currently visible columns are selected.

You can display a hidden column (e.g. Options above) by selecting the check box, and you can hide a column by deselecting the checkbox. The displayed table display updates as you do this.

The order of the columns in the table from left to right reflects the order of the items in the dialog from top to bottom. Drag the Move button of an attribute to change its position in the list. When you move an attribute to a new position in the list, the table columns are updated and the selected column appears in its new position in the table.

Clicking the Restore default button returns the table to its default state.

Click the to close the dialog.

Navigating large amounts of table information

When the Test Manager has many rows of information it will only show up to 1000 entities at a time. When more information is available, the 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.

Sorting table 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.

Filtering table rows

Many pages that display information allow you to filter the data so that you can view only the data that meets specific criteria. The criteria available for you to choose from depends on the information displayed on the page.

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 all 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.

Grouping table rows by column type

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 browser, and then for each browser you can 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.

Select/Deselect all visible table rows

On pages that display tables with rows of data, this button allows you to select or deselect all of 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, choose the "All" option from the menu, apply the appropriate filter, 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 items are deleted.

The step thumbnail

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

  1. A dialog is displayed to the right of the image that provides additional information.
  2. A menu bar is displayed below the image that offers various features including a menu button .
  3. You can enlarge the thumbnail 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.

Refresh a page

This button appears on various pages where the information displayed may become out of date as tests run 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.

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 it allows you to control what information is overlaid on the baseline or checkpoint 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 it allows you to control the zoom level of the baseline or checkpoint image. See Test editor zoom controls for more information.