@syngrisi/wdio-sdk 3.1.2 → 3.1.4
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/dist/WDIODriver.js +2 -3
- package/package.json +3 -3
- package/dist/lib/getDomDump.js +0 -156
package/dist/WDIODriver.js
CHANGED
|
@@ -3,12 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.WDIODriver = exports.
|
|
6
|
+
exports.WDIODriver = exports.collectDomTree = void 0;
|
|
7
7
|
const node_crypto_1 = require("node:crypto");
|
|
8
8
|
const logger_1 = __importDefault(require("./lib/logger"));
|
|
9
|
-
const getDomDump_1 = require("./lib/getDomDump");
|
|
10
|
-
Object.defineProperty(exports, "getDomDump", { enumerable: true, get: function () { return getDomDump_1.getDomDump; } });
|
|
11
9
|
const core_api_1 = require("@syngrisi/core-api");
|
|
10
|
+
Object.defineProperty(exports, "collectDomTree", { enumerable: true, get: function () { return core_api_1.collectDomTree; } });
|
|
12
11
|
const WDIODriver_1 = require("./schemas/WDIODriver");
|
|
13
12
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
14
13
|
const wdioHelpers_1 = require("./lib/wdioHelpers");
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@syngrisi/wdio-sdk",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.4",
|
|
4
4
|
"description": "Syngrisi WebdriverIO SDK",
|
|
5
5
|
"main": "dist/WDIODriver.js",
|
|
6
6
|
"types": "dist/WDIODriver.d.ts",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
},
|
|
39
39
|
"homepage": "https://github.com/syngrisi/syngrisi/tree/main/packages/wdio-sdk#readme",
|
|
40
40
|
"dependencies": {
|
|
41
|
-
"@syngrisi/core-api": "^3.1.
|
|
41
|
+
"@syngrisi/core-api": "^3.1.4",
|
|
42
42
|
"form-data": "^4.0.5",
|
|
43
43
|
"got-cjs": "^12.5.4",
|
|
44
44
|
"loglevel": "^1.9.2",
|
|
@@ -64,5 +64,5 @@
|
|
|
64
64
|
"typescript": "^5.9.3",
|
|
65
65
|
"vitest": "^4.0.15"
|
|
66
66
|
},
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "0e6ece536c5bc282eecb082e820d7d5956ab9cca"
|
|
68
68
|
}
|
package/dist/lib/getDomDump.js
DELETED
|
@@ -1,156 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getDomDump = getDomDump;
|
|
4
|
-
/**
|
|
5
|
-
* Maximum depth for DOM tree traversal to prevent stack overflow
|
|
6
|
-
*/
|
|
7
|
-
const MAX_DEPTH = 15;
|
|
8
|
-
/**
|
|
9
|
-
* Maximum text length to capture for each element
|
|
10
|
-
*/
|
|
11
|
-
const MAX_TEXT_LENGTH = 200;
|
|
12
|
-
/**
|
|
13
|
-
* Tags to skip during DOM collection (non-visual elements)
|
|
14
|
-
*/
|
|
15
|
-
const SKIP_TAGS = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'META', 'LINK', 'HEAD', 'SVG', 'PATH'];
|
|
16
|
-
/**
|
|
17
|
-
* CSS properties to capture for RCA analysis
|
|
18
|
-
*/
|
|
19
|
-
const STYLES_TO_CAPTURE = [
|
|
20
|
-
// Display & Visibility
|
|
21
|
-
'display', 'visibility', 'opacity',
|
|
22
|
-
// Position
|
|
23
|
-
'position', 'top', 'right', 'bottom', 'left',
|
|
24
|
-
// Dimensions
|
|
25
|
-
'width', 'height', 'min-width', 'min-height', 'max-width', 'max-height',
|
|
26
|
-
// Box Model
|
|
27
|
-
'margin', 'margin-top', 'margin-right', 'margin-bottom', 'margin-left',
|
|
28
|
-
'padding', 'padding-top', 'padding-right', 'padding-bottom', 'padding-left',
|
|
29
|
-
'border', 'border-width', 'border-style', 'border-color',
|
|
30
|
-
'border-radius',
|
|
31
|
-
// Colors
|
|
32
|
-
'background-color', 'color',
|
|
33
|
-
// Typography
|
|
34
|
-
'font-family', 'font-size', 'font-weight', 'line-height', 'text-align',
|
|
35
|
-
'text-decoration', 'text-transform', 'letter-spacing',
|
|
36
|
-
// Layout
|
|
37
|
-
'overflow', 'overflow-x', 'overflow-y',
|
|
38
|
-
'z-index',
|
|
39
|
-
'transform',
|
|
40
|
-
// Flexbox
|
|
41
|
-
'flex', 'flex-direction', 'flex-wrap', 'justify-content', 'align-items', 'align-content', 'gap',
|
|
42
|
-
// Grid
|
|
43
|
-
'grid-template-columns', 'grid-template-rows', 'grid-gap',
|
|
44
|
-
// Box Shadow
|
|
45
|
-
'box-shadow',
|
|
46
|
-
];
|
|
47
|
-
/**
|
|
48
|
-
* Check if element is visible (has dimensions and not hidden)
|
|
49
|
-
*/
|
|
50
|
-
function isVisible(el) {
|
|
51
|
-
const style = window.getComputedStyle(el);
|
|
52
|
-
if (style.display === 'none' ||
|
|
53
|
-
style.visibility === 'hidden' ||
|
|
54
|
-
parseFloat(style.opacity) === 0) {
|
|
55
|
-
return false;
|
|
56
|
-
}
|
|
57
|
-
const rect = el.getBoundingClientRect();
|
|
58
|
-
return rect.width > 0 && rect.height > 0;
|
|
59
|
-
}
|
|
60
|
-
/**
|
|
61
|
-
* Extract relevant attributes from element
|
|
62
|
-
* Skips most data-* attributes to reduce payload size
|
|
63
|
-
*/
|
|
64
|
-
function getAttributes(el) {
|
|
65
|
-
const attrs = {};
|
|
66
|
-
for (const attr of Array.from(el.attributes)) {
|
|
67
|
-
// Include data-testid but skip other data-* attributes
|
|
68
|
-
if (!attr.name.startsWith('data-') || attr.name === 'data-testid') {
|
|
69
|
-
attrs[attr.name] = attr.value;
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
return attrs;
|
|
73
|
-
}
|
|
74
|
-
/**
|
|
75
|
-
* Extract computed styles that affect visual appearance
|
|
76
|
-
*/
|
|
77
|
-
function getComputedStyles(el) {
|
|
78
|
-
const computed = window.getComputedStyle(el);
|
|
79
|
-
const styles = {};
|
|
80
|
-
for (const prop of STYLES_TO_CAPTURE) {
|
|
81
|
-
const value = computed.getPropertyValue(prop);
|
|
82
|
-
// Skip default/empty values to reduce payload
|
|
83
|
-
if (value && value !== 'initial' && value !== 'none' && value !== 'normal' && value !== 'auto' && value !== '0px' && value !== 'rgba(0, 0, 0, 0)') {
|
|
84
|
-
// Convert kebab-case to camelCase for consistency
|
|
85
|
-
const camelProp = prop.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
|
|
86
|
-
styles[camelProp] = value;
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
return styles;
|
|
90
|
-
}
|
|
91
|
-
/**
|
|
92
|
-
* Get direct text content (not from children)
|
|
93
|
-
*/
|
|
94
|
-
function getDirectText(el) {
|
|
95
|
-
let text = '';
|
|
96
|
-
for (const child of Array.from(el.childNodes)) {
|
|
97
|
-
if (child.nodeType === Node.TEXT_NODE) {
|
|
98
|
-
text += child.textContent?.trim() || '';
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
// Truncate long text
|
|
102
|
-
const trimmed = text.trim();
|
|
103
|
-
if (!trimmed)
|
|
104
|
-
return undefined;
|
|
105
|
-
return trimmed.length > MAX_TEXT_LENGTH ? trimmed.substring(0, MAX_TEXT_LENGTH) + '...' : trimmed;
|
|
106
|
-
}
|
|
107
|
-
/**
|
|
108
|
-
* Recursively collect DOM node and its children
|
|
109
|
-
*/
|
|
110
|
-
function collectNode(el, depth = 0) {
|
|
111
|
-
// Limit depth to prevent stack overflow
|
|
112
|
-
if (depth > MAX_DEPTH)
|
|
113
|
-
return null;
|
|
114
|
-
// Skip invisible elements
|
|
115
|
-
if (!isVisible(el))
|
|
116
|
-
return null;
|
|
117
|
-
// Skip non-visual elements
|
|
118
|
-
if (SKIP_TAGS.includes(el.tagName))
|
|
119
|
-
return null;
|
|
120
|
-
const rect = el.getBoundingClientRect();
|
|
121
|
-
// Collect children
|
|
122
|
-
const children = [];
|
|
123
|
-
for (const child of Array.from(el.children)) {
|
|
124
|
-
const childNode = collectNode(child, depth + 1);
|
|
125
|
-
if (childNode) {
|
|
126
|
-
children.push(childNode);
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
return {
|
|
130
|
-
tagName: el.tagName.toLowerCase(),
|
|
131
|
-
attributes: getAttributes(el),
|
|
132
|
-
rect: {
|
|
133
|
-
x: Math.round(rect.x),
|
|
134
|
-
y: Math.round(rect.y),
|
|
135
|
-
width: Math.round(rect.width),
|
|
136
|
-
height: Math.round(rect.height),
|
|
137
|
-
},
|
|
138
|
-
computedStyles: getComputedStyles(el),
|
|
139
|
-
children,
|
|
140
|
-
text: getDirectText(el),
|
|
141
|
-
};
|
|
142
|
-
}
|
|
143
|
-
/**
|
|
144
|
-
* Collects DOM tree with computed styles for RCA (Root Cause Analysis)
|
|
145
|
-
* This function runs in browser context via WebdriverIO
|
|
146
|
-
*
|
|
147
|
-
* @param done - Callback function for WebdriverIO async compatibility
|
|
148
|
-
* @returns Serialized DomNode tree as JSON string
|
|
149
|
-
* @hidden - hidden for typedoc
|
|
150
|
-
*/
|
|
151
|
-
function getDomDump(done) {
|
|
152
|
-
const root = collectNode(document.body);
|
|
153
|
-
const result = JSON.stringify(root);
|
|
154
|
-
done(result);
|
|
155
|
-
return result;
|
|
156
|
-
}
|