UI and Navigation Behavior

Understand themes, notifications, navigation patterns, and shared UI behavior across the portal.

UI and Navigation Behavior

Use this page to understand how the portal behaves across navigation, notifications, errors, and themes.

Light and dark mode

The portal supports both light and dark themes.

Click the sun or moon icon in the top navigation bar to switch themes.

Your preference is saved in browser local storage.

It persists across sessions and page refreshes.

Toast notifications

The portal uses toast notifications to show the outcome of actions.

Toasts appear near the bottom center of the screen.

They disappear automatically.

You do not need to dismiss them.

Toast type	What it signals	Example
Success	The action completed successfully.	File deleted. or Note saved.
Error	The action failed, usually because of a server or network issue.	Failed to load sessions. or Download failed.
Warning	The action cannot continue because a required step is missing.	Please select OS, browser, version and resolution.

Loading states

When the portal fetches data from the backend, it shows a centered spinner in the main content area.

The spinner includes a descriptive label such as Loading Sessions or Loading session details.

This prevents partial UI states from appearing while data is still loading.

Breadcrumbs

Every page shows a breadcrumb trail at the top of the main content area.

Each segment is clickable and takes you back up the navigation hierarchy.

The last segment represents the current page.

It appears as plain text, not a link.

Example:

Interactive → Sessions → Session Summary

Selecting Sessions returns you to the sessions list for the same platform.

Table behavior

The portal uses different table behaviors depending on the page:

• Session lists use server-side pagination.

• Smaller lists such as files use client-side pagination.

• Clicking a row in the Sessions table opens Session Details in a new browser tab.

• Clicking a row in the Files table opens the File Detail Panel inline.

• Column resizing is not currently supported.

Opening session rows in a new tab makes it easier to compare multiple sessions without losing the list.

Sidebar collapse

Click the collapse arrow at the bottom of the sidebar to switch to icon-only mode.

In this mode, only icons remain visible.

Hover over an icon to see its label in a tooltip.

Click the expand arrow to restore full labels.

This setting persists for the current session.

It resets on page reload.

External links

Dashboard and Test Case Repository in the sidebar are external links.

They open in a new browser tab.

They do not navigate within the Testing Portal.

These links point to other Mozark products in the broader quality management suite.