Set Browser, Device and Viewport

An Environment in TestOwl defines the exact hardware and software conditions in which your automated test suites execute. Selecting the right browser engines, responsive viewport dimensions, and device pixel ratios ensures your web application behaves flawlessly for every customer segment.

Learn more about cross-browser test automation capabilities on our Cross-Browser Testing solution page.

Supported browser engines

TestOwl executes tests across all modern desktop browser families:

• Google Chrome: Full support for standard desktop layouts, Chrome DevTools Protocol (CDP) emulation, and headless execution. Refer to the official Google Chrome Release Notes.
• Mozilla Firefox: Gecko engine rendering for standards compliance and privacy-mode testing. Refer to official Mozilla Firefox Release Notes.
• Apple Safari (WebKit): Genuine WebKit rendering engine testing to catch Safari-specific CSS flexbox, date-picker, and media rendering differences. Refer to official Apple Safari WebKit.
• Microsoft Edge: Chromium-based enterprise browser support including Windows-specific policy validations. Refer to Microsoft Edge Documentation.

Device profiles and responsive viewports

Rather than manually typing pixel dimensions, TestOwl provides over 30 pre-configured device profiles covering smartphones, tablets, laptops, and ultra-wide monitors:

You can also specify a Custom Viewport with arbitrary width and height from 320 px to 3840 px.

How to pick viewports matching your real users

Do not guess which screen sizes to test. Base your test environment configurations on real traffic metrics:

1. 1
   Review Web Analytics: Check Google Analytics or your product telemetry for the top 5 screen resolutions used by your active users over the last 90 days.
2. 2
   Cover Boundary Breakpoints: Identify your application's CSS media query breakpoints (e.g., 640px, 768px, 1024px, 1280px). Configure environments right above and below these thresholds (e.g., 767 px mobile menu vs 769 px desktop navigation) to ensure responsive layouts toggle correctly.
3. 3
   Include High-DPI Displays: Verify that retina displays (2.0x and 3.0x DPR) render crisp iconography and sharp canvas elements.

Testing one journey across several browsers

You do not need to create duplicate test cases for different browsers. In TestOwl, test logic and environment configurations are completely decoupled:

1. 1
   Create a single Test Suite (e.g., "Core Customer Journeys").
2. 2
   Navigate to Triggering a Run.
3. 3
   Under Select Environments, check Chrome Desktop, Firefox Desktop, and Mobile Safari (iPhone 15).
4. 4
   Launch the run. TestOwl spins up parallel runner instances and executes the exact same test sequence across all three environments simultaneously.
5. 5
   In Reading Reports, inspect the comparative results side-by-side to identify browser-specific discrepancies.

Common mistakes and how to avoid them

• Confusing Viewport Size with Real Mobile Browsers: A desktop browser resized to 375 px width tests CSS layout responsiveness, but does not execute mobile WebKit quirks or mobile touch event listeners. To test mobile touch behavior, enable the Touch Events emulation toggle in your mobile environment profile.
• Ignoring Scrollbars in Fixed Width Layouts: On macOS and Windows, scrollbar rendering differences can trigger unexpected line breaks or modal clipping if your containers lack overflow styling.
• Hardcoding Element Coordinates: Never use coordinate-based click steps (click at x: 450, y: 120) in tests meant to run across varying viewports. Always use robust semantic selectors (IDs, test-attributes, or accessible roles) that follow elements dynamically.