Skip to content

Commit 9335d41

Browse files
yury-syury-s
authored
feat(video): add screencast mode to Video.start for JPEG frame events (microsoft#39487)
1 parent 6ae6e04 commit 9335d41

15 files changed

Lines changed: 789 additions & 3 deletions

File tree

‎docs/src/api/class-inspector.md‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
# class: Inspector
2+
* since: v1.59
3+
* langs: js
4+
5+
Interface to the Playwright inspector.
6+
7+
**Usage**
8+
9+
```js
10+
const inspector = page.inspector();
11+
inspector.on('screencastframe', ({ data, width, height }) => {
12+
console.log(`received frame ${width}x${height}, jpeg size: ${data.length}`);
13+
});
14+
await inspector.startScreencast();
15+
// ... perform actions ...
16+
await inspector.stopScreencast();
17+
```
18+
19+
## event: Inspector.screencastFrame
20+
* since: v1.59
21+
- argument: <[Object]>
22+
- `data` <[Buffer]> JPEG-encoded frame data.
23+
- `width` <[int]> Frame width in pixels.
24+
- `height` <[int]> Frame height in pixels.
25+
26+
Emitted for each captured JPEG screencast frame while the screencast is running.
27+
28+
**Usage**
29+
30+
```js
31+
const inspector = page.inspector();
32+
inspector.on('screencastframe', ({ data, width, height }) => {
33+
console.log(`frame ${width}x${height}, jpeg size: ${data.length}`);
34+
require('fs').writeFileSync('frame.jpg', data);
35+
});
36+
await inspector.startScreencast({ size: { width: 1280, height: 720 } });
37+
// ... perform actions ...
38+
await inspector.stopScreencast();
39+
```
40+
41+
## async method: Inspector.startScreencast
42+
* since: v1.59
43+
44+
Starts capturing screencast frames. Frames are emitted as [`event: Inspector.screencastFrame`] events.
45+
46+
**Usage**
47+
48+
```js
49+
const inspector = page.inspector();
50+
inspector.on('screencastframe', ({ data, width, height }) => {
51+
console.log(`frame ${width}x${height}, size: ${data.length}`);
52+
});
53+
await inspector.startScreencast({ size: { width: 800, height: 600 } });
54+
// ... perform actions ...
55+
await inspector.stopScreencast();
56+
```
57+
58+
### option: Inspector.startScreencast.size
59+
* since: v1.59
60+
- `size` ?<[Object]>
61+
- `width` <[int]> Frame width in pixels.
62+
- `height` <[int]> Frame height in pixels.
63+
64+
Optional dimensions for the screencast frames. If not specified, the current page viewport size is used.
65+
66+
## async method: Inspector.stopScreencast
67+
* since: v1.59
68+
69+
Stops the screencast started with [`method: Inspector.startScreencast`].
70+
71+
**Usage**
72+
73+
```js
74+
await inspector.startScreencast();
75+
// ... perform actions ...
76+
await inspector.stopScreencast();
77+
```

‎docs/src/api/class-page.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2597,6 +2597,25 @@ Throws for non-input elements. However, if the element is inside the `<label>` e
25972597
### option: Page.inputValue.timeout = %%-input-timeout-js-%%
25982598
* since: v1.13
25992599

2600+
## method: Page.inspector
2601+
* since: v1.59
2602+
* langs: js
2603+
- returns: <[Inspector]>
2604+
2605+
Returns the [Inspector] object associated with this page.
2606+
2607+
**Usage**
2608+
2609+
```js
2610+
const inspector = page.inspector();
2611+
inspector.on('screencastFrame', data => {
2612+
console.log('received frame, jpeg size:', data.length);
2613+
});
2614+
await inspector.startScreencast();
2615+
// ... perform actions ...
2616+
await inspector.stopScreencast();
2617+
```
2618+
26002619
## async method: Page.isChecked
26012620
* since: v1.8
26022621
* discouraged: Use locator-based [`method: Locator.isChecked`] instead. Read more about [locators](../locators.md).

‎packages/playwright-client/types/types.d.ts‎

Lines changed: 249 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3508,6 +3508,24 @@ export interface Page {
35083508
timeout?: number;
35093509
}): Promise<string>;
35103510

3511+
/**
3512+
* Returns the [Inspector](https://playwright.dev/docs/api/class-inspector) object associated with this page.
3513+
*
3514+
* **Usage**
3515+
*
3516+
* ```js
3517+
* const inspector = page.inspector();
3518+
* inspector.on('screencastFrame', data => {
3519+
* console.log('received frame, jpeg size:', data.length);
3520+
* });
3521+
* await inspector.startScreencast();
3522+
* // ... perform actions ...
3523+
* await inspector.stopScreencast();
3524+
* ```
3525+
*
3526+
*/
3527+
inspector(): Inspector;
3528+
35113529
/**
35123530
* **NOTE** Use locator-based [locator.isChecked([options])](https://playwright.dev/docs/api/class-locator#locator-is-checked)
35133531
* instead. Read more about [locators](https://playwright.dev/docs/locators).
@@ -20418,6 +20436,237 @@ export interface FrameLocator {
2041820436
owner(): Locator;
2041920437
}
2042020438

20439+
/**
20440+
* Interface to the Playwright inspector.
20441+
*
20442+
* **Usage**
20443+
*
20444+
* ```js
20445+
* const inspector = page.inspector();
20446+
* inspector.on('screencastframe', ({ data, width, height }) => {
20447+
* console.log(`received frame ${width}x${height}, jpeg size: ${data.length}`);
20448+
* });
20449+
* await inspector.startScreencast();
20450+
* // ... perform actions ...
20451+
* await inspector.stopScreencast();
20452+
* ```
20453+
*
20454+
*/
20455+
export interface Inspector {
20456+
/**
20457+
* Emitted for each captured JPEG screencast frame while the screencast is running.
20458+
*
20459+
* **Usage**
20460+
*
20461+
* ```js
20462+
* const inspector = page.inspector();
20463+
* inspector.on('screencastframe', ({ data, width, height }) => {
20464+
* console.log(`frame ${width}x${height}, jpeg size: ${data.length}`);
20465+
* require('fs').writeFileSync('frame.jpg', data);
20466+
* });
20467+
* await inspector.startScreencast({ size: { width: 1280, height: 720 } });
20468+
* // ... perform actions ...
20469+
* await inspector.stopScreencast();
20470+
* ```
20471+
*
20472+
*/
20473+
on(event: 'screencastframe', listener: (data: {
20474+
/**
20475+
* JPEG-encoded frame data.
20476+
*/
20477+
data: Buffer;
20478+
20479+
/**
20480+
* Frame width in pixels.
20481+
*/
20482+
width: number;
20483+
20484+
/**
20485+
* Frame height in pixels.
20486+
*/
20487+
height: number;
20488+
}) => any): this;
20489+
20490+
/**
20491+
* Adds an event listener that will be automatically removed after it is triggered once. See `addListener` for more information about this event.
20492+
*/
20493+
once(event: 'screencastframe', listener: (data: {
20494+
/**
20495+
* JPEG-encoded frame data.
20496+
*/
20497+
data: Buffer;
20498+
20499+
/**
20500+
* Frame width in pixels.
20501+
*/
20502+
width: number;
20503+
20504+
/**
20505+
* Frame height in pixels.
20506+
*/
20507+
height: number;
20508+
}) => any): this;
20509+
20510+
/**
20511+
* Emitted for each captured JPEG screencast frame while the screencast is running.
20512+
*
20513+
* **Usage**
20514+
*
20515+
* ```js
20516+
* const inspector = page.inspector();
20517+
* inspector.on('screencastframe', ({ data, width, height }) => {
20518+
* console.log(`frame ${width}x${height}, jpeg size: ${data.length}`);
20519+
* require('fs').writeFileSync('frame.jpg', data);
20520+
* });
20521+
* await inspector.startScreencast({ size: { width: 1280, height: 720 } });
20522+
* // ... perform actions ...
20523+
* await inspector.stopScreencast();
20524+
* ```
20525+
*
20526+
*/
20527+
addListener(event: 'screencastframe', listener: (data: {
20528+
/**
20529+
* JPEG-encoded frame data.
20530+
*/
20531+
data: Buffer;
20532+
20533+
/**
20534+
* Frame width in pixels.
20535+
*/
20536+
width: number;
20537+
20538+
/**
20539+
* Frame height in pixels.
20540+
*/
20541+
height: number;
20542+
}) => any): this;
20543+
20544+
/**
20545+
* Removes an event listener added by `on` or `addListener`.
20546+
*/
20547+
removeListener(event: 'screencastframe', listener: (data: {
20548+
/**
20549+
* JPEG-encoded frame data.
20550+
*/
20551+
data: Buffer;
20552+
20553+
/**
20554+
* Frame width in pixels.
20555+
*/
20556+
width: number;
20557+
20558+
/**
20559+
* Frame height in pixels.
20560+
*/
20561+
height: number;
20562+
}) => any): this;
20563+
20564+
/**
20565+
* Removes an event listener added by `on` or `addListener`.
20566+
*/
20567+
off(event: 'screencastframe', listener: (data: {
20568+
/**
20569+
* JPEG-encoded frame data.
20570+
*/
20571+
data: Buffer;
20572+
20573+
/**
20574+
* Frame width in pixels.
20575+
*/
20576+
width: number;
20577+
20578+
/**
20579+
* Frame height in pixels.
20580+
*/
20581+
height: number;
20582+
}) => any): this;
20583+
20584+
/**
20585+
* Emitted for each captured JPEG screencast frame while the screencast is running.
20586+
*
20587+
* **Usage**
20588+
*
20589+
* ```js
20590+
* const inspector = page.inspector();
20591+
* inspector.on('screencastframe', ({ data, width, height }) => {
20592+
* console.log(`frame ${width}x${height}, jpeg size: ${data.length}`);
20593+
* require('fs').writeFileSync('frame.jpg', data);
20594+
* });
20595+
* await inspector.startScreencast({ size: { width: 1280, height: 720 } });
20596+
* // ... perform actions ...
20597+
* await inspector.stopScreencast();
20598+
* ```
20599+
*
20600+
*/
20601+
prependListener(event: 'screencastframe', listener: (data: {
20602+
/**
20603+
* JPEG-encoded frame data.
20604+
*/
20605+
data: Buffer;
20606+
20607+
/**
20608+
* Frame width in pixels.
20609+
*/
20610+
width: number;
20611+
20612+
/**
20613+
* Frame height in pixels.
20614+
*/
20615+
height: number;
20616+
}) => any): this;
20617+
20618+
/**
20619+
* Starts capturing screencast frames. Frames are emitted as
20620+
* [inspector.on('screencastframe')](https://playwright.dev/docs/api/class-inspector#inspector-event-screencast-frame)
20621+
* events.
20622+
*
20623+
* **Usage**
20624+
*
20625+
* ```js
20626+
* const inspector = page.inspector();
20627+
* inspector.on('screencastframe', ({ data, width, height }) => {
20628+
* console.log(`frame ${width}x${height}, size: ${data.length}`);
20629+
* });
20630+
* await inspector.startScreencast({ size: { width: 800, height: 600 } });
20631+
* // ... perform actions ...
20632+
* await inspector.stopScreencast();
20633+
* ```
20634+
*
20635+
* @param options
20636+
*/
20637+
startScreencast(options?: {
20638+
/**
20639+
* Optional dimensions for the screencast frames. If not specified, the current page viewport size is used.
20640+
*/
20641+
size?: {
20642+
/**
20643+
* Frame width in pixels.
20644+
*/
20645+
width: number;
20646+
20647+
/**
20648+
* Frame height in pixels.
20649+
*/
20650+
height: number;
20651+
};
20652+
}): Promise<void>;
20653+
20654+
/**
20655+
* Stops the screencast started with
20656+
* [inspector.startScreencast([options])](https://playwright.dev/docs/api/class-inspector#inspector-start-screencast).
20657+
*
20658+
* **Usage**
20659+
*
20660+
* ```js
20661+
* await inspector.startScreencast();
20662+
* // ... perform actions ...
20663+
* await inspector.stopScreencast();
20664+
* ```
20665+
*
20666+
*/
20667+
stopScreencast(): Promise<void>;
20668+
}
20669+
2042120670
/**
2042220671
* Keyboard provides an api for managing a virtual keyboard. The high level api is
2042320672
* [keyboard.type(text[, options])](https://playwright.dev/docs/api/class-keyboard#keyboard-type), which takes raw

‎packages/playwright-core/src/client/api.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ export { Electron, ElectronApplication } from './electron';
2828
export { FrameLocator, Locator } from './locator';
2929
export { ElementHandle } from './elementHandle';
3030
export { FileChooser } from './fileChooser';
31+
export type { Inspector } from './inspector';
3132
export type { Logger } from './types';
3233
export { TimeoutError } from './errors';
3334
export { Frame } from './frame';

0 commit comments

Comments
 (0)