@argos-ci/puppeteer 6.0.14 → 6.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +39 -4
- package/dist/index.d.mts +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +6 -6
package/README.md
CHANGED
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
<p align="center">
|
|
2
2
|
<a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
|
|
3
|
-
|
|
3
|
+
<picture>
|
|
4
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
|
|
5
|
+
<img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
|
|
6
|
+
</picture>
|
|
4
7
|
</a>
|
|
5
8
|
</p>
|
|
6
9
|
|
|
7
|
-
|
|
10
|
+
<p align="center"><strong>The open source visual testing platform for AI-native engineering teams.</strong></p>
|
|
8
11
|
|
|
9
12
|
# Official Argos Puppeteer integration
|
|
10
13
|
|
|
@@ -12,9 +15,41 @@ _Argos is a visual testing solution that fits in your workflow to avoid visual r
|
|
|
12
15
|
[](https://www.npmjs.com/package/@argos-ci/puppeteer)
|
|
13
16
|
[](https://www.npmjs.com/package/@argos-ci/puppeteer)
|
|
14
17
|
|
|
15
|
-
|
|
18
|
+
Capture stable Argos screenshots from your [Puppeteer](https://github.com/puppeteer/puppeteer) tests.
|
|
19
|
+
|
|
20
|
+
Visit the [Puppeteer SDK documentation](https://argos-ci.com/docs/sdks-reference/puppeteer) for guides, the API reference, and more.
|
|
21
|
+
|
|
22
|
+
## Installation
|
|
23
|
+
|
|
24
|
+
Install the SDK alongside the [Argos CLI](https://argos-ci.com/docs/sdks-reference/argos-command-line-interface-cli), which uploads the screenshots to Argos:
|
|
25
|
+
|
|
26
|
+
```sh
|
|
27
|
+
npm install --save-dev @argos-ci/puppeteer @argos-ci/cli
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
## Usage
|
|
31
|
+
|
|
32
|
+
Use `argosScreenshot` to stabilize the UI and capture a screenshot:
|
|
33
|
+
|
|
34
|
+
```ts
|
|
35
|
+
import puppeteer from "puppeteer";
|
|
36
|
+
import { argosScreenshot } from "@argos-ci/puppeteer";
|
|
37
|
+
|
|
38
|
+
const browser = await puppeteer.launch();
|
|
39
|
+
const page = await browser.newPage();
|
|
40
|
+
await page.goto("http://localhost:3000");
|
|
41
|
+
await argosScreenshot(page, "homepage");
|
|
42
|
+
await browser.close();
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
Screenshots are saved locally (in `./screenshots/argos` by default). Upload them to Argos with the Argos CLI, usually at the end of your CI job:
|
|
46
|
+
|
|
47
|
+
```sh
|
|
48
|
+
npx @argos-ci/cli upload ./screenshots
|
|
49
|
+
```
|
|
16
50
|
|
|
17
51
|
## Links
|
|
18
52
|
|
|
19
|
-
- [Official SDK Docs](https://argos-ci.com/docs/)
|
|
53
|
+
- [Official SDK Docs](https://argos-ci.com/docs/sdks-reference/puppeteer)
|
|
54
|
+
- [Quickstart](https://argos-ci.com/docs/quickstart/puppeteer-quickstart)
|
|
20
55
|
- [Discord](https://argos-ci.com/discord)
|
package/dist/index.d.mts
CHANGED
|
@@ -46,7 +46,7 @@ type ArgosScreenshotOptions = Omit<ScreenshotOptions, "encoding" | "type" | "omi
|
|
|
46
46
|
*
|
|
47
47
|
* @example
|
|
48
48
|
* argosScreenshot(page, "my-screenshot")
|
|
49
|
-
* @see https://argos-ci.com/docs/puppeteer
|
|
49
|
+
* @see https://argos-ci.com/docs/sdks-reference/puppeteer
|
|
50
50
|
*/
|
|
51
51
|
declare function argosScreenshot(
|
|
52
52
|
/**
|
package/dist/index.mjs
CHANGED
|
@@ -104,7 +104,7 @@ ${reasons.map((reason) => `- ${reason}`).join("\n")}
|
|
|
104
104
|
*
|
|
105
105
|
* @example
|
|
106
106
|
* argosScreenshot(page, "my-screenshot")
|
|
107
|
-
* @see https://argos-ci.com/docs/puppeteer
|
|
107
|
+
* @see https://argos-ci.com/docs/sdks-reference/puppeteer
|
|
108
108
|
*/
|
|
109
109
|
async function argosScreenshot(page, name, options = {}) {
|
|
110
110
|
const { element, viewports, argosCSS: _argosCSS, ...puppeteerOptions } = options;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@argos-ci/puppeteer",
|
|
3
3
|
"description": "Puppeteer SDK for visual testing with Argos.",
|
|
4
|
-
"version": "6.0.
|
|
4
|
+
"version": "6.0.16",
|
|
5
5
|
"author": "Smooth Code",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"repository": {
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"url": "https://github.com/argos-ci/argos-javascript.git",
|
|
10
10
|
"directory": "packages/puppeteer"
|
|
11
11
|
},
|
|
12
|
-
"homepage": "https://argos-ci.com/docs/puppeteer",
|
|
12
|
+
"homepage": "https://argos-ci.com/docs/sdks-reference/puppeteer",
|
|
13
13
|
"bugs": {
|
|
14
14
|
"url": "https://github.com/argos-ci/argos-javascript/issues"
|
|
15
15
|
},
|
|
@@ -42,11 +42,11 @@
|
|
|
42
42
|
"puppeteer": ">=1"
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
|
-
"@argos-ci/browser": "6.
|
|
46
|
-
"@argos-ci/util": "4.0.
|
|
45
|
+
"@argos-ci/browser": "6.4.1",
|
|
46
|
+
"@argos-ci/util": "4.0.1"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@argos-ci/cli": "6.1.
|
|
49
|
+
"@argos-ci/cli": "6.1.1",
|
|
50
50
|
"@types/jest": "^30.0.0",
|
|
51
51
|
"@types/node": "catalog:",
|
|
52
52
|
"expect-puppeteer": "^11.0.0",
|
|
@@ -66,5 +66,5 @@
|
|
|
66
66
|
"check-format": "prettier --check --ignore-unknown --ignore-path=../../.gitignore --ignore-path=../../.prettierignore .",
|
|
67
67
|
"lint": "eslint ."
|
|
68
68
|
},
|
|
69
|
-
"gitHead": "
|
|
69
|
+
"gitHead": "7fddaad1a6bb251a1f2eecbf8f4ecfa3e84e9b97"
|
|
70
70
|
}
|