@teamflojo/floimg-screenshot 0.1.0 → 0.2.0
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 +26 -26
- package/package.json +13 -12
- package/LICENSE +0 -21
package/README.md
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
#
|
|
1
|
+
# floimg-screenshot
|
|
2
2
|
|
|
3
|
-
Screenshot generator for
|
|
3
|
+
Screenshot generator for floimg using Playwright headless browser.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
7
7
|
```bash
|
|
8
|
-
npm install
|
|
8
|
+
npm install @teamflojo/floimg @teamflojo/floimg-screenshot
|
|
9
9
|
```
|
|
10
10
|
|
|
11
11
|
This will automatically install Playwright and download Chromium (~200MB).
|
|
@@ -13,10 +13,10 @@ This will automatically install Playwright and download Chromium (~200MB).
|
|
|
13
13
|
## Usage
|
|
14
14
|
|
|
15
15
|
```typescript
|
|
16
|
-
import createClient from '
|
|
17
|
-
import screenshot from '
|
|
16
|
+
import createClient from '@teamflojo/floimg';
|
|
17
|
+
import screenshot from '@teamflojo/floimg-screenshot';
|
|
18
18
|
|
|
19
|
-
const
|
|
19
|
+
const floimg = createClient({
|
|
20
20
|
store: {
|
|
21
21
|
default: 's3',
|
|
22
22
|
s3: { region: 'us-east-1', bucket: 'my-screenshots' }
|
|
@@ -24,10 +24,10 @@ const imgflo = createClient({
|
|
|
24
24
|
});
|
|
25
25
|
|
|
26
26
|
// Register the screenshot generator
|
|
27
|
-
|
|
27
|
+
floimg.registerGenerator(screenshot());
|
|
28
28
|
|
|
29
29
|
// Screenshot a website
|
|
30
|
-
const site = await
|
|
30
|
+
const site = await floimg.generate({
|
|
31
31
|
generator: 'screenshot',
|
|
32
32
|
params: {
|
|
33
33
|
url: 'https://example.com',
|
|
@@ -37,7 +37,7 @@ const site = await imgflo.generate({
|
|
|
37
37
|
});
|
|
38
38
|
|
|
39
39
|
// Upload to S3
|
|
40
|
-
const result = await
|
|
40
|
+
const result = await floimg.save(site, './output/example.png');
|
|
41
41
|
console.log(result.url);
|
|
42
42
|
```
|
|
43
43
|
|
|
@@ -46,10 +46,10 @@ console.log(result.url);
|
|
|
46
46
|
### 1. Website Screenshots
|
|
47
47
|
|
|
48
48
|
```typescript
|
|
49
|
-
await
|
|
49
|
+
await floimg.generate({
|
|
50
50
|
generator: 'screenshot',
|
|
51
51
|
params: {
|
|
52
|
-
url: 'https://github.com/bcooke/
|
|
52
|
+
url: 'https://github.com/bcooke/floimg',
|
|
53
53
|
width: 1280,
|
|
54
54
|
height: 800,
|
|
55
55
|
fullPage: true // Capture entire page
|
|
@@ -62,7 +62,7 @@ await imgflo.generate({
|
|
|
62
62
|
Perfect for generating images from HTML/CSS:
|
|
63
63
|
|
|
64
64
|
```typescript
|
|
65
|
-
await
|
|
65
|
+
await floimg.generate({
|
|
66
66
|
generator: 'screenshot',
|
|
67
67
|
params: {
|
|
68
68
|
html: `
|
|
@@ -82,7 +82,7 @@ await imgflo.generate({
|
|
|
82
82
|
Capture specific elements:
|
|
83
83
|
|
|
84
84
|
```typescript
|
|
85
|
-
await
|
|
85
|
+
await floimg.generate({
|
|
86
86
|
generator: 'screenshot',
|
|
87
87
|
params: {
|
|
88
88
|
url: 'https://example.com',
|
|
@@ -98,7 +98,7 @@ await imgflo.generate({
|
|
|
98
98
|
Wait for dynamic content to load:
|
|
99
99
|
|
|
100
100
|
```typescript
|
|
101
|
-
await
|
|
101
|
+
await floimg.generate({
|
|
102
102
|
generator: 'screenshot',
|
|
103
103
|
params: {
|
|
104
104
|
url: 'https://example.com/dashboard',
|
|
@@ -111,7 +111,7 @@ await imgflo.generate({
|
|
|
111
111
|
### 5. High DPI / Retina Screenshots
|
|
112
112
|
|
|
113
113
|
```typescript
|
|
114
|
-
await
|
|
114
|
+
await floimg.generate({
|
|
115
115
|
generator: 'screenshot',
|
|
116
116
|
params: {
|
|
117
117
|
url: 'https://example.com',
|
|
@@ -127,7 +127,7 @@ await imgflo.generate({
|
|
|
127
127
|
### Generator Options
|
|
128
128
|
|
|
129
129
|
```typescript
|
|
130
|
-
|
|
130
|
+
floimg.registerGenerator(screenshot({
|
|
131
131
|
persistent: true, // Reuse browser instance (faster)
|
|
132
132
|
defaultWidth: 1920,
|
|
133
133
|
defaultHeight: 1080,
|
|
@@ -144,12 +144,12 @@ For better performance when taking multiple screenshots:
|
|
|
144
144
|
|
|
145
145
|
```typescript
|
|
146
146
|
const screenshotGen = screenshot({ persistent: true });
|
|
147
|
-
|
|
147
|
+
floimg.registerGenerator(screenshotGen);
|
|
148
148
|
|
|
149
149
|
// Take multiple screenshots - browser stays open
|
|
150
|
-
await
|
|
151
|
-
await
|
|
152
|
-
await
|
|
150
|
+
await floimg.generate({ generator: 'screenshot', params: { url: 'https://site1.com' } });
|
|
151
|
+
await floimg.generate({ generator: 'screenshot', params: { url: 'https://site2.com' } });
|
|
152
|
+
await floimg.generate({ generator: 'screenshot', params: { url: 'https://site3.com' } });
|
|
153
153
|
|
|
154
154
|
// Browser closes when process exits
|
|
155
155
|
```
|
|
@@ -177,7 +177,7 @@ await imgflo.generate({ generator: 'screenshot', params: { url: 'https://site3.c
|
|
|
177
177
|
Generate OG images from HTML:
|
|
178
178
|
|
|
179
179
|
```typescript
|
|
180
|
-
const ogImage = await
|
|
180
|
+
const ogImage = await floimg.generate({
|
|
181
181
|
generator: 'screenshot',
|
|
182
182
|
params: {
|
|
183
183
|
html: `
|
|
@@ -219,7 +219,7 @@ const ogImage = await imgflo.generate({
|
|
|
219
219
|
Capture a live dashboard:
|
|
220
220
|
|
|
221
221
|
```typescript
|
|
222
|
-
const dashboard = await
|
|
222
|
+
const dashboard = await floimg.generate({
|
|
223
223
|
generator: 'screenshot',
|
|
224
224
|
params: {
|
|
225
225
|
url: 'https://internal-dashboard.company.com',
|
|
@@ -234,7 +234,7 @@ const dashboard = await imgflo.generate({
|
|
|
234
234
|
### Mobile Viewport
|
|
235
235
|
|
|
236
236
|
```typescript
|
|
237
|
-
const mobile = await
|
|
237
|
+
const mobile = await floimg.generate({
|
|
238
238
|
generator: 'screenshot',
|
|
239
239
|
params: {
|
|
240
240
|
url: 'https://example.com',
|
|
@@ -275,7 +275,7 @@ npx playwright install-deps chromium
|
|
|
275
275
|
Increase timeout for slow-loading pages:
|
|
276
276
|
|
|
277
277
|
```typescript
|
|
278
|
-
await
|
|
278
|
+
await floimg.generate({
|
|
279
279
|
generator: 'screenshot',
|
|
280
280
|
params: {
|
|
281
281
|
url: 'https://slow-site.com',
|
|
@@ -289,7 +289,7 @@ await imgflo.generate({
|
|
|
289
289
|
Ensure selector exists:
|
|
290
290
|
|
|
291
291
|
```typescript
|
|
292
|
-
await
|
|
292
|
+
await floimg.generate({
|
|
293
293
|
generator: 'screenshot',
|
|
294
294
|
params: {
|
|
295
295
|
url: 'https://example.com',
|
|
@@ -312,5 +312,5 @@ MIT
|
|
|
312
312
|
|
|
313
313
|
## See Also
|
|
314
314
|
|
|
315
|
-
- [
|
|
315
|
+
- [floimg](https://github.com/bcooke/floimg) - Core library
|
|
316
316
|
- [Playwright](https://playwright.dev) - Browser automation
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@teamflojo/floimg-screenshot",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Screenshot generator for floimg using Playwright headless browser",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -16,6 +16,15 @@
|
|
|
16
16
|
"README.md",
|
|
17
17
|
"LICENSE"
|
|
18
18
|
],
|
|
19
|
+
"scripts": {
|
|
20
|
+
"build": "tsc",
|
|
21
|
+
"dev": "tsc --watch",
|
|
22
|
+
"test": "vitest",
|
|
23
|
+
"typecheck": "tsc --noEmit",
|
|
24
|
+
"clean": "rm -rf dist",
|
|
25
|
+
"postinstall": "playwright install chromium",
|
|
26
|
+
"prepublishOnly": "npm run build"
|
|
27
|
+
},
|
|
19
28
|
"keywords": [
|
|
20
29
|
"floimg",
|
|
21
30
|
"screenshot",
|
|
@@ -39,19 +48,11 @@
|
|
|
39
48
|
},
|
|
40
49
|
"devDependencies": {
|
|
41
50
|
"@types/node": "^22.10.2",
|
|
51
|
+
"@teamflojo/floimg": "workspace:*",
|
|
42
52
|
"typescript": "^5.7.2",
|
|
43
|
-
"vitest": "^2.1.8"
|
|
44
|
-
"@teamflojo/floimg": "0.1.0"
|
|
53
|
+
"vitest": "^2.1.8"
|
|
45
54
|
},
|
|
46
55
|
"engines": {
|
|
47
56
|
"node": ">=18.0.0"
|
|
48
|
-
},
|
|
49
|
-
"scripts": {
|
|
50
|
-
"build": "tsc",
|
|
51
|
-
"dev": "tsc --watch",
|
|
52
|
-
"test": "vitest",
|
|
53
|
-
"typecheck": "tsc --noEmit",
|
|
54
|
-
"clean": "rm -rf dist",
|
|
55
|
-
"postinstall": "playwright install chromium"
|
|
56
57
|
}
|
|
57
|
-
}
|
|
58
|
+
}
|
package/LICENSE
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2024 Brett Cooke
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|