Skip to main content
Use device presets when a flow should look and behave correctly on more than one viewport or device profile: phone, tablet, and desktop, or light versus dark mode.

​
When to create a responsiveness check

  • Marketing and product pages that rearrange at breakpoints
  • Checkout or forms that change layout on small screens
  • Features that behave differently with dark mode, forced colors, or reduced motion
Create a device preset for each target (for example “iPhone 14”, “Galaxy Tab”, “Desktop Chrome”), then either:
  1. Separate test plans — one plan per preset for scheduled or CI runs, or
  2. Per-run override — pass devicePresetShortId on the Start Run API without duplicating plans
The GitHub App can also pick a preset from PR content when a change mentions responsive design.

​
Where to configure details

Viewport size, user agent, geolocation, locale, custom headers, and accessibility emulation live on the Device Presets page. This use case page is only about when to add those presets to your suite.