Add --width/--height options to record command

Allow configuring the viewport for motus record by adding --width and --height CLI options (defaults 1024x768). The RecordCommand now accepts these options and uses their values when creating the recording page's ContextOptions.Viewport. Documentation updated to mention the configurable viewport and new flags in the options table.

Author: TorreyBetts

docs/guides/recording-and-codegen.md

@@ -10,7 +10,7 @@ Motus ships two CLI commands that eliminate the need to write browser test boile
 
 ### How it works
 
-1. **Browser launch.** A headed browser instance is launched (or an existing one is attached to via `--connect`). A new page is opened at the viewport size 1024x768.
+1. **Browser launch.** A headed browser instance is launched (or an existing one is attached to via `--connect`). A new page is opened at the configured viewport size (default 1024x768, adjustable with `--width` and `--height`).
 2. **Script injection.** The `ActionCaptureEngine` registers a DOM binding and injects the recorder script via `AddInitScript` so that the listener survives page navigations automatically. The script is also evaluated immediately on the current page if one is already loaded.
 3. **Event capture.** The `InputStateMachine` receives raw DOM events (mouse, keyboard, form changes) through the binding callback and the CDP session. Navigation events are captured via the `FrameNavigated` page event. Dialog open/close state is tracked across the `Dialog` page event and the `Page.javascriptDialogClosed` CDP event. File chooser activations are captured via the `FileChooser` page event.
 4. **Selector inference.** For actions that target a specific element (click, fill, select, check, file upload), the `SelectorInferenceEngine` resolves the element and walks registered selector strategies in priority order until it finds a selector that matches exactly one node in the DOM.
@@ -29,6 +29,8 @@ Motus ships two CLI commands that eliminate the need to write browser test boile
 | `--method-name` | `RecordedScenario` | Name of the generated test method |
 | `--namespace` | `Motus.Generated` | Namespace for the generated file |
 | `--preserve-timing` | `false` | Emit `Task.Delay` calls between actions matching the original timing gaps (gaps shorter than 250 ms are omitted) |
+| `--width` | `1024` | Viewport width in pixels |
+| `--height` | `768` | Viewport height in pixels |
 
 When `--connect` is not provided, the command always launches a headed browser regardless of any other flags. There is no `--headless` option for `motus record`.
 

src/Motus.Cli/Commands/RecordCommand.cs

@@ -18,6 +18,8 @@ public static Command Build()
         var methodNameOpt = new Option<string>("--method-name") { Description = "Generated test method name", DefaultValueFactory = _ => "RecordedScenario" };
         var namespaceOpt = new Option<string>("--namespace") { Description = "Generated test namespace", DefaultValueFactory = _ => "Motus.Generated" };
         var preserveTimingOpt = new Option<bool>("--preserve-timing") { Description = "Emit delays between actions matching the original user timing" };
+        var widthOpt = new Option<int>("--width") { Description = "Viewport width in pixels", DefaultValueFactory = _ => 1024 };
+        var heightOpt = new Option<int>("--height") { Description = "Viewport height in pixels", DefaultValueFactory = _ => 768 };
 
         var cmd = new Command("record", "Record browser interactions and generate test code")
         {
@@ -30,6 +32,8 @@ public static Command Build()
             methodNameOpt,
             namespaceOpt,
             preserveTimingOpt,
+            widthOpt,
+            heightOpt,
         };
 
         cmd.SetAction(async (parseResult, ct) =>
@@ -42,6 +46,8 @@ public static Command Build()
             var methodName = parseResult.GetValue(methodNameOpt)!;
             var ns = parseResult.GetValue(namespaceOpt)!;
             var preserveTiming = parseResult.GetValue(preserveTimingOpt);
+            var width = parseResult.GetValue(widthOpt);
+            var height = parseResult.GetValue(heightOpt);
 
             IBrowser browser;
             if (connect is not null)
@@ -63,7 +69,7 @@ public static Command Build()
             {
                 var page = await browser.NewPageAsync(new ContextOptions
                 {
-                    Viewport = new ViewportSize(1024, 768),
+                    Viewport = new ViewportSize(width, height),
                 });
                 var engine = new ActionCaptureEngine();
                 await engine.StartAsync(page, ct);