iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
Set Playwright’s browser viewport to 360 CSS pixels wide, then capture the visible screen with page.screenshot(). To make the PNG exactly 360 raster pixels wide too, set deviceScaleFactor: 1 on the browser context and use scale: 'css'. This emulates a mobile-sized browser viewport; it does not prove that a real phone or a bank’s production service works correctly.
Capture a Playwright screenshot at 360px
Install Playwright in your project if it is not already installed, then run this JavaScript example. Replace the example URL with a permitted test environment you control or are authorized to access.
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
try {
const context = await browser.newContext({
viewport: { width: 360, height: 800 },
deviceScaleFactor: 1,
isMobile: true,
locale: 'en-IN',
});
const page = await context.newPage();
await page.goto('https://your-test-banking-app.example');
await page.screenshot({ path: 'banking-360.png', scale: 'css' });
} finally {
await browser.close();
}
})();The viewport width is measured in CSS pixels. The height of 800 is an example; choose the height that matches the screen you intend to represent. isMobile and locale set additional emulated browser characteristics, while deviceScaleFactor controls the relationship between CSS pixels and device pixels. Playwright documents these context settings in its emulation guide.
The Tool Desk
Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →Outbyte PC Repair FREERepair Windows errors before they cause bigger problemsFix Now →Choose the screenshot size and extent
CSS pixels versus device pixels
Use scale: 'css' for an image sized according to CSS pixels. With a 360-pixel viewport, this produces 360 pixels of image width. Setting deviceScaleFactor: 1 makes that relationship explicit. If you instead need a higher-density image, use device-pixel scaling and expect the raster dimensions to depend on the device scale factor. See Playwright’s screenshot API reference.
#1 Best Overall
- 【REAR CAM POWER, FLAWLESS SELFIES】 Turn your phone’s superior rear camera into a pro selfie monitor. Get instant, lag-free visual feedback on framing and lighting. Never guess your shot again—elevate your YouTube vlogs and Reels instantly. (Not for Google Pixel).
- 【PLUG & PLAY】Instant 4K@60Hz wired mirroring for iPhone 15-17 & Android (via App). Zero-latency, no WiFi needed. Perfect for vlogging. (Note: iPhone 14 & older needs adapter).
- 【PERFECT AUDIO SYNC】 Built-in speaker delivers real-time audio synced perfectly with your video feed. Perfect for TikTok, Reels, or YouTube. Effortlessly switch between vertical and horizontal modes to match any social platform’s requirements.
- 【WIRELESS & MAGNETIC】Universal lag-free mirroring for iOS/Android/HarmonyOS. Built-in N52 magnets snap to iPhone 12-17; includes a metal clip for non-MagSafe devices.
- 【CREATOR READY & LONG BATTERY】Get up to 3 hours of continuous filming per charge. Lightweight and portable—the ultimate tool for travel vlogging and professional content.
Viewport versus full-page capture
| Mode | Use it for | Result |
|---|---|---|
| Default viewport capture | A single mobile screen or the content initially visible | The screenshot is limited to the configured viewport. |
fullPage: true |
A record of the whole scrollable document | Playwright captures the page as if shown on a very tall screen; the image is taller than a single mobile screen. |
For a full-page screenshot, change the call to await page.screenshot({ path: 'banking-full.png', scale: 'css', fullPage: true });. The Playwright screenshots guide describes full-page capture.
Protect financial information in screenshots
Banking pages may display account numbers, balances, names, or transaction details. Prefer synthetic test data. If sensitive elements must appear in the test page, mask them before saving or sharing the screenshot. Playwright’s screenshot API supports masking matching locators:
Rank #2
- 【Complete All-in-One Filmmaking Solution】This professional video kit includes everything you need to shoot studio-quality videos immediately: ergonomic U-shaped stabilizer handle, universal phone cage, action camera mounting adapter, RGB LED fill light, and directional shotgun microphone. No need to purchase separate accessories, saving you both time and money.
- 【Curved U-handle Stabilizer】Equipped with 3 cold shoe mount on the top and 2 universal 1/4" screw on the base, allowing you to simultaneously mount your camera, smartphone, external monitor, microphone, LED light, and other accessories. Multiple configuration options adapt to all your shooting needs.
- 【Variable Smartphone Video Cage】Rich expansion options, including 3 cold shoe mounts and five 1/4" threaded holes, offering a secure and versatile camera grip for dynamic filming. Comes with a detachable handle grip，ideal for recording different wonderful angles quality Videos. Works seamlessly with all smartphones (with or without a protective case, fits 4.7"-6.7" screens).
- 【Creative Lighting & Control】Adjustable iPhone light offers 102 LEDs (30 RGB + 72 high-CRI LED) deliver 800lm at 120° with CRI95+ sunlight accuracy. This small rgb light offers 10%-100% dimming for studio-quality led light anywhere. 【Tips】If the product does not light up when turned on, please charge it before use.
- 【External Microphone】 Compatible with iPhone, Android, cameras, camcorders, recorders, tablets, and laptops，ideal for recording YouTube Vlogs, Tik Tok, interviews, family vacation trips, live music, outdoor events, etc. 【Tips】Use a straight TRRS cable (not curved) and connect the "L" end to the microphone for proper function.
await page.screenshot({
path: 'banking-360-masked.png',
scale: 'css',
mask: [page.locator('.account-number'), page.locator('.balance')],
});Replace the CSS selectors with selectors that match the sensitive elements in your test page. OWASP’s Mobile Application Security Testing Guide cautions that screenshots of banking applications can expose account, credit, and transaction information. Avoid capturing real customer data unless your security and authorization requirements explicitly allow it.
What 360-pixel emulation does—and does not—tell you
A 360 CSS-pixel viewport is a useful reproducible layout condition, not a physical phone. Playwright can emulate browser characteristics such as viewport and touch behavior, but a screenshot at this width alone does not establish real-device compatibility, validate a live banking service, or verify any Indian bank’s site. Test on real devices and in an authorized environment when those outcomes matter.
Rank #3
- 🎥 Crystal-Clear Live Preview: Features a 4.02-inch HD screen with a resolution of 480*800 pixels and a full viewing angle, providing a sharp, real-time preview of your camera feed. Perfectly frame your shots for photos, 1080P videos, and live streams without any guessing.
- ⚡️ Long-Lasting Battery & Portability: Powered by a built-in 1500mAh rechargeable battery that offers up to 3 hours of continuous use. Combined with its ultra-lightweight design (only 150g) and compact size, it's the perfect on-the-go companion for all-day vlogging and content creation.
- 📱 Universal Wireless Compatibility: Effortlessly connect your smartphone wirelessly! Supports AirPlay for iOS and Miracast for Android devices for seamless screen mirroring. No messy cables needed, just instant, stable connectivity for hassle-free operation.
- 🔄 Multi-Functional Hub: It's more than a selfie screen! Perfect for live streaming, recording vlogs, online teaching, video conferences, and even screen sharing. Its versatile design makes it an essential tool for creators, professionals, and anyone who communicates online.
- 🧲 【N52 Strong Magnetic Attachment & Universal Fit】 Features a powerful N52 magnet for instant, secure attachment to magnetic phone cases. A complimentary metal plate is included to easily add compatibility to ANY other smartphone model, making it the most versatile magnetic selfie monitor available.
Troubleshoot common capture problems
- The saved image is wider than 360 pixels: confirm the context has
viewport: { width: 360, height: ... }, the screenshot usesscale: 'css', and the context setsdeviceScaleFactor: 1. Without CSS scaling, device-pixel output can be larger. - The screenshot is too tall: remove
fullPage: trueif you want only the configured viewport. - The page is blank or incomplete: verify the permitted test URL is reachable from the machine running Playwright and that navigation has completed before capture. This example does not assert that any particular bank or site is accessible.
- Sensitive text remains visible: check that each masking locator matches the intended element and use synthetic data wherever possible.
- The layout differs from a physical phone: treat the image as an emulated browser result and validate separately on the actual device or device-testing setup required by your project.
Or skip the browser setup
ScreenshotNeo offers a screenshot API and MCP server for developers. Its API can return an image or PDF from one GET request. For this example, replace the URL with an authorized test page; consult the ScreenshotNeo documentation for available parameters and response details.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpScreenshotNeo accepts cookie or consent banners and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture; each step can be disabled. Bot checks, blank pages, failed loads, timeouts, and cache hits are not billed, and responses identify the page verdict and billing status in headers. Its MCP server provides screenshot and PDF tools for AI agents. The free plan includes 1,000 screenshots per month without a card; paid plans start at $5 for 3,000 shots. Learn about ScreenshotNeo, or sign up free for 1,000 screenshots a month with no card.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.FAQ
Does locale: 'en-IN' make the site an Indian bank site?
No. It sets the emulated browser locale; it does not change which website you access or establish that the site is operated by an Indian bank.
Rank #4
- Real-time Screen Phone Sharing Monitor: FMC Vlog Selfie Monitor Screen delivers real-time screen sharing, letting you preview your phone display instantly. With its magnetic design, it easily attaches to the back of your phone, using higher-resolution back camera for selfie, livestream or TikTok Creation without guesswork or blurry footage
- iPhone screen mirroring connection: step1, long press power button 3s to turn on; step 2, swipe down from top right corner of phone screen, tap "screen miooring" lcon to seach; step 3, select "T20--xxxxx"; step 4: enter password:1234 if promted.
- HD Display Quality & Smart Viewing Features: This Phone Screen Monitor features a 1080P HD display, supporting 4K 30fps video, giving you a clear, real-time view of your phone's camera feed. With three adjustable brightness levels, you'll see every detail clearly whether in harsh sunlight or low-light environments. Easily switch between full screen and aspect-ratio scaling, and use the one-tap 180 screen rotation to adapt your view instantly
- Portable & Lightweight Design: Weighing only 0.22 lbs and just 3.97 inches, this selfie monitor fits right into your pocket for creators on the go. With a universal Type-C charging port, recharging is fast and convenient using your phone cable. Each package includes a Bluetooth remote control, allowing you to take hands-free shots and start recording remotely with just one click
- Widely Compatible with Multiple Devices: This wireless connection technology supports iOS 9.0 or above, Android 2.0 or above, HarmonyOS 3.0 or above, MagicOS 4.0 or above. Compatible with mainstream smart phone devices, no need for additional accessories, ready to use
Can I use this on a live banking website?
Only if you have permission and the activity complies with the site’s access rules and your organization’s security requirements. A test environment with synthetic data is safer for routine screenshots.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
