Working on a page that is running.

The workbench opens your development server in a cross-origin frame and talks to the SDK inside it. Everything below happens against the real page, at a real viewport, with your own data on screen.

Three modes

Browse leaves the application interactive: its own clicks, its own menus, its own scrolling.

Select stops the application receiving clicks and hands them to the workbench instead. Shift-click adds a second target. Arrow keys walk parent, child and sibling.

Draw opens notes, arrows, rectangles, ellipses, highlights and freehand. Draw on page switches from the selected element to document coordinates.

Escape cancels the current gesture and returns to browsing. Entering review, snapshots or a screen capture returns the preview to browsing on its own, and leaving them does not put the tool back on.

What an element says about itself

The outline under the pointer carries the element’s name and, when the manifest reaches it, how many controls do. It leaves with the pointer.

An element with no controls of its own is not an empty panel: the inspector says so, then offers the ancestors that do have controls and the other instrumented elements of the page, each with its count. Choosing one selects and reveals it.

A target’s state is shown in words: Not instrumented, Missing on this page, Several matches. Reattach is offered only for the last two, which are the ones a person can repair. Uninstrumented elements can still be selected and commented on, but their reference is provisional and has to be reattached after a reload.

A section of controls is named after its group, and how far it reaches is a badge beside that name, reading Global, Page, All instances or From Story card, dropped once several sections on screen agree on it.

Comments and marks

Choose Comment on selection, or press C. Numbered bubbles reopen a comment without changing the current preview size, and the number is assigned once and never reused, so removing one comment does not renumber the ones already named in conversation.

Drag a mark’s endpoint to edit it. The hit radius stays 16 display pixels, or 22 for touch, independently of the preview’s zoom. Only the open comment’s marks can be grabbed: the others are drawn faintly and ignore the pointer.

Page marks keep document coordinates and their original viewport. Element marks use fractions of the target’s live box, so they follow nested scroll and responsive layout. The original screenshot and its context stay in the ticket.

Size and zoom

The workspace opens at the available width and 100% zoom. The size menu changes the preview’s real viewport, independently from display zoom, which runs 50, 75, 100, 150 and 200% plus Fit width. A preset wider than the stage switches to Fit width and says what it is fitted to.

Review

Review changes is quiet and empty-handed while there is nothing to send, and carries a count otherwise, split into controls and comments.

Every change shows before and after, a swatch for a color and the unit for a number, and every comment shows its page, its main target, how many marks it carries and its last capture. A change already carried by the previous batch is labelled Already sent.

Dropping a control puts its source value back into the batch’s values and takes it out of changes, so the file never asks for something the values beside it contradict. Later edits are a new draft.

Captures

HTML captures are lazy DOM reconstructions. They can omit external assets, media, canvas content or effects, and they are labelled accordingly. A failed capture preserves the ticket.

Capture screen uses the browser’s display-sharing permission. The stream stops as soon as a frame is acquired. You preview and crop that frame before saving it, with a rectangle you can drag whole or by any of its eight grips, arrow keys to nudge it, and the exact percentages behind a fold. Declining leaves existing feedback intact.

When the preview does not answer

The SDK announces itself as soon as its listeners are installed, and the workspace answers with a greeting that opens the session. Until that reply the SDK does nothing: no overlay, no listener, and the application’s own clicks pass through.

If eight seconds pass with no answer, the workspace names the three causes in the order they usually are: the development server is not answering at the manifest’s origin, the page does not load the SDK or its integration does not accept this workbench’s origin, or framing is refused by frame-ancestors or X-Frame-Options.

An announcement heard changes that answer, because it proves the page is reachable, the SDK is loaded and the frame is allowed. So an announcement with no ready state two seconds later is reported on its own.

While the preview has not answered, the selection tool, the drawing palette and the controls are inert and not just dimmed, review is refused, and a veil over the preview carries the status. Reconnecting resends the current mode, targets and values, so a preview that reloads comes back where it was.

When your source moves

Applied choices stop being overrides once the source carries them. Pending choices survive an unchanged source value. Divergent values and removed controls stay visible so they can be resolved instead of being silently dropped. Snapshots from another source revision keep their names but cannot be applied blindly to the new code.

Reopening a ticket prepares another round: it leaves its batch and drops the answer that batch received, so the next batch never tells the agent it has already dealt with a request it has not seen. The batch and the response on disk are untouched.