JSPM – @browserless/devices@9.3.3

Package Exports

@browserless/devices
@browserless/devices/src/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@browserless/devices) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@browserless/devices: A collection of different devices for emulation purposes.

See devices section our website for more information.

Install

Using npm:

npm install @browserless/devices --save

About

This package provides a device descriptor library for browser emulation. It extends Puppeteer's built-in device list with additional desktop devices and provides fuzzy matching capabilities for device name resolution.

What this package does

The @browserless/devices package allows you to:

Emulate devices by retrieving viewport dimensions, user agent strings, and device capabilities
Use fuzzy matching to resolve device names even with typos or case variations
Access extended device list that includes desktop devices missing from Puppeteer's defaults

Device properties

Each device descriptor includes:

Property	Description
`userAgent`	Browser user agent string
`viewport.width`	Screen width in pixels
`viewport.height`	Screen height in pixels
`viewport.deviceScaleFactor`	Device pixel ratio (DPR)
`viewport.isMobile`	Whether it's a mobile device
`viewport.hasTouch`	Whether the device has touch support
`viewport.isLandscape`	Whether the device is in landscape mode

Custom Devices

This package extends Puppeteer's KnownDevices with additional desktop devices:

Device	Resolution	Scale
`Macbook Pro 13`	1280 × 800	2x
`Macbook Pro 15`	1440 × 900	2x
`Macbook Pro 16`	1536 × 960	2x
`iMac 21`	1980 × 1080	1x
`iMac 21 4K`	2048 × 1152	2x
`iMac 24 4.5K`	4480 × 2520	1x
`iMac 27`	2560 × 1440	1x
`iMac 27 5K`	2560 × 1440	2x

Fuzzy Device Name Matching

When lossyDeviceName is enabled (default), the package uses fuzzy matching to resolve device names:

const createGetDevice = require('@browserless/devices')
const getDevice = createGetDevice({ lossyDeviceName: true })

// All of these resolve to "Macbook Pro 13"
getDevice({ device: 'Macbook Pro 13' })
getDevice({ device: 'macbook pro 13' })
getDevice({ device: 'MACBOOK PRO 13' })
getDevice({ device: 'macbook pro' })
getDevice({ device: 'macboo pro' })  // typo still works!

Usage

const createGetDevice = require('@browserless/devices')
const getDevice = createGetDevice()

// Get device by name
const device = getDevice({ device: 'iPhone 13' })
// => { userAgent: '...', viewport: { width: 390, height: 844, ... } }

// Override viewport properties
const customDevice = getDevice({
  device: 'iPad',
  viewport: { isLandscape: true }
})

// Use custom headers
const withHeaders = getDevice({
  headers: { 'user-agent': 'googlebot' }
})

// Access all available devices
console.log(getDevice.deviceDescriptors)

How it fits in the monorepo

This is a standalone utility package with no dependencies on other @browserless/* packages. It's used by:

Consumer	Purpose
`@browserless/goto`	Sets viewport and user agent when navigating to URLs
`browserless` (core)	Exposes `getDevice()` method on browser contexts

Dependencies

Package	Purpose
`didyoumean3`	Fuzzy string matching for lossy device name resolution
`memoize-one`	Caches device lookups for performance
`require-one-of`	Auto-detects puppeteer/puppeteer-core installation

License

@browserless/devices © Microlink, released under the MIT License.
Authored and maintained by Microlink with help from contributors.

The logo has been designed by xinh studio.

microlink.io · GitHub microlinkhq · X @microlinkhq