{"record":{"id":"3f459ff86fc4a1a4","repo":"pbakaus/impeccable","slug":"error-viewport-requires-a-wxh-value-e-g-vie","errorCode":null,"errorMessage":"Error: --viewport requires a WxH value, e.g. --viewport 390x844\n","messagePattern":"Error: --viewport requires a WxH value, e\\.g\\. --viewport 390x844\n","errorType":"validation","errorClass":null,"httpStatus":null,"severity":"error","filePath":"crates/detect/src/cli.rs","lineNumber":477,"sourceCode":"                args.remove(i);\n            }\n        }\n    }\n    let mut viewport: Option<(u32, u32)> = None;\n    let mut i = 0;\n    while i < args.len() {\n        let inline = args[i].starts_with(\"--viewport=\");\n        if args[i] != \"--viewport\" && !inline {\n            i += 1;\n            continue;\n        }\n        let value: String = if inline {\n            args[i][\"--viewport=\".len()..].to_string()\n        } else {\n            args.get(i + 1).cloned().unwrap_or_default()\n        };\n        let Some(m) = VIEWPORT_RE.captures(&value) else {\n            io.err(\"Error: --viewport requires a WxH value, e.g. --viewport 390x844\\n\");\n            return Err(Exit(1));\n        };\n        viewport = Some((m[1].parse().unwrap_or(0), m[2].parse().unwrap_or(0)));\n        let n = if inline { 1 } else { 2 };\n        for _ in 0..n {\n            if i < args.len() {\n                args.remove(i);\n            }\n        }\n    }\n    let valid = rule_scopes();\n    let unknown: Vec<&String> = scopes\n        .iter()\n        .filter(|s| !valid.contains(&s.as_str()))\n        .collect();\n    if !unknown.is_empty() {\n        let list: Vec<&str> = unknown.iter().map(|s| s.as_str()).collect();\n        io.err(&format!(","sourceCodeStart":459,"sourceCodeEnd":495,"githubUrl":"https://github.com/pbakaus/impeccable/blob/2bc2879276c1f321a53c4ca99d3371e411329b52/crates/detect/src/cli.rs#L459-L495","documentation":"The detect CLI validates the `--viewport` flag against a WxH regex (VIEWPORT_RE) and exits with code 1 if the value doesn't match, printing an example of the expected format. Viewport-scoped detection needs numeric width x height in pixels, so anything else is rejected before scanning starts.","triggerScenarios":"Running `impeccable detect --viewport` without a value, or with a value that doesn't match `<number>x<number>`, e.g. `--viewport 390`, `--viewport 390X844` (capital X, if the regex is lowercase-only), `--viewport mobile`, or `--viewport=390-844`.","commonSituations":"Using device names instead of dimensions; pasting viewport strings with units (`390px x 844px`); shell quoting dropping the value; scripts where the WxH string is built with the wrong separator character.","solutions":["Pass dimensions as WxH with a lowercase x, e.g. `--viewport 390x844` or `--viewport 1280x800`.","If the value comes from a variable, ensure it's formatted `\"${W}x${H}\"` with plain integers and no units.","Quote the flag pair in scripts (`--viewport \"$V\"`) so the value isn't consumed as a separate positional argument."],"exampleFix":"// before\nimpeccable detect src/ --viewport 390px-844px\n// after\nimpeccable detect src/ --viewport 390x844","handlingStrategy":"validation","validationCode":"const m = /^(\\d+)x(\\d+)$/.exec(viewport ?? \"\");\nif (!m) throw new Error(`--viewport must be WxH, got: ${viewport}`);","typeGuard":"const isViewport = (v) => /^\\d+x\\d+$/.test(v);","tryCatchPattern":null,"preventionTips":["Store viewports as {w, h} objects and format `${w}x${h}` at call time","Never pass device names or px units to --viewport","Unit-test script argument builders for the WxH format"],"tags":["cli","flags","validation","viewport","format"],"backgroundTag":"invalid-flag-value","analyzedSha":"2bc2879276c1f321a53c4ca99d3371e411329b52","analyzedAt":"2026-09-08T04:51:14.109Z","contentChangedAt":"2026-09-08T04:51:14.109Z","schemaVersion":2},"datasetVersion":"2026-09-14T00:17:10.932Z"}