jsdom-browser.screen

The implementation of the Screen API for jsdom-browser.

jsdom-browser is a simulator of a Web browser with JSDOM.

This module is implemented along the CSSOM View Module W3C Working Draft, 17 March 2016. This specification may become older than the latest version.

Install

$ npm install jsdom-browser.screen

Usage

Creates a ScreenConfig object

const { ScreenConfig } = require('jsdom-browser.screen')

const screenConfig = new ScreenConfig({
  width: 1280,
  height: 800,
  availTop: 23,
  availLeft: 0,
  availRight: 0,
  availBottom: 0,
  deviceAngle: -90,
})

Configures a Screen object

const { JSDOM } = require('jsdom')
const window = new JSDOM().window
screenConfig.configure(window.screen)

window.screen.width  // => 1280
window.screen.height  // => 800
window.screen.availTop // => 23
window.screen.availLeft // => 0
window.screen.availWidth // => 1280
window.screen.availHeight // => 777

screenConfig.width  // => 1280
screenConfig.height  // => 800
screenConfig.availTop  // => 23
screenConfig.availLeft  // => 0
screenConfig.availRight  // => 0
screenConfig.availBottom  // => 0
screenConfig.deviceAngle  // => -90
screenConfig.screenAngle  // => 90  // calculates negative value of device angle to 90 * n (n = 0〜3)
screenConfig.baseAngle  // => 90   // is initial screen angle

Rotate screen

This function is not described in the specification, but is needed to implement Screen Orientation API.

screenConfig.deviceAngle = -200

window.screen.width  // => 800
window.screen.height  // => 1280
window.screen.availTop // => 23
window.screen.availLeft // => 0
window.screen.availWidth // => 800
window.screen.availHeight // => 1257

screenConfig.width  // => 1280
screenConfig.height  // => 800
screenConfig.availTop  // => 23
screenConfig.availLeft  // => 0
screenConfig.availRight  // => 0
screenConfig.availBottom  // => 0
screenConfig.deviceAngle  // => -200
screenConfig.screenAngle  // => 180
screenConfig.baseAngle  // => 90

WebIDL

See The Screen interface in CSSOM View Module.

interface Screen {
  readonly attribute long availWidth;
  readonly attribute long availHeight;
  readonly attribute long width;
  readonly attribute long height;
  readonly attribute unsigned long colorDepth;
  readonly attribute unsigned long pixelDepth;
};

API

class Screen

Is the implementation of the Screen API. This class represents information about the screen of the monitor device.

Properties:

| Name | Type | Description | |:------------|:------:|:------------| | width | number | Is the width of the output device, in CSS pixels. (read only) | | height | number | Is the height of the output device, in CSS pixels. (read only) | | availTop | number | The available top position of the rendering surface of the monitor device, in CSS pixels. This property is not specified in the specification, but is supported by most browsers. (read only) | | availLeft | number | The available left position of the rendering surface of the monitor device, in CSS pixels. This property is not specified in the specification, but is supported by most browsers. (read only) | | availWidth | number | The available width of the rendering surface of the monitor device, in CSS pixels. (read only) | | availHeight | number | The available height of the rendering surface of the monitor device, in CSS pixels. (read only) | | colorDepth | number | This value is always 24. This is useless but are included for compatiility. (read only) | | pixelDepth | number | This value is always 24. This is useless but are included for compatiility. (read only) |

class ScreenConfig

extends ClassConfig

Is the class to configure a Screen object.

Properties:

| Name | Type | Description | |:------------|:------:|:-----------------| | width | number | Is the full width of the monitor device. | | height | number | Is the full height of the monitor device. | | availTop | number | Is the top position of available area from top side of the monitor device. | | availLeft | number | Is the left position of available area from left side of the monitor device. | | availRight | number | Is the right position of available area from right side of the monitor device. | | availBottom | number | Is the bottom position of available area from right side of the monitor device. | | deviceAngle | number | Is the angle from natural orientation of the monitor device. | | screenAngle | number | Is the angle among 0, 90, 180, 270 degrees rounded the opposite direction value of the device angle. (read only) | | baseAngle | number | Is the initial screen angle from natural orientation of the monitor device. |

constructor (initConfig [, opts]) : ScreenConfig

Creates a new instance of this class.

If initConfig is a ClassConfig object and opts.sharePrivate is true, this instance shares .$private property with initConfig object. This function is for screens of which windows have a same top window.

Parameters:

| Parameter | Type | Description | |:-------------|:--------------------------:|:---------------------------------| | initConfig | object | ScreenConfig | An object to initialize a new instance. | | opts | object | True, if sharing .$private of initConfig which is ClassConfig object. (By default, falsy) |

License

Copyright (C) 2018 Takayuki Sato

This program is free software under MIT License. See the file LICENSE in this distribution for more details.