Mirror (Real-Time Preview)

Mirror is a browser-based environment that simulates supported clients. It reads the current editor configuration directly and does not require compilation or packaging, making it useful for checking pages, data, and interactions before publishing.

Open Mirror

You can start from the project home page or a specific page:

1. Click Mirror in the upper-right corner of the editor to start from the home page.
2. To start from another page, select it on the canvas and click Mirror in the page toolbar.
3. In the bottom toolbar, select the client environment and device size, or enter a custom resolution.

Set initialization data

Use Initialize config to provide the data required when the page starts. Available settings depend on the selected page and may include:

• Page inputs
• Path parameters
• Query parameters
• Client variables
• Mock data

After changing the initialization settings, reload Mirror to initialize the page with the new values.

Simulate a user

Click Simulate login, then select or create a test user. Switching users lets you verify the page with different authentication states, user data, and role permissions.

When simulating users, check that:

• The page reads the expected current user data
• Data sources respect the user’s permissions
• Each role sees the correct content
• Actions and Actionflows use the correct user context

Debug a page

Click the wrench icon to enter Debug Mode, then select a component to inspect its current data state. Use this together with initialization settings and simulated users to verify:

• Data-binding results
• Page parameters and client variables
• Conditional visibility
• Component state before and after an interaction
• Page results on success, failure, and with empty data

If you change a parameter, variable, or test user, reload Mirror before checking the result again.

Mirror vs. preview

Preview in the publishing flow packages the client into a test build you can use in a real environment. How the two differ:

If Mirror differs from the real client, first check that the initialization data, simulated user, and client environment match. For device capabilities or client-specific behavior, trust the preview.