screenright-client 0.9.12 → 0.9.14

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 (4) hide show
  1. package/dist/index.d.ts +14 -4
  2. package/dist/index.js +30 -5
  3. package/package.json +1 -1
  4. package/src/index.ts +69 -6
package/dist/index.d.ts CHANGED
@@ -1,14 +1,24 @@
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
+ description?: string | undefined;
14
+ };
4
15
  /**
5
16
  * Get screen capture.
6
17
  * @param {Page} page - Playwright's page object.
7
18
  * @param {string} key - Unique key. cannot contain slashes.
8
19
  * @param {string} title - Page title.
9
20
  * @param {string|null} [parentKey] - Parent page key. Creates a hierarchical structure.
10
- * @param {{ waitMilliseconds: number }} [options] - Wait milliseconds before capture.
21
+ * @param {{ waitMilliseconds: number = 0, clickLocatorSelector: string, annotationText: string = "", paddingPixel: number = 4, annotationDirection: AnnotationDirection = "bottom", AnnotationTextColor = "red" }} [options] - Wait milliseconds before capture.
11
22
  */
12
- export declare const capture: (page: Page, key: string, title: string, parentKey?: string, options?: {
13
- waitMilliseconds: number;
14
- }) => Promise<void>;
23
+ export declare const capture: (page: Page, key: string, title: string, parentKey?: string | undefined, options?: CaptureOptions) => Promise<void>;
24
+ 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 = () => {
@@ -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 = { waitMilliseconds: 0 }) => __awaiter(void 0, void 0, void 0, function* () {
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,14 @@ export const capture = (page, key, title, parentKey, options = { waitMillisecond
72
72
  errorOccurred('Capture argument[key] cannot contain slashes.');
73
73
  return;
74
74
  }
75
- const { waitMilliseconds } = options;
75
+ let { waitMilliseconds, clickLocatorSelector, annotationText, paddingPixel, annotationDirection, annotationTextColor, description } = options;
76
+ waitMilliseconds = waitMilliseconds || 0;
77
+ clickLocatorSelector = clickLocatorSelector || undefined;
78
+ annotationText = annotationText || "";
79
+ paddingPixel = paddingPixel || 4;
80
+ annotationDirection = annotationDirection || "bottom";
81
+ annotationTextColor = annotationTextColor || "red";
82
+ description = description || "";
76
83
  if (waitMilliseconds) {
77
84
  const nWaitMilliseconds = Number(waitMilliseconds);
78
85
  if (0 < waitMilliseconds) {
@@ -106,6 +113,7 @@ export const capture = (page, key, title, parentKey, options = { waitMillisecond
106
113
  title,
107
114
  url: page.url(),
108
115
  children: [],
116
+ description: "",
109
117
  };
110
118
  if (parentKey) {
111
119
  const searchParent = (attributes) => {
@@ -122,4 +130,21 @@ export const capture = (page, key, title, parentKey, options = { waitMillisecond
122
130
  else {
123
131
  result.screenshotItemAttributes.push(attribute);
124
132
  }
133
+ if (clickLocatorSelector !== undefined) {
134
+ const locator = page.locator(clickLocatorSelector);
135
+ const bounding = (yield locator.boundingBox());
136
+ const annotation = {
137
+ x: bounding.x,
138
+ y: bounding.y,
139
+ width: bounding.width,
140
+ height: bounding.height,
141
+ text: annotationText,
142
+ paddingPixel,
143
+ direction: annotationDirection,
144
+ textColor: annotationTextColor,
145
+ description,
146
+ };
147
+ result.annotations[key] = annotation;
148
+ yield locator.click();
149
+ }
125
150
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "screenright-client",
3
- "version": "0.9.12",
3
+ "version": "0.9.14",
4
4
  "description": "screenright's nodejs client library",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
package/src/index.ts CHANGED
@@ -10,14 +10,27 @@ type ScreenshotItemAttribute = {
10
10
  title: string
11
11
  url: string
12
12
  children: ScreenshotItemAttribute[]
13
+ description: string
13
14
  }
14
15
 
15
16
  type Result = {
16
17
  diagramId: string
17
18
  screenshotItemAttributes: ScreenshotItemAttribute[]
19
+ annotations: { [index: string]: Annotation }
18
20
  }
19
21
 
20
- const result: Result = { diagramId: "", screenshotItemAttributes: [] }
22
+ type Annotation = {
23
+ x: number
24
+ y: number
25
+ width: number
26
+ height: number
27
+ text: string
28
+ paddingPixel: number
29
+ direction: AnnotationDirection
30
+ textColor: AnnotationTextColor
31
+ }
32
+
33
+ const result: Result = { diagramId: "", screenshotItemAttributes: [], annotations: {} }
21
34
 
22
35
  let deploymentId: string | null = null
23
36
  const deploymentToken: string = process.env.SCREENRIGHT_DEPLOYMENT_TOKEN || ''
@@ -67,27 +80,40 @@ export const finalize = async () => {
67
80
 
68
81
  await fetch(`${baseUrl()}/diagrams/${result.diagramId}/deployments/${deploymentId}/done_upload`, {
69
82
  method: 'PUT',
70
- body: JSON.stringify({ deployment_token: deploymentToken, blueprint: JSON.stringify({ screenshotItemAttributes: result.screenshotItemAttributes}) }),
83
+ body: JSON.stringify({ deployment_token: deploymentToken, blueprint: JSON.stringify({ screenshotItemAttributes: result.screenshotItemAttributes, annotations: result.annotations}) }),
71
84
  headers: { 'Content-Type': 'application/json' }
72
85
  })
73
86
 
74
87
  deploymentId = null
75
88
  }
76
89
 
90
+ type AnnotationDirection = "top" | "right" | "bottom" | "left"
91
+ type AnnotationTextColor = "red" | "blue" | "black" | "white" | "yellow" | "green"
92
+
93
+ type CaptureOptions = {
94
+ waitMilliseconds?: number
95
+ clickLocatorSelector?: string | undefined
96
+ annotationText?: string | undefined
97
+ paddingPixel?: number | undefined
98
+ annotationDirection?: AnnotationDirection | undefined
99
+ annotationTextColor?: AnnotationTextColor | undefined
100
+ description?: string | undefined
101
+ }
102
+
77
103
  /**
78
104
  * Get screen capture.
79
105
  * @param {Page} page - Playwright's page object.
80
106
  * @param {string} key - Unique key. cannot contain slashes.
81
107
  * @param {string} title - Page title.
82
108
  * @param {string|null} [parentKey] - Parent page key. Creates a hierarchical structure.
83
- * @param {{ waitMilliseconds: number }} [options] - Wait milliseconds before capture.
109
+ * @param {{ waitMilliseconds: number = 0, clickLocatorSelector: string, annotationText: string = "", paddingPixel: number = 4, annotationDirection: AnnotationDirection = "bottom", AnnotationTextColor = "red" }} [options] - Wait milliseconds before capture.
84
110
  */
85
111
  export const capture = async (
86
112
  page: Page,
87
113
  key: string,
88
114
  title: string,
89
- parentKey?: string,
90
- options: { waitMilliseconds: number } = { waitMilliseconds: 0 },
115
+ parentKey?: string | undefined,
116
+ options: CaptureOptions = {}
91
117
  ) => {
92
118
  if (deploymentId === null) {
93
119
  return
@@ -98,7 +124,23 @@ export const capture = async (
98
124
  return
99
125
  }
100
126
 
101
- const { waitMilliseconds } = options
127
+ let {
128
+ waitMilliseconds,
129
+ clickLocatorSelector,
130
+ annotationText,
131
+ paddingPixel,
132
+ annotationDirection,
133
+ annotationTextColor,
134
+ description
135
+ } = options
136
+
137
+ waitMilliseconds = waitMilliseconds || 0
138
+ clickLocatorSelector = clickLocatorSelector || undefined
139
+ annotationText = annotationText || ""
140
+ paddingPixel = paddingPixel || 4
141
+ annotationDirection = annotationDirection || "bottom"
142
+ annotationTextColor = annotationTextColor || "red"
143
+ description = description || ""
102
144
 
103
145
  if (waitMilliseconds) {
104
146
  const nWaitMilliseconds = Number(waitMilliseconds)
@@ -137,6 +179,7 @@ export const capture = async (
137
179
  title,
138
180
  url: page.url(),
139
181
  children: [],
182
+ description: "",
140
183
  }
141
184
 
142
185
  if (parentKey) {
@@ -155,4 +198,24 @@ export const capture = async (
155
198
  } else {
156
199
  result.screenshotItemAttributes.push(attribute)
157
200
  }
201
+
202
+ if (clickLocatorSelector !== undefined) {
203
+ const locator = page.locator(clickLocatorSelector!)
204
+ const bounding = (await locator.boundingBox())!
205
+ const annotation = {
206
+ x: bounding.x,
207
+ y: bounding.y,
208
+ width: bounding.width,
209
+ height: bounding.height,
210
+ text: annotationText,
211
+ paddingPixel,
212
+ direction: annotationDirection,
213
+ textColor: annotationTextColor,
214
+ description,
215
+ }
216
+
217
+ result.annotations[key] = annotation
218
+
219
+ await locator.click()
220
+ }
158
221
  }