@d-zero/puppeteer-screenshot 3.3.10 → 3.4.1

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.
Files changed (3) hide show
  1. package/README.md +8 -88
  2. package/dist/screenshot.d.ts +3 -0
  3. package/package.json +5 -5
package/README.md CHANGED
@@ -1,108 +1,28 @@
1
1
  # `@d-zero/puppeteer-screenshot`
2
2
 
3
- Puppeteerでスクリーンショットを撮るためのユーティリティです。
3
+ Puppeteer で複数サイズのスクリーンショット + DOM テキスト + alt 属性を取得するユーティリティ。
4
4
 
5
- ## インストール
5
+ ## Installation
6
6
 
7
7
  ```sh
8
- yarn install @d-zero/puppeteer-screenshot
8
+ yarn add @d-zero/puppeteer-screenshot
9
9
  ```
10
10
 
11
- ## 使い方
12
-
13
- ### 基本的な使い方
11
+ ## Usage
14
12
 
15
13
  ```ts
16
- import { screenshot } from '@d-zero/puppeteer-screenshot';
17
-
18
- const browser = await puppeteer.launch();
19
- const page = await browser.newPage();
14
+ import { screenshot, screenshotListener } from '@d-zero/puppeteer-screenshot';
20
15
 
21
- // スクリーンショットのバイナリデータを持つオブジェクトを返します
22
16
  const result = await screenshot(page, 'https://example.com', {
23
- path: 'path/to/save.png', // 保存先のパスを指定することでファイルに保存できます（省略可）
17
+ path: 'path/to/save.png',
24
18
  sizes: {
25
19
  desktop: { width: 1400 },
26
20
  mobile: { width: 375, resolution: 2 },
27
21
  },
28
- });
29
- ```
30
-
31
- ### リスナーを使ったロギング
32
-
33
- ```ts
34
- import { screenshot, screenshotListener } from '@d-zero/puppeteer-screenshot';
35
-
36
- const result = await screenshot(page, 'https://example.com', {
37
- listener: screenshotListener, // 標準のログ出力リスナー
38
- });
39
-
40
- // またはカスタムリスナー
41
- const result = await screenshot(page, 'https://example.com', {
42
- listener: (phase, data) => {
43
- console.log(phase, data);
44
- },
45
- });
46
- ```
47
-
48
- ## オプション
49
-
50
- | オプション | 型 | 説明 |
51
- | ----------------- | --------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- |
52
- | `id` | `string` | スクリーンショットのカスタム識別子。省略時はURLからファイル名が生成されます |
53
- | `path` | `string` | スクリーンショットの保存先パス。指定するとファイルに保存されます（例: `path/to/save.png`はサイズ別に`save@desktop.png`、`save@mobile.png`などに保存） |
54
- | `sizes` | `Sizes` | スクリーンショットを撮るサイズと解像度の設定。省略時はデフォルトサイズ（desktop、tablet、mobile）が使用されます |
55
- | `hooks` | `PageHook[]` | ページスキャン時に実行するフック関数の配列 |
56
- | `listener` | `Listener<ScreenshotPhase>` | スクリーンショット処理の各フェーズをリスンする関数。`screenshotListener`を使うと標準のログ出力が得られます |
57
- | `domOnly` | `boolean` | `true`の場合、スクリーンショットの撮影をスキップしてDOMのみを取得します（デフォルト: `false`） |
58
- | `selector` | `string` | 特定の要素のみをスクリーンショット撮影するためのCSSセレクター |
59
- | `ignore` | `string` | スクリーンショットから除外する（非表示にする）要素のCSSセレクター |
60
- | `timeout` | `number` | カスタムタイムアウト値（ミリ秒） |
61
- | `openDisclosures` | `boolean` | `true`の場合、disclosure要素（`<details>`と`button[aria-expanded="false"]`）を展開します（最大1000回まで繰り返す） |
62
-
63
- ## エクスポート
64
-
65
- ### `screenshot(page, url, options?)`
66
-
67
- 指定されたURLのページのスクリーンショットを撮影します。
68
-
69
- ### `screenshotListener`
70
-
71
- スクリーンショット処理のログを標準出力に出力するための事前設定されたリスナー関数です。
72
-
73
- ```ts
74
- import { screenshot, screenshotListener } from '@d-zero/puppeteer-screenshot';
75
-
76
- const result = await screenshot(page, 'https://example.com', {
77
22
  listener: screenshotListener,
78
23
  });
79
24
  ```
80
25
 
81
- ## 型のエクスポート
82
-
83
- ### `Screenshot`
84
-
85
- `screenshot`関数の戻り値の型です。サイズごとのスクリーンショット結果を含むオブジェクトです。
86
-
87
- ```ts
88
- type Screenshot = {
89
- id: string; // スクリーンショットの識別子
90
- filePath: string | null; // 保存先ファイルパス（pathオプション指定時）
91
- url: string; // 対象URL
92
- title: string; // ページタイトル
93
- binary: Uint8Array | null; // スクリーンショットのバイナリデータ
94
- dom: string; // ページのDOM文字列
95
- text: {
96
- textContent: string; // ページのテキストコンテンツ
97
- altTextList: readonly string[]; // 画像のalt属性リスト
98
- };
99
- } & Size; // サイズ情報（width, height, resolution）
100
- ```
101
-
102
- ### `ScreenshotPhase`
103
-
104
- リスナー関数に渡されるフェーズの型です。
105
-
106
- ### `PageHook`
26
+ `path` を指定すると `save@desktop.png`、`save@mobile.png` のようにサイズ別に保存される。オプション詳細は型定義を参照。
107
27
 
108
- `@d-zero/puppeteer-page-scan`から再エクスポートされるページフック関数の型です。
28
+ スクロール挙動（`scrollInterval` / `scrollDistance`）の決定論的指定が必要なら [`@d-zero/puppeteer-scroll`](../puppeteer-scroll/) を参照。
package/dist/screenshot.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import type { Screenshot, ScreenshotPhase } from './types.js';
2
2
  import type { Listener } from '@d-zero/puppeteer-general-actions';
3
3
  import type { PageHook, Sizes } from '@d-zero/puppeteer-page-scan';
4
+ import type { DelayOptions } from '@d-zero/shared/delay';
4
5
  import type { Page } from 'puppeteer';
5
6
  type Options = {
6
7
  id?: string;
@@ -13,6 +14,8 @@ type Options = {
13
14
  ignore?: string;
14
15
  timeout?: number;
15
16
  openDisclosures?: boolean;
17
+ scrollInterval?: number | DelayOptions;
18
+ scrollDistance?: number | DelayOptions;
16
19
  };
17
20
  /**
18
21
  * Takes screenshots of a web page at different sizes and resolutions.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@d-zero/puppeteer-screenshot",
3
- "version": "3.3.10",
3
+ "version": "3.4.1",
4
4
  "description": "Screenshot utility for puppeteer",
5
5
  "author": "D-ZERO",
6
6
  "license": "MIT",
@@ -23,9 +23,9 @@
23
23
  "clean": "tsc --build --clean"
24
24
  },
25
25
  "dependencies": {
26
- "@d-zero/puppeteer-general-actions": "1.2.3",
27
- "@d-zero/puppeteer-page-scan": "4.4.10",
28
- "@d-zero/shared": "0.21.3"
26
+ "@d-zero/puppeteer-general-actions": "1.2.4",
27
+ "@d-zero/puppeteer-page-scan": "4.5.1",
28
+ "@d-zero/shared": "0.22.0"
29
29
  },
30
30
  "devDependencies": {
31
31
  "puppeteer": "24.37.5"
@@ -38,5 +38,5 @@
38
38
  "url": "https://github.com/d-zero-dev/tools.git",
39
39
  "directory": "packages/@d-zero/puppeteer-screenshot"
40
40
  },
41
- "gitHead": "611614bdfcdfe3ef872efd01a1fd31ebedffdbb2"
41
+ "gitHead": "25b4043dcd70cf3490ddcefd76a88b22c60f7712"
42
42
  }