@cronn/element-snapshot 0.10.0 → 0.12.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 +5 -4
- package/dist/browser-lib.iife.js +721 -0
- package/dist/index.d.mts +191 -0
- package/dist/index.mjs +180 -0
- package/package.json +17 -9
- package/dist/browser-lib.d.ts +0 -131
- package/dist/browser-lib.global.js +0 -784
- package/dist/index.d.ts +0 -161
- package/dist/index.js +0 -169
package/dist/index.d.ts
DELETED
|
@@ -1,161 +0,0 @@
|
|
|
1
|
-
import { Locator } from '@playwright/test';
|
|
2
|
-
|
|
3
|
-
interface DisableableAttributes {
|
|
4
|
-
disabled?: boolean;
|
|
5
|
-
}
|
|
6
|
-
interface SelectableAttributes {
|
|
7
|
-
selected?: boolean;
|
|
8
|
-
}
|
|
9
|
-
interface InputStateAttributes extends DisableableAttributes {
|
|
10
|
-
readonly?: boolean;
|
|
11
|
-
required?: boolean;
|
|
12
|
-
invalid?: boolean;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
interface ButtonSnapshot extends GenericElementSnapshot<"button", ButtonAttributes> {
|
|
16
|
-
}
|
|
17
|
-
interface ButtonAttributes extends DisableableAttributes {
|
|
18
|
-
expanded?: boolean;
|
|
19
|
-
pressed?: PressedValue;
|
|
20
|
-
}
|
|
21
|
-
type PressedValue = true | "mixed";
|
|
22
|
-
|
|
23
|
-
interface DiscribableAttributes {
|
|
24
|
-
description?: string;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
interface InputSnapshot extends GenericElementSnapshot<CommonInputRole, InputAttributes> {
|
|
28
|
-
}
|
|
29
|
-
type InputRole = "button" | "combobox" | CommonInputRole;
|
|
30
|
-
type CommonInputRole = "checkbox" | "radio" | "searchbox" | "slider" | "spinbutton" | "textbox";
|
|
31
|
-
interface InputAttributes extends CommonInputAttributes {
|
|
32
|
-
value?: string;
|
|
33
|
-
checked?: boolean;
|
|
34
|
-
}
|
|
35
|
-
interface CommonInputAttributes extends InputStateAttributes, DiscribableAttributes {
|
|
36
|
-
placeholder?: string;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
interface ComboboxSnapshot extends GenericElementSnapshot<"combobox", ComboboxAttributes> {
|
|
40
|
-
options?: Array<OptionSnapshot>;
|
|
41
|
-
}
|
|
42
|
-
interface ComboboxAttributes extends CommonInputAttributes {
|
|
43
|
-
value?: string | Array<string>;
|
|
44
|
-
}
|
|
45
|
-
interface OptionSnapshot extends GenericElementSnapshot<"option", OptionAttributes> {
|
|
46
|
-
}
|
|
47
|
-
interface OptionAttributes {
|
|
48
|
-
selected?: boolean;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
declare const CONTAINER_ROLES: Set<"paragraph" | "list" | "listitem" | "listbox" | "article" | "banner" | "complementary" | "contentinfo" | "form" | "main" | "navigation" | "region" | "search" | "term" | "definition" | "table" | "grid" | "rowgroup" | "row" | "rowheader" | "cell" | "gridcell" | "alert" | "menu" | "tablist" | "tabpanel" | "separator">;
|
|
52
|
-
interface ContainerSnapshot extends GenericElementSnapshot<ContainerRole> {
|
|
53
|
-
}
|
|
54
|
-
type ContainerRole = SetValues<typeof CONTAINER_ROLES>;
|
|
55
|
-
|
|
56
|
-
interface DialogSnapshot extends GenericElementSnapshot<DialogRole, DialogAttributes> {
|
|
57
|
-
}
|
|
58
|
-
type DialogRole = "dialog" | "alertdialog";
|
|
59
|
-
interface DialogAttributes extends DiscribableAttributes {
|
|
60
|
-
modal?: boolean;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
interface GroupSnapshot extends GenericElementSnapshot<"group"> {
|
|
64
|
-
}
|
|
65
|
-
interface RadiogroupSnapshot extends GenericElementSnapshot<"radiogroup", RadiogroupAttributes> {
|
|
66
|
-
}
|
|
67
|
-
interface RadiogroupAttributes extends DiscribableAttributes {
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
interface HeadingSnapshot extends GenericElementSnapshot<"heading", HeadingAttributes> {
|
|
71
|
-
}
|
|
72
|
-
interface HeadingAttributes {
|
|
73
|
-
level?: number;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
interface ImageSnapshot extends GenericElementSnapshot<"img"> {
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
interface LinkSnapshot extends GenericElementSnapshot<"link", LinkAttributes> {
|
|
80
|
-
}
|
|
81
|
-
interface LinkAttributes {
|
|
82
|
-
url?: string;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
interface MenuitemSnapshot extends GenericElementSnapshot<"menuitem", MenuitemAttributes> {
|
|
86
|
-
}
|
|
87
|
-
interface MenuitemAttributes extends LinkAttributes, DisableableAttributes {
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
interface ProgressbarSnapshot extends GenericElementSnapshot<"progressbar", ProgressbarAttributes> {
|
|
91
|
-
}
|
|
92
|
-
interface ProgressbarAttributes {
|
|
93
|
-
value?: number;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
interface TabSnapshot extends GenericElementSnapshot<"tab", TabAttributes> {
|
|
97
|
-
}
|
|
98
|
-
interface TabAttributes extends DisableableAttributes, SelectableAttributes {
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
interface ColumnheaderSnapshot extends GenericElementSnapshot<"columnheader", ColumnheaderAttributes> {
|
|
102
|
-
}
|
|
103
|
-
interface ColumnheaderAttributes {
|
|
104
|
-
sort?: SortAttribute;
|
|
105
|
-
}
|
|
106
|
-
declare const SORT_ATTRIBUTES: Set<"ascending" | "descending" | "other">;
|
|
107
|
-
type SortAttribute = SetValues<typeof SORT_ATTRIBUTES>;
|
|
108
|
-
|
|
109
|
-
interface TextSnapshot {
|
|
110
|
-
role: "text";
|
|
111
|
-
name: string;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
type NodeRole = ElementRole | "text";
|
|
115
|
-
type ElementRole = "heading" | "link" | "button" | "option" | "tab" | "menuitem" | "columnheader" | "group" | "radiogroup" | "progressbar" | "img" | ContainerRole | InputRole | DialogRole;
|
|
116
|
-
type NodeSnapshot = ElementSnapshot | TextSnapshot;
|
|
117
|
-
type ElementSnapshot = ContainerSnapshot | HeadingSnapshot | LinkSnapshot | ButtonSnapshot | InputSnapshot | ComboboxSnapshot | OptionSnapshot | DialogSnapshot | TabSnapshot | MenuitemSnapshot | ColumnheaderSnapshot | GroupSnapshot | RadiogroupSnapshot | ProgressbarSnapshot | ImageSnapshot;
|
|
118
|
-
interface GenericElementSnapshot<TRole extends NodeRole = NodeRole, TAttributes = unknown> {
|
|
119
|
-
role: TRole;
|
|
120
|
-
name?: string;
|
|
121
|
-
attributes?: TAttributes;
|
|
122
|
-
children?: Array<NodeSnapshot>;
|
|
123
|
-
}
|
|
124
|
-
type SetValues<TSet> = TSet extends Set<infer TValue> ? TValue : never;
|
|
125
|
-
|
|
126
|
-
type SnapshotFilter = (node: NodeSnapshot) => boolean;
|
|
127
|
-
|
|
128
|
-
interface ElementSnapshotOptions {
|
|
129
|
-
/**
|
|
130
|
-
* Include only elements in the snapshot for which the specified filter returns `true`
|
|
131
|
-
*
|
|
132
|
-
* @default () => true
|
|
133
|
-
*/
|
|
134
|
-
filter?: SnapshotFilter;
|
|
135
|
-
/**
|
|
136
|
-
* Include combobox options in the snapshot
|
|
137
|
-
*
|
|
138
|
-
* @default false
|
|
139
|
-
*/
|
|
140
|
-
includeComboboxOptions?: boolean;
|
|
141
|
-
}
|
|
142
|
-
/**
|
|
143
|
-
* Creates an Element Snapshot of the specified element
|
|
144
|
-
*
|
|
145
|
-
* @example
|
|
146
|
-
* ```ts
|
|
147
|
-
* await expect(snapshotElement(page.getByRole("main"))).toMatchJsonSnapshot();
|
|
148
|
-
* ```
|
|
149
|
-
* @param locator Locator for the element to snapshot
|
|
150
|
-
* @experimental
|
|
151
|
-
*/
|
|
152
|
-
declare function snapshotElement(locator: Locator, options?: ElementSnapshotOptions): Promise<unknown>;
|
|
153
|
-
/**
|
|
154
|
-
* Creates an Element Snapshot of the specified element, returning the raw snapshot data for custom transformations
|
|
155
|
-
*
|
|
156
|
-
* @param locator Locator for the element to snapshot
|
|
157
|
-
* @experimental
|
|
158
|
-
*/
|
|
159
|
-
declare function snapshotElementRaw(locator: Locator): Promise<Array<NodeSnapshot>>;
|
|
160
|
-
|
|
161
|
-
export { type ButtonSnapshot, type ColumnheaderSnapshot, type ComboboxSnapshot, type ContainerSnapshot, type DialogSnapshot, type ElementRole, type ElementSnapshot, type GroupSnapshot, type HeadingSnapshot, type InputSnapshot, type LinkSnapshot, type MenuitemSnapshot, type NodeRole, type NodeSnapshot, type OptionSnapshot, type ProgressbarSnapshot, type RadiogroupSnapshot, type TabSnapshot, type TextSnapshot, snapshotElement, snapshotElementRaw };
|
package/dist/index.js
DELETED
|
@@ -1,169 +0,0 @@
|
|
|
1
|
-
// src/playwright/proxy.ts
|
|
2
|
-
import path from "path";
|
|
3
|
-
import { packageDirectory } from "package-directory";
|
|
4
|
-
var ElementSnapshotProxy = class {
|
|
5
|
-
page;
|
|
6
|
-
constructor(page) {
|
|
7
|
-
this.page = page;
|
|
8
|
-
}
|
|
9
|
-
async snapshotElement(locator) {
|
|
10
|
-
if (!await this.isLibraryLoaded()) {
|
|
11
|
-
await this.loadLibrary();
|
|
12
|
-
}
|
|
13
|
-
return await locator.evaluate((element) => {
|
|
14
|
-
return window.snapshotElement(element);
|
|
15
|
-
});
|
|
16
|
-
}
|
|
17
|
-
async isLibraryLoaded() {
|
|
18
|
-
return await this.page.evaluate(
|
|
19
|
-
() => typeof window.snapshotElement === "function"
|
|
20
|
-
);
|
|
21
|
-
}
|
|
22
|
-
async loadLibrary() {
|
|
23
|
-
const packageRootDir = await this.resolvePackageRootDir();
|
|
24
|
-
const libPath = path.resolve(
|
|
25
|
-
packageRootDir,
|
|
26
|
-
"dist",
|
|
27
|
-
"browser-lib.global.js"
|
|
28
|
-
);
|
|
29
|
-
await this.page.addScriptTag({
|
|
30
|
-
path: libPath
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
async resolvePackageRootDir() {
|
|
34
|
-
const packageDir = await packageDirectory({
|
|
35
|
-
cwd: import.meta.dirname
|
|
36
|
-
});
|
|
37
|
-
if (packageDir === void 0) {
|
|
38
|
-
throw new Error("Unable to resolve root directory of package");
|
|
39
|
-
}
|
|
40
|
-
return packageDir;
|
|
41
|
-
}
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
// src/playwright/transformer.ts
|
|
45
|
-
var ElementSnapshotTransformer = class {
|
|
46
|
-
filter;
|
|
47
|
-
includeComboboxOptions;
|
|
48
|
-
constructor(options = {}) {
|
|
49
|
-
this.filter = options.filter ?? (() => true);
|
|
50
|
-
this.includeComboboxOptions = options.includeComboboxOptions ?? false;
|
|
51
|
-
}
|
|
52
|
-
transform(snapshots) {
|
|
53
|
-
const transformedSnapshots = this.filterAndTransformSnapshots(snapshots);
|
|
54
|
-
if (transformedSnapshots.length === 1) {
|
|
55
|
-
return transformedSnapshots.at(0);
|
|
56
|
-
}
|
|
57
|
-
return transformedSnapshots;
|
|
58
|
-
}
|
|
59
|
-
filterAndTransformSnapshots(snapshots) {
|
|
60
|
-
return snapshots.flatMap((snapshot) => {
|
|
61
|
-
if (this.filter(snapshot)) {
|
|
62
|
-
return this.transformSnapshotRecursive(snapshot);
|
|
63
|
-
}
|
|
64
|
-
if ("children" in snapshot) {
|
|
65
|
-
return this.filterAndTransformSnapshots(snapshot.children ?? []);
|
|
66
|
-
}
|
|
67
|
-
return [];
|
|
68
|
-
});
|
|
69
|
-
}
|
|
70
|
-
transformSnapshotRecursive(snapshot) {
|
|
71
|
-
if (snapshot.role === "text") {
|
|
72
|
-
return this.simplifyTextSnapshot(snapshot);
|
|
73
|
-
}
|
|
74
|
-
return this.simplifyElementSnapshot(snapshot);
|
|
75
|
-
}
|
|
76
|
-
simplifyTextSnapshot(snapshot) {
|
|
77
|
-
return snapshot.name;
|
|
78
|
-
}
|
|
79
|
-
simplifyElementSnapshot(snapshot) {
|
|
80
|
-
const normalizedSnapshot = this.normalizeElementSnapshot(snapshot);
|
|
81
|
-
if (this.isEmpty(normalizedSnapshot)) {
|
|
82
|
-
const { role: role2 } = normalizedSnapshot;
|
|
83
|
-
return this.transformedSnapshot(role2, "");
|
|
84
|
-
}
|
|
85
|
-
if (this.hasOnlyName(normalizedSnapshot)) {
|
|
86
|
-
const { role: role2, name: name2 } = normalizedSnapshot;
|
|
87
|
-
return this.transformedSnapshot(role2, name2);
|
|
88
|
-
}
|
|
89
|
-
if (this.hasOnlyChildren(normalizedSnapshot)) {
|
|
90
|
-
const { role: role2, children: children2 } = normalizedSnapshot;
|
|
91
|
-
return this.transformedSnapshot(
|
|
92
|
-
role2,
|
|
93
|
-
children2.length === 1 ? children2.at(0) : children2
|
|
94
|
-
);
|
|
95
|
-
}
|
|
96
|
-
if (snapshot.role === "combobox") {
|
|
97
|
-
return this.simplifyComboboxSnapshot(snapshot);
|
|
98
|
-
}
|
|
99
|
-
const { role, name, attributes, children } = normalizedSnapshot;
|
|
100
|
-
return this.transformedSnapshot(role, {
|
|
101
|
-
name,
|
|
102
|
-
...attributes,
|
|
103
|
-
children
|
|
104
|
-
});
|
|
105
|
-
}
|
|
106
|
-
normalizeElementSnapshot(snapshot) {
|
|
107
|
-
const sparseAttributes = this.removeUndefinedProperties(
|
|
108
|
-
snapshot.attributes ?? {}
|
|
109
|
-
);
|
|
110
|
-
const transformedChildren = this.filterAndTransformSnapshots(
|
|
111
|
-
snapshot?.children ?? []
|
|
112
|
-
);
|
|
113
|
-
const nameEqualsChildren = transformedChildren.length === 1 && snapshot.name === transformedChildren.at(0);
|
|
114
|
-
return {
|
|
115
|
-
role: snapshot.role,
|
|
116
|
-
name: snapshot.name,
|
|
117
|
-
attributes: sparseAttributes,
|
|
118
|
-
children: nameEqualsChildren ? void 0 : transformedChildren.length === 0 ? void 0 : transformedChildren
|
|
119
|
-
};
|
|
120
|
-
}
|
|
121
|
-
simplifyComboboxSnapshot(snapshot) {
|
|
122
|
-
const { role, name, attributes } = this.normalizeElementSnapshot(snapshot);
|
|
123
|
-
const options = snapshot.options ?? [];
|
|
124
|
-
const transformedOptions = options.map(
|
|
125
|
-
(optionSnapshot) => this.simplifyElementSnapshot(optionSnapshot)
|
|
126
|
-
);
|
|
127
|
-
return this.transformedSnapshot(role, {
|
|
128
|
-
name,
|
|
129
|
-
...attributes,
|
|
130
|
-
options: this.includeComboboxOptions && transformedOptions.length > 0 ? transformedOptions : void 0
|
|
131
|
-
});
|
|
132
|
-
}
|
|
133
|
-
isEmpty(snapshot) {
|
|
134
|
-
return snapshot.name === void 0 && (snapshot.attributes === void 0 || Object.keys(snapshot.attributes).length === 0) && (snapshot.children === void 0 || snapshot.children.length === 0);
|
|
135
|
-
}
|
|
136
|
-
hasOnlyName(snapshot) {
|
|
137
|
-
return snapshot.name !== void 0 && snapshot.attributes === void 0 && snapshot.children === void 0;
|
|
138
|
-
}
|
|
139
|
-
hasOnlyChildren(snapshot) {
|
|
140
|
-
return snapshot.name === void 0 && snapshot.attributes === void 0 && snapshot.children !== void 0;
|
|
141
|
-
}
|
|
142
|
-
removeUndefinedProperties(attributes) {
|
|
143
|
-
const sparseAttributes = {};
|
|
144
|
-
Object.entries(attributes).forEach(([key, value]) => {
|
|
145
|
-
if (value !== void 0) {
|
|
146
|
-
sparseAttributes[key] = value;
|
|
147
|
-
}
|
|
148
|
-
});
|
|
149
|
-
return Object.keys(sparseAttributes).length > 0 ? sparseAttributes : void 0;
|
|
150
|
-
}
|
|
151
|
-
transformedSnapshot(role, content) {
|
|
152
|
-
return { [role]: content };
|
|
153
|
-
}
|
|
154
|
-
};
|
|
155
|
-
|
|
156
|
-
// src/playwright/snapshot.ts
|
|
157
|
-
async function snapshotElement(locator, options) {
|
|
158
|
-
const snapshot = await snapshotElementRaw(locator);
|
|
159
|
-
return new ElementSnapshotTransformer(options).transform(snapshot);
|
|
160
|
-
}
|
|
161
|
-
async function snapshotElementRaw(locator) {
|
|
162
|
-
return await new ElementSnapshotProxy(locator.page()).snapshotElement(
|
|
163
|
-
locator
|
|
164
|
-
);
|
|
165
|
-
}
|
|
166
|
-
export {
|
|
167
|
-
snapshotElement,
|
|
168
|
-
snapshotElementRaw
|
|
169
|
-
};
|