[Feature]: Snapshots: Display Pressed Keys for keyboard.press Actions

[midleman]

🚀 Feature Request

Add more context to the keyboard.press action in the snapshots view by displaying the specific button being pressed in orange text (similar to how other snapshot actions are displayed).

Example

Currently, when reviewing traces in the snapshots view, users need to inspect the Call section to determine what button was pressed during a keyboard.press action. With this feature, the specific button (e.g., “Enter,” “Tab,” “Ctrl+P”) would be shown directly in the snapshot step, in orange text, similar to how other snapshot actions are displayed.

For instance:

• Before: The snapshot step shows keyboard.press without additional context.
• After: The snapshot step shows keyboard.press (Enter) or keyboard.press (Tab) directly in the list of steps.

Motivation

This feature improves trace readability and efficiency, especially for traces with numerous keystrokes. Currently, users need to dig into the Call section to identify the specific button being pressed, which interrupts the debugging flow and can be cumbersome for complex traces. By displaying the button context in the snapshot step, users can more quickly and easily understand the sequence of actions, leading to a smoother debugging experience.

This addition aligns with the existing design pattern of exposing contextual information for other actions in orange text, making the snapshots view more consistent and intuitive.