Skip to content

Commit c2fe55e

Browse files
authored
docs: add verification guide (#1885)
1 parent 37ad552 commit c2fe55e

File tree

2 files changed

+170
-3
lines changed

2 files changed

+170
-3
lines changed

docs/README.md

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,12 @@
3131
- [Handle requests](./network.md#handle-requests)
3232
- [Modify requests](./network.md#modify-requests)
3333
- [Abort requests](./network.md#abort-requests)
34-
1. Scraping and verification
35-
- Screenshots
36-
- Evaluation
34+
1. [Scraping and verification](./verification.md)
35+
- [Screenshots](./verification.md#capturing-screenshot)
36+
- [Evaluation](./verification.md#evaluating-javascript)
37+
- [Console messages](./verification.md#listening-console-messages)
38+
- [Uncaghut exceptions](./verification.md#uncaghut-exceptions)
39+
- [Page crashes](./verification.md#page-crashes)
3740
1. [Navigation and loading](./loading.md)
3841
- [Common scenarios](./loading.md#common-scenarios)
3942
- [Loading a popup](./loading.md#loading-a-popup)

docs/verification.md

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
# Scraping and verification
2+
3+
Playwright allows verifiying state of the page and catching abnormal behavior by:
4+
- evaluating JavaScript code snippets in the page
5+
- capturing screenshots (png or jpeg)
6+
- listening console messages
7+
- observing uncaghut exceptions in the page
8+
- observing page crashes
9+
- etc
10+
11+
#### Contents
12+
- [Evaluating JavaScript](#evaluating-javascript)
13+
- [Capturing screenshot](#capturing-screenshot)
14+
- [Listening console messages](#listening-console-messages)
15+
- [Uncaghut exceptions](#uncaghut-exceptions)
16+
- [Page crashes](#page-crashes)
17+
18+
<br/>
19+
20+
## Evaluating JavaScript
21+
22+
Execute JavaScript function in the page:
23+
```js
24+
const href = await page.evaluate(() => document.location.href);
25+
```
26+
27+
If the result is a Promise or if the function is asynchronouse eveluate will automatically wait until it's resolved:
28+
```js
29+
const status = await page.evaluate(async () => {
30+
const response = await fetch(location.href);
31+
return response.status;
32+
});
33+
```
34+
35+
Get object handle and use it in multiple evaluations:
36+
```js
37+
// Create a new array in the page, wriate a reference to it in
38+
// window.myArray and get a handle to it.
39+
const myArrayHandle = await page.evaluateHandle(() => {
40+
window.myArray = [1];
41+
return myArray;
42+
});
43+
44+
// Get current length of the array using the handle.
45+
const length = await page.evaluate(
46+
(arg) => arg.myArray.length,
47+
{ myArray: myArrayHandle }
48+
);
49+
50+
// Add one more element to the array using the handle
51+
await page.evaluate((arg) => arg.myArray.push(arg.newElement), {
52+
myArray:myArrayHandle,
53+
newElement: 2
54+
});
55+
56+
// Get current length of the array using window.myArray reference.
57+
const newLength = await page.evaluate(() => window.myArray.length);
58+
59+
// Release the object when it's no longer needed.
60+
await myArrayHandle.dispose();
61+
```
62+
63+
#### API reference
64+
65+
- [page.$(selector)](./api.md#pageselector)
66+
- [page.$$(selector)](./api.md#pageselector-1)
67+
- [page.$eval(selector, pageFunction[, arg])](./api.md#pageevalselector-pagefunction-arg)
68+
- [page.$$eval(selector, pageFunction[, arg])](./api.md#pageevalselector-pagefunction-arg-1)
69+
- [page.evaluate(pageFunction[, arg])](./api.md#pageevaluatepagefunction-arg)
70+
- [page.evaluateHandle(pageFunction[, arg])](./api.md#pageevaluatehandlepagefunction-arg)
71+
72+
<br/>
73+
74+
## Capturing screenshot
75+
76+
Take screenshot of the page's viewport and save it in a png file:
77+
```js
78+
await page.screenshot({path: 'screenshot.png'});
79+
```
80+
Capture entire scrollable area of the page:
81+
```js
82+
await page.screenshot({path: 'screenshot.png', fullPage: true});
83+
```
84+
Save screenshot in an in-memory buffer (the content is base64-encoded image bytes):
85+
```js
86+
const buffer = await page.screenshot();
87+
// Log the length.
88+
console.log(buffer.length);
89+
```
90+
91+
92+
#### API reference
93+
94+
- [page.screenshot([options])](./api.md#pagescreenshotoptions)
95+
- [Node.js Buffer](https://nodejs.org/api/buffer.html)
96+
97+
<br/>
98+
99+
## Listening console messages
100+
101+
Listen all console messages in a page and dump _errors_ in to the terminal:
102+
103+
```js
104+
// Get all console messages from the page.
105+
page.on('console', msg => {
106+
// Handle only errors.
107+
if (msg.type() !== 'error')
108+
return;
109+
console.log(`text: "${msg.text()}"`);
110+
});
111+
112+
await page.evaluate(() => console.error('Page error message'));
113+
```
114+
Get access to the console message arguments:
115+
```js
116+
page.on('console', msg => {
117+
for (let i = 0; i < msg.args().length; ++i)
118+
console.log(`${i}: ${msg.args()[i]}`);
119+
});
120+
```
121+
122+
#### API reference
123+
124+
- [class: ConsoleMessage](./api.md#class-consolemessage)
125+
- [class `JSHandle`](./api.md#class-jshandle)
126+
- [event: 'console'](./api.md#event-console)
127+
128+
<br/>
129+
130+
131+
## Uncaghut exceptions
132+
133+
Listen uncaghut exceptions in the page:
134+
```js
135+
// Log all uncaught errors to the terminal
136+
page.on('pageerror', exception => {
137+
console.log(`Uncaught exception: "${exception}"`);
138+
});
139+
140+
// Navigate to a page with an exception.
141+
await page.goto('data:text/html,<script>throw new Error("Test")</script>');
142+
```
143+
144+
#### API reference
145+
146+
- [event: 'pageerror'](./api.md#event-pageerror)
147+
148+
<br/>
149+
150+
## Page crashes
151+
152+
Listen to page crashes:
153+
```js
154+
page.on('crash', exception => {
155+
console.log(`Page crashed`);
156+
});
157+
```
158+
It's very unusual for page to crash but might happen if a page allocates too much memory or due to a bug in a browser.
159+
160+
#### API reference
161+
162+
- [event: 'crash'](./api.md#event-crash)
163+
164+
<br/>

0 commit comments

Comments
 (0)