screenright-client 0.9.11 → 0.9.13
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.d.ts +13 -4
- package/dist/index.js +28 -6
- package/package.json +1 -1
- package/src/index.ts +63 -6
package/dist/index.d.ts
CHANGED
@@ -1,14 +1,23 @@
|
|
1
1
|
import { Page } from '@playwright/test';
|
2
2
|
export declare const initializeScreenwright: (diagramId?: string) => Promise<void>;
|
3
3
|
export declare const finalize: () => Promise<void>;
|
4
|
+
type AnnotationDirection = "top" | "right" | "bottom" | "left";
|
5
|
+
type AnnotationTextColor = "red" | "blue" | "black" | "white" | "yellow" | "green";
|
6
|
+
type CaptureOptions = {
|
7
|
+
waitMilliseconds?: number;
|
8
|
+
clickLocatorSelector?: string | undefined;
|
9
|
+
annotationText?: string | undefined;
|
10
|
+
paddingPixel?: number | undefined;
|
11
|
+
annotationDirection?: AnnotationDirection | undefined;
|
12
|
+
annotationTextColor?: AnnotationTextColor | undefined;
|
13
|
+
};
|
4
14
|
/**
|
5
15
|
* Get screen capture.
|
6
16
|
* @param {Page} page - Playwright's page object.
|
7
17
|
* @param {string} key - Unique key. cannot contain slashes.
|
8
18
|
* @param {string} title - Page title.
|
9
19
|
* @param {string|null} [parentKey] - Parent page key. Creates a hierarchical structure.
|
10
|
-
* @param {{ waitMilliseconds: number }} [options] - Wait milliseconds before capture.
|
20
|
+
* @param {{ waitMilliseconds: number = 0, clickLocatorSelector: string, annotationText: string = "", paddingPixel: number = 4, annotationDirection: AnnotationDirection = "bottom", AnnotationTextColor = "red" }} [options] - Wait milliseconds before capture.
|
11
21
|
*/
|
12
|
-
export declare const capture: (page: Page, key: string, title: string, parentKey?: string, options?:
|
13
|
-
|
14
|
-
}) => Promise<void>;
|
22
|
+
export declare const capture: (page: Page, key: string, title: string, parentKey?: string | undefined, options?: CaptureOptions) => Promise<void>;
|
23
|
+
export {};
|
package/dist/index.js
CHANGED
@@ -11,7 +11,7 @@ import fetch from 'node-fetch';
|
|
11
11
|
import process from 'node:process';
|
12
12
|
import FormData from 'form-data';
|
13
13
|
import { setTimeout } from 'timers/promises';
|
14
|
-
const result = { diagramId: "", screenshotItemAttributes: [] };
|
14
|
+
const result = { diagramId: "", screenshotItemAttributes: [], annotations: {} };
|
15
15
|
let deploymentId = null;
|
16
16
|
const deploymentToken = process.env.SCREENRIGHT_DEPLOYMENT_TOKEN || '';
|
17
17
|
const baseUrl = () => {
|
@@ -22,7 +22,7 @@ const errorOccurred = (message) => {
|
|
22
22
|
deploymentId = null;
|
23
23
|
};
|
24
24
|
export const initializeScreenwright = (diagramId) => __awaiter(void 0, void 0, void 0, function* () {
|
25
|
-
const _diagramId = process.env.SCREENRIGHT_DIAGRAM_ID;
|
25
|
+
const _diagramId = diagramId || process.env.SCREENRIGHT_DIAGRAM_ID;
|
26
26
|
if (!_diagramId || !deploymentToken) {
|
27
27
|
errorOccurred('Not set require environments.');
|
28
28
|
return;
|
@@ -51,7 +51,7 @@ export const finalize = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
51
51
|
}
|
52
52
|
yield fetch(`${baseUrl()}/diagrams/${result.diagramId}/deployments/${deploymentId}/done_upload`, {
|
53
53
|
method: 'PUT',
|
54
|
-
body: JSON.stringify({ deployment_token: deploymentToken, blueprint: JSON.stringify({ screenshotItemAttributes: result.screenshotItemAttributes }) }),
|
54
|
+
body: JSON.stringify({ deployment_token: deploymentToken, blueprint: JSON.stringify({ screenshotItemAttributes: result.screenshotItemAttributes, annotations: result.annotations }) }),
|
55
55
|
headers: { 'Content-Type': 'application/json' }
|
56
56
|
});
|
57
57
|
deploymentId = null;
|
@@ -62,9 +62,9 @@ export const finalize = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
62
62
|
* @param {string} key - Unique key. cannot contain slashes.
|
63
63
|
* @param {string} title - Page title.
|
64
64
|
* @param {string|null} [parentKey] - Parent page key. Creates a hierarchical structure.
|
65
|
-
* @param {{ waitMilliseconds: number }} [options] - Wait milliseconds before capture.
|
65
|
+
* @param {{ waitMilliseconds: number = 0, clickLocatorSelector: string, annotationText: string = "", paddingPixel: number = 4, annotationDirection: AnnotationDirection = "bottom", AnnotationTextColor = "red" }} [options] - Wait milliseconds before capture.
|
66
66
|
*/
|
67
|
-
export const capture = (page, key, title, parentKey, options = {
|
67
|
+
export const capture = (page, key, title, parentKey, options = {}) => __awaiter(void 0, void 0, void 0, function* () {
|
68
68
|
if (deploymentId === null) {
|
69
69
|
return;
|
70
70
|
}
|
@@ -72,7 +72,13 @@ export const capture = (page, key, title, parentKey, options = { waitMillisecond
|
|
72
72
|
errorOccurred('Capture argument[key] cannot contain slashes.');
|
73
73
|
return;
|
74
74
|
}
|
75
|
-
|
75
|
+
let { waitMilliseconds, clickLocatorSelector, annotationText, paddingPixel, annotationDirection, annotationTextColor } = options;
|
76
|
+
waitMilliseconds = waitMilliseconds || 0;
|
77
|
+
clickLocatorSelector = clickLocatorSelector || undefined;
|
78
|
+
annotationText = annotationText || "";
|
79
|
+
paddingPixel = paddingPixel || 4;
|
80
|
+
annotationDirection = annotationDirection || "bottom";
|
81
|
+
annotationTextColor = annotationTextColor || "red";
|
76
82
|
if (waitMilliseconds) {
|
77
83
|
const nWaitMilliseconds = Number(waitMilliseconds);
|
78
84
|
if (0 < waitMilliseconds) {
|
@@ -122,4 +128,20 @@ export const capture = (page, key, title, parentKey, options = { waitMillisecond
|
|
122
128
|
else {
|
123
129
|
result.screenshotItemAttributes.push(attribute);
|
124
130
|
}
|
131
|
+
if (clickLocatorSelector !== undefined) {
|
132
|
+
const locator = page.locator(clickLocatorSelector);
|
133
|
+
const bounding = (yield locator.boundingBox());
|
134
|
+
const annotation = {
|
135
|
+
x: bounding.x,
|
136
|
+
y: bounding.y,
|
137
|
+
width: bounding.width,
|
138
|
+
height: bounding.height,
|
139
|
+
text: annotationText,
|
140
|
+
paddingPixel,
|
141
|
+
direction: annotationDirection,
|
142
|
+
textColor: annotationTextColor,
|
143
|
+
};
|
144
|
+
result.annotations[key] = annotation;
|
145
|
+
yield locator.click();
|
146
|
+
}
|
125
147
|
});
|
package/package.json
CHANGED
package/src/index.ts
CHANGED
@@ -15,9 +15,21 @@ type ScreenshotItemAttribute = {
|
|
15
15
|
type Result = {
|
16
16
|
diagramId: string
|
17
17
|
screenshotItemAttributes: ScreenshotItemAttribute[]
|
18
|
+
annotations: { [index: string]: Annotation }
|
18
19
|
}
|
19
20
|
|
20
|
-
|
21
|
+
type Annotation = {
|
22
|
+
x: number
|
23
|
+
y: number
|
24
|
+
width: number
|
25
|
+
height: number
|
26
|
+
text: string
|
27
|
+
paddingPixel: number
|
28
|
+
direction: AnnotationDirection
|
29
|
+
textColor: AnnotationTextColor
|
30
|
+
}
|
31
|
+
|
32
|
+
const result: Result = { diagramId: "", screenshotItemAttributes: [], annotations: {} }
|
21
33
|
|
22
34
|
let deploymentId: string | null = null
|
23
35
|
const deploymentToken: string = process.env.SCREENRIGHT_DEPLOYMENT_TOKEN || ''
|
@@ -67,27 +79,39 @@ export const finalize = async () => {
|
|
67
79
|
|
68
80
|
await fetch(`${baseUrl()}/diagrams/${result.diagramId}/deployments/${deploymentId}/done_upload`, {
|
69
81
|
method: 'PUT',
|
70
|
-
body: JSON.stringify({ deployment_token: deploymentToken, blueprint: JSON.stringify({ screenshotItemAttributes: result.screenshotItemAttributes}) }),
|
82
|
+
body: JSON.stringify({ deployment_token: deploymentToken, blueprint: JSON.stringify({ screenshotItemAttributes: result.screenshotItemAttributes, annotations: result.annotations}) }),
|
71
83
|
headers: { 'Content-Type': 'application/json' }
|
72
84
|
})
|
73
85
|
|
74
86
|
deploymentId = null
|
75
87
|
}
|
76
88
|
|
89
|
+
type AnnotationDirection = "top" | "right" | "bottom" | "left"
|
90
|
+
type AnnotationTextColor = "red" | "blue" | "black" | "white" | "yellow" | "green"
|
91
|
+
|
92
|
+
type CaptureOptions = {
|
93
|
+
waitMilliseconds?: number
|
94
|
+
clickLocatorSelector?: string | undefined
|
95
|
+
annotationText?: string | undefined
|
96
|
+
paddingPixel?: number | undefined
|
97
|
+
annotationDirection?: AnnotationDirection | undefined
|
98
|
+
annotationTextColor?: AnnotationTextColor | undefined
|
99
|
+
}
|
100
|
+
|
77
101
|
/**
|
78
102
|
* Get screen capture.
|
79
103
|
* @param {Page} page - Playwright's page object.
|
80
104
|
* @param {string} key - Unique key. cannot contain slashes.
|
81
105
|
* @param {string} title - Page title.
|
82
106
|
* @param {string|null} [parentKey] - Parent page key. Creates a hierarchical structure.
|
83
|
-
* @param {{ waitMilliseconds: number }} [options] - Wait milliseconds before capture.
|
107
|
+
* @param {{ waitMilliseconds: number = 0, clickLocatorSelector: string, annotationText: string = "", paddingPixel: number = 4, annotationDirection: AnnotationDirection = "bottom", AnnotationTextColor = "red" }} [options] - Wait milliseconds before capture.
|
84
108
|
*/
|
85
109
|
export const capture = async (
|
86
110
|
page: Page,
|
87
111
|
key: string,
|
88
112
|
title: string,
|
89
|
-
parentKey?: string,
|
90
|
-
options:
|
113
|
+
parentKey?: string | undefined,
|
114
|
+
options: CaptureOptions = {}
|
91
115
|
) => {
|
92
116
|
if (deploymentId === null) {
|
93
117
|
return
|
@@ -98,7 +122,21 @@ export const capture = async (
|
|
98
122
|
return
|
99
123
|
}
|
100
124
|
|
101
|
-
|
125
|
+
let {
|
126
|
+
waitMilliseconds,
|
127
|
+
clickLocatorSelector,
|
128
|
+
annotationText,
|
129
|
+
paddingPixel,
|
130
|
+
annotationDirection,
|
131
|
+
annotationTextColor
|
132
|
+
} = options
|
133
|
+
|
134
|
+
waitMilliseconds = waitMilliseconds || 0
|
135
|
+
clickLocatorSelector = clickLocatorSelector || undefined
|
136
|
+
annotationText = annotationText || ""
|
137
|
+
paddingPixel = paddingPixel || 4
|
138
|
+
annotationDirection = annotationDirection || "bottom"
|
139
|
+
annotationTextColor = annotationTextColor || "red"
|
102
140
|
|
103
141
|
if (waitMilliseconds) {
|
104
142
|
const nWaitMilliseconds = Number(waitMilliseconds)
|
@@ -155,4 +193,23 @@ export const capture = async (
|
|
155
193
|
} else {
|
156
194
|
result.screenshotItemAttributes.push(attribute)
|
157
195
|
}
|
196
|
+
|
197
|
+
if (clickLocatorSelector !== undefined) {
|
198
|
+
const locator = page.locator(clickLocatorSelector!)
|
199
|
+
const bounding = (await locator.boundingBox())!
|
200
|
+
const annotation = {
|
201
|
+
x: bounding.x,
|
202
|
+
y: bounding.y,
|
203
|
+
width: bounding.width,
|
204
|
+
height: bounding.height,
|
205
|
+
text: annotationText,
|
206
|
+
paddingPixel,
|
207
|
+
direction: annotationDirection,
|
208
|
+
textColor: annotationTextColor,
|
209
|
+
}
|
210
|
+
|
211
|
+
result.annotations[key] = annotation
|
212
|
+
|
213
|
+
await locator.click()
|
214
|
+
}
|
158
215
|
}
|