screenright-client 0.9.13 → 0.9.20
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +55 -3
- package/dist/index.d.ts +1 -0
- package/dist/index.js +4 -1
- package/package.json +1 -1
- package/src/index.ts +25 -10
package/README.md
CHANGED
@@ -1,15 +1,67 @@
|
|
1
1
|
# ScreenRight nodejs client library.
|
2
2
|
|
3
|
-
##
|
3
|
+
## Installation
|
4
|
+
```
|
5
|
+
npm i screenright-client
|
6
|
+
```
|
7
|
+
|
8
|
+
## Setup environments
|
4
9
|
|
5
10
|
### Diagram Id
|
6
11
|
|
7
12
|
```
|
8
|
-
SCREENRIGHT_DIAGRAM_ID
|
13
|
+
export SCREENRIGHT_DIAGRAM_ID=xxxxxxx
|
9
14
|
```
|
10
15
|
|
11
16
|
### Deployment Token
|
12
17
|
```
|
13
|
-
SCREENRIGHT_DEPLOYMENT_TOKEN
|
18
|
+
export SCREENRIGHT_DEPLOYMENT_TOKEN=xxxxxxx
|
19
|
+
```
|
20
|
+
|
21
|
+
## Implementation
|
22
|
+
|
23
|
+
### with "Playwright"
|
24
|
+
|
25
|
+
```
|
26
|
+
import { capture, initializeScreenwright, finalize } from "screenright-client"
|
27
|
+
|
28
|
+
test("basic test", async ({ page }) => {
|
29
|
+
|
30
|
+
await initializeScreenwright() // The diagram ID specified in the environment variable is used.
|
31
|
+
// await initializeScreenwright(diagramId) <- The diagram ID specified in the argument is used.
|
32
|
+
|
33
|
+
|
34
|
+
// With the key home, capture with the title "Home Screen".
|
35
|
+
await capture(page, "home", "Home Screen")
|
36
|
+
|
37
|
+
|
38
|
+
// Created with "setting" as the parent screen.
|
39
|
+
await capture(
|
40
|
+
page,
|
41
|
+
"setting|projects",
|
42
|
+
"Project list",
|
43
|
+
"setting"
|
44
|
+
)
|
45
|
+
|
46
|
+
|
47
|
+
// Specify options.
|
48
|
+
await capture(
|
49
|
+
page,
|
50
|
+
"home",
|
51
|
+
"Home Screen",
|
52
|
+
undefined,
|
53
|
+
{
|
54
|
+
waitMilliseconds: 200, // wait before capturing.
|
55
|
+
clickLocatorSelector: `button:text("delete)`, // specify the element you want to click.
|
56
|
+
annotationText: "Click here!", // specify the annotation.
|
57
|
+
annotationDirection: "bottom", // Specifies the position of the annotation from the element.
|
58
|
+
paddingPixel: 4, // Specifies the padding for the border surrounding the element.
|
59
|
+
annotationTextColor: "red" | "blue" | "black" | "white" | "yellow" | "green"
|
60
|
+
description: "write a description"
|
61
|
+
}
|
62
|
+
)
|
63
|
+
|
64
|
+
await finalize()
|
65
|
+
})
|
14
66
|
```
|
15
67
|
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
@@ -72,13 +72,14 @@ export const capture = (page, key, title, parentKey, options = {}) => __awaiter(
|
|
72
72
|
errorOccurred('Capture argument[key] cannot contain slashes.');
|
73
73
|
return;
|
74
74
|
}
|
75
|
-
let { waitMilliseconds, clickLocatorSelector, annotationText, paddingPixel, annotationDirection, annotationTextColor } = options;
|
75
|
+
let { waitMilliseconds, clickLocatorSelector, annotationText, paddingPixel, annotationDirection, annotationTextColor, description } = options;
|
76
76
|
waitMilliseconds = waitMilliseconds || 0;
|
77
77
|
clickLocatorSelector = clickLocatorSelector || undefined;
|
78
78
|
annotationText = annotationText || "";
|
79
79
|
paddingPixel = paddingPixel || 4;
|
80
80
|
annotationDirection = annotationDirection || "bottom";
|
81
81
|
annotationTextColor = annotationTextColor || "red";
|
82
|
+
description = description || "";
|
82
83
|
if (waitMilliseconds) {
|
83
84
|
const nWaitMilliseconds = Number(waitMilliseconds);
|
84
85
|
if (0 < waitMilliseconds) {
|
@@ -112,6 +113,7 @@ export const capture = (page, key, title, parentKey, options = {}) => __awaiter(
|
|
112
113
|
title,
|
113
114
|
url: page.url(),
|
114
115
|
children: [],
|
116
|
+
description: "",
|
115
117
|
};
|
116
118
|
if (parentKey) {
|
117
119
|
const searchParent = (attributes) => {
|
@@ -140,6 +142,7 @@ export const capture = (page, key, title, parentKey, options = {}) => __awaiter(
|
|
140
142
|
paddingPixel,
|
141
143
|
direction: annotationDirection,
|
142
144
|
textColor: annotationTextColor,
|
145
|
+
description,
|
143
146
|
};
|
144
147
|
result.annotations[key] = annotation;
|
145
148
|
yield locator.click();
|
package/package.json
CHANGED
package/src/index.ts
CHANGED
@@ -1,4 +1,3 @@
|
|
1
|
-
import * as fs from 'fs'
|
2
1
|
import { Page } from '@playwright/test'
|
3
2
|
import fetch from 'node-fetch'
|
4
3
|
import process from 'node:process'
|
@@ -10,6 +9,7 @@ type ScreenshotItemAttribute = {
|
|
10
9
|
title: string
|
11
10
|
url: string
|
12
11
|
children: ScreenshotItemAttribute[]
|
12
|
+
description: string
|
13
13
|
}
|
14
14
|
|
15
15
|
type Result = {
|
@@ -34,9 +34,7 @@ const result: Result = { diagramId: "", screenshotItemAttributes: [], annotation
|
|
34
34
|
let deploymentId: string | null = null
|
35
35
|
const deploymentToken: string = process.env.SCREENRIGHT_DEPLOYMENT_TOKEN || ''
|
36
36
|
|
37
|
-
const baseUrl =
|
38
|
-
return `${process.env.SCREENRIGHT_ENDPOINT}/client_api`
|
39
|
-
}
|
37
|
+
const baseUrl = `${process.env.SCREENRIGHT_ENDPOINT || 'https://screenright.app'}/client_api`
|
40
38
|
|
41
39
|
const errorOccurred = (message: string) => {
|
42
40
|
console.error('[ScreenRight] Error occurred', message)
|
@@ -54,7 +52,7 @@ export const initializeScreenwright = async (diagramId?: string) => {
|
|
54
52
|
result.diagramId = _diagramId
|
55
53
|
|
56
54
|
try {
|
57
|
-
const response = await fetch(`${baseUrl
|
55
|
+
const response = await fetch(`${baseUrl}/diagrams/${result.diagramId}/deployments`, {
|
58
56
|
method: 'POST',
|
59
57
|
body: JSON.stringify({ deployment_token: deploymentToken }),
|
60
58
|
headers: { 'Content-Type': 'application/json' }
|
@@ -77,9 +75,15 @@ export const finalize = async () => {
|
|
77
75
|
return
|
78
76
|
}
|
79
77
|
|
80
|
-
await fetch(`${baseUrl
|
78
|
+
await fetch(`${baseUrl}/diagrams/${result.diagramId}/deployments/${deploymentId}/done_upload`, {
|
81
79
|
method: 'PUT',
|
82
|
-
body: JSON.stringify({
|
80
|
+
body: JSON.stringify({
|
81
|
+
deployment_token: deploymentToken,
|
82
|
+
blueprint: JSON.stringify({
|
83
|
+
screenshotItemAttributes: result.screenshotItemAttributes,
|
84
|
+
annotations: result.annotations
|
85
|
+
})
|
86
|
+
}),
|
83
87
|
headers: { 'Content-Type': 'application/json' }
|
84
88
|
})
|
85
89
|
|
@@ -96,6 +100,7 @@ type CaptureOptions = {
|
|
96
100
|
paddingPixel?: number | undefined
|
97
101
|
annotationDirection?: AnnotationDirection | undefined
|
98
102
|
annotationTextColor?: AnnotationTextColor | undefined
|
103
|
+
description?: string | undefined
|
99
104
|
}
|
100
105
|
|
101
106
|
/**
|
@@ -104,7 +109,13 @@ type CaptureOptions = {
|
|
104
109
|
* @param {string} key - Unique key. cannot contain slashes.
|
105
110
|
* @param {string} title - Page title.
|
106
111
|
* @param {string|null} [parentKey] - Parent page key. Creates a hierarchical structure.
|
107
|
-
* @param {{
|
112
|
+
* @param {{}} [options] -
|
113
|
+
* waitMilliseconds: number = 0, Wait milliseconds before capture.
|
114
|
+
* clickLocatorSelector: string,
|
115
|
+
* annotationText: string = "",
|
116
|
+
* paddingPixel: number = 4,
|
117
|
+
* annotationDirection: AnnotationDirection = "bottom",
|
118
|
+
* AnnotationTextColor = "red"
|
108
119
|
*/
|
109
120
|
export const capture = async (
|
110
121
|
page: Page,
|
@@ -128,7 +139,8 @@ export const capture = async (
|
|
128
139
|
annotationText,
|
129
140
|
paddingPixel,
|
130
141
|
annotationDirection,
|
131
|
-
annotationTextColor
|
142
|
+
annotationTextColor,
|
143
|
+
description
|
132
144
|
} = options
|
133
145
|
|
134
146
|
waitMilliseconds = waitMilliseconds || 0
|
@@ -137,6 +149,7 @@ export const capture = async (
|
|
137
149
|
paddingPixel = paddingPixel || 4
|
138
150
|
annotationDirection = annotationDirection || "bottom"
|
139
151
|
annotationTextColor = annotationTextColor || "red"
|
152
|
+
description = description || ""
|
140
153
|
|
141
154
|
if (waitMilliseconds) {
|
142
155
|
const nWaitMilliseconds = Number(waitMilliseconds)
|
@@ -152,7 +165,7 @@ export const capture = async (
|
|
152
165
|
|
153
166
|
formData.append('file', buffer, fileName)
|
154
167
|
|
155
|
-
const response = await fetch(`${baseUrl
|
168
|
+
const response = await fetch(`${baseUrl}/diagrams/${result.diagramId}/deployments/${deploymentId}/screenshot`, {
|
156
169
|
method: 'POST',
|
157
170
|
headers: {
|
158
171
|
'X-File-Key': key,
|
@@ -175,6 +188,7 @@ export const capture = async (
|
|
175
188
|
title,
|
176
189
|
url: page.url(),
|
177
190
|
children: [],
|
191
|
+
description: "",
|
178
192
|
}
|
179
193
|
|
180
194
|
if (parentKey) {
|
@@ -206,6 +220,7 @@ export const capture = async (
|
|
206
220
|
paddingPixel,
|
207
221
|
direction: annotationDirection,
|
208
222
|
textColor: annotationTextColor,
|
223
|
+
description,
|
209
224
|
}
|
210
225
|
|
211
226
|
result.annotations[key] = annotation
|