@vitest/browser 2.1.0-beta.3 → 2.1.0-beta.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.
@@ -13,7 +13,7 @@
13
13
  ]
14
14
  },
15
15
  "tester/tester.html": {
16
- "file": "__vitest_browser__/tester-CRcWWhrn.js",
16
+ "file": "__vitest_browser__/tester-CuCeoNqh.js",
17
17
  "name": "tester",
18
18
  "src": "tester/tester.html",
19
19
  "isEntry": true,
@@ -3,10 +3,10 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
3
3
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
4
  import { a as getConfig, i as importFs, b as importId, e as extname, g as getBrowserState, _ as __vitePreload, j as join, c as getWorkerState } from "./preload-helper-Btt6SgIy.js";
5
5
  import { loadDiffConfig, loadSnapshotSerializers, takeCoverageInsideWorker, setupCommonEnv, startTests, collectTests, SpyModule } from "vitest/browser";
6
+ import { page } from "@vitest/browser/context";
6
7
  import { globalChannel, channel, waitForChannel, client, onCancel } from "@vitest/browser/client";
7
8
  import { getSafeTimers, stringify, format, TraceMap, originalPositionFor } from "vitest/utils";
8
9
  import { VitestTestRunner, NodeBenchmarkRunner } from "vitest/runners";
9
- import { page } from "@vitest/browser/context";
10
10
  import { expect } from "vitest";
11
11
  function getType(value) {
12
12
  return Object.prototype.toString.apply(value).slice(8, -1);
@@ -11892,6 +11892,7 @@ async function setupExpectDom() {
11892
11892
  }, options);
11893
11893
  };
11894
11894
  }
11895
+ const cleanupSymbol = Symbol.for("vitest:component-cleanup");
11895
11896
  const url = new URL(location.href);
11896
11897
  const reloadStart = url.searchParams.get("__reloadStart");
11897
11898
  function debug(...args) {
@@ -11975,6 +11976,17 @@ async function executeTests(method, files) {
11975
11976
  }
11976
11977
  }
11977
11978
  } finally {
11979
+ try {
11980
+ if (cleanupSymbol in page) {
11981
+ page[cleanupSymbol]();
11982
+ }
11983
+ } catch (error) {
11984
+ await client.rpc.onUnhandledError({
11985
+ name: error.name,
11986
+ message: error.message,
11987
+ stack: String(error.stack)
11988
+ }, "Cleanup Error");
11989
+ }
11978
11990
  state.environmentTeardownRun = true;
11979
11991
  debug("finished running tests");
11980
11992
  done(files);
@@ -20,10 +20,10 @@
20
20
  <script>{__VITEST_STATE__}</script>
21
21
  {__VITEST_INTERNAL_SCRIPTS__}
22
22
  {__VITEST_SCRIPTS__}
23
- <script type="module" crossorigin src="/__vitest_browser__/tester-CRcWWhrn.js"></script>
23
+ <script type="module" crossorigin src="/__vitest_browser__/tester-CuCeoNqh.js"></script>
24
24
  <link rel="modulepreload" crossorigin href="/__vitest_browser__/preload-helper-Btt6SgIy.js">
25
25
  </head>
26
- <body data-vitest-body>
26
+ <body>
27
27
  {__VITEST_APPEND__}
28
28
  </body>
29
29
  </html>
@@ -0,0 +1,207 @@
1
+ import { server, page } from '@vitest/browser/context';
2
+ import { I as Ivya, a as getByRoleSelector, c as getByAltTextSelector, g as getByLabelSelector, d as getByPlaceholderSelector, b as getByTestIdSelector, e as getByTextSelector, f as getByTitleSelector, h as getElementError } from './public-utils-D6S2-5kI.js';
3
+
4
+ // @__NO_SIDE_EFFECTS__
5
+ function getBrowserState() {
6
+ return window.__vitest_browser_runner__;
7
+ }
8
+ // @__NO_SIDE_EFFECTS__
9
+ function getWorkerState() {
10
+ const state = window.__vitest_worker__;
11
+ if (!state) {
12
+ throw new Error("Worker state is not found. This is an issue with Vitest. Please, open an issue.");
13
+ }
14
+ return state;
15
+ }
16
+ // @__NO_SIDE_EFFECTS__
17
+ function convertElementToCssSelector(element) {
18
+ if (!element || !(element instanceof Element)) {
19
+ throw new Error(
20
+ `Expected DOM element to be an instance of Element, received ${typeof element}`
21
+ );
22
+ }
23
+ return getUniqueCssSelector(element);
24
+ }
25
+ function escapeIdForCSSSelector(id) {
26
+ return id.split("").map((char) => {
27
+ const code = char.charCodeAt(0);
28
+ if (char === " " || char === "#" || char === "." || char === ":" || char === "[" || char === "]" || char === ">" || char === "+" || char === "~" || char === "\\") {
29
+ return `\\${char}`;
30
+ } else if (code >= 65536) {
31
+ return `\\${code.toString(16).toUpperCase().padStart(6, "0")} `;
32
+ } else if (code < 32 || code === 127) {
33
+ return `\\${code.toString(16).toUpperCase().padStart(2, "0")} `;
34
+ } else if (code >= 128) {
35
+ return `\\${code.toString(16).toUpperCase().padStart(2, "0")} `;
36
+ } else {
37
+ return char;
38
+ }
39
+ }).join("");
40
+ }
41
+ function getUniqueCssSelector(el) {
42
+ const path = [];
43
+ let parent;
44
+ let hasShadowRoot = false;
45
+ while (parent = getParent(el)) {
46
+ if (parent.shadowRoot) {
47
+ hasShadowRoot = true;
48
+ }
49
+ const tag = el.tagName;
50
+ if (el.id) {
51
+ path.push(`#${escapeIdForCSSSelector(el.id)}`);
52
+ } else if (!el.nextElementSibling && !el.previousElementSibling) {
53
+ path.push(tag.toLowerCase());
54
+ } else {
55
+ let index = 0;
56
+ let sameTagSiblings = 0;
57
+ let elementIndex = 0;
58
+ for (const sibling of parent.children) {
59
+ index++;
60
+ if (sibling.tagName === tag) {
61
+ sameTagSiblings++;
62
+ }
63
+ if (sibling === el) {
64
+ elementIndex = index;
65
+ }
66
+ }
67
+ if (sameTagSiblings > 1) {
68
+ path.push(`${tag.toLowerCase()}:nth-child(${elementIndex})`);
69
+ } else {
70
+ path.push(tag.toLowerCase());
71
+ }
72
+ }
73
+ el = parent;
74
+ }
75
+ return `${(/* @__PURE__ */ getBrowserState()).provider === "webdriverio" && hasShadowRoot ? ">>>" : ""}${path.reverse().join(" > ")}`;
76
+ }
77
+ function getParent(el) {
78
+ const parent = el.parentNode;
79
+ if (parent instanceof ShadowRoot) {
80
+ return parent.host;
81
+ }
82
+ return parent;
83
+ }
84
+
85
+ const selectorEngine = Ivya.create({
86
+ browser: ((name) => {
87
+ switch (name) {
88
+ case "edge":
89
+ case "chrome":
90
+ return "chromium";
91
+ case "safari":
92
+ return "webkit";
93
+ default:
94
+ return name;
95
+ }
96
+ })(server.config.browser.name),
97
+ testIdAttribute: server.config.browser.locators.testIdAttribute
98
+ });
99
+ class Locator {
100
+ _parsedSelector;
101
+ _container;
102
+ _pwSelector;
103
+ click(options = {}) {
104
+ return this.triggerCommand("__vitest_click", this.selector, options);
105
+ }
106
+ dblClick(options = {}) {
107
+ return this.triggerCommand("__vitest_dblClick", this.selector, options);
108
+ }
109
+ tripleClick(options = {}) {
110
+ return this.triggerCommand("__vitest_tripleClick", this.selector, options);
111
+ }
112
+ clear() {
113
+ return this.triggerCommand("__vitest_clear", this.selector);
114
+ }
115
+ hover(options) {
116
+ return this.triggerCommand("__vitest_hover", this.selector, options);
117
+ }
118
+ unhover(options) {
119
+ return this.triggerCommand("__vitest_hover", "html > body", options);
120
+ }
121
+ fill(text, options) {
122
+ return this.triggerCommand("__vitest_fill", this.selector, text, options);
123
+ }
124
+ dropTo(target, options = {}) {
125
+ return this.triggerCommand(
126
+ "__vitest_dragAndDrop",
127
+ this.selector,
128
+ target.selector,
129
+ options
130
+ );
131
+ }
132
+ selectOptions(value) {
133
+ const values = (Array.isArray(value) ? value : [value]).map((v) => {
134
+ if (typeof v !== "string") {
135
+ const selector = "element" in v ? v.selector : selectorEngine.generateSelectorSimple(v);
136
+ return { element: selector };
137
+ }
138
+ return v;
139
+ });
140
+ return this.triggerCommand("__vitest_selectOptions", this.selector, values);
141
+ }
142
+ screenshot(options) {
143
+ return page.screenshot({
144
+ ...options,
145
+ element: this
146
+ });
147
+ }
148
+ getByRole(role, options) {
149
+ return this.locator(getByRoleSelector(role, options));
150
+ }
151
+ getByAltText(text, options) {
152
+ return this.locator(getByAltTextSelector(text, options));
153
+ }
154
+ getByLabelText(text, options) {
155
+ return this.locator(getByLabelSelector(text, options));
156
+ }
157
+ getByPlaceholder(text, options) {
158
+ return this.locator(getByPlaceholderSelector(text, options));
159
+ }
160
+ getByTestId(testId) {
161
+ return this.locator(getByTestIdSelector(server.config.browser.locators.testIdAttribute, testId));
162
+ }
163
+ getByText(text, options) {
164
+ return this.locator(getByTextSelector(text, options));
165
+ }
166
+ getByTitle(title, options) {
167
+ return this.locator(getByTitleSelector(title, options));
168
+ }
169
+ query() {
170
+ const parsedSelector = this._parsedSelector || (this._parsedSelector = selectorEngine.parseSelector(this._pwSelector || this.selector));
171
+ return selectorEngine.querySelector(parsedSelector, document.documentElement, true);
172
+ }
173
+ element() {
174
+ const element = this.query();
175
+ if (!element) {
176
+ throw getElementError(this._pwSelector || this.selector, this._container || document.documentElement);
177
+ }
178
+ return element;
179
+ }
180
+ elements() {
181
+ const parsedSelector = this._parsedSelector || (this._parsedSelector = selectorEngine.parseSelector(this._pwSelector || this.selector));
182
+ return selectorEngine.querySelectorAll(parsedSelector, document.documentElement);
183
+ }
184
+ all() {
185
+ return this.elements().map((element) => this.elementLocator(element));
186
+ }
187
+ get state() {
188
+ return getBrowserState();
189
+ }
190
+ get worker() {
191
+ return getWorkerState();
192
+ }
193
+ get rpc() {
194
+ return this.worker.rpc;
195
+ }
196
+ triggerCommand(command, ...args) {
197
+ const filepath = this.worker.filepath || this.worker.current?.file?.filepath || void 0;
198
+ return this.rpc.triggerCommand(
199
+ this.state.contextId,
200
+ command,
201
+ filepath,
202
+ args
203
+ );
204
+ }
205
+ }
206
+
207
+ export { Locator as L, convertElementToCssSelector as c, selectorEngine as s };
@@ -221,8 +221,8 @@ declare const selectorEngine: Ivya;
221
221
  declare abstract class Locator {
222
222
  abstract selector: string;
223
223
  private _parsedSelector;
224
+ protected _container?: Element | undefined;
224
225
  protected _pwSelector?: string | undefined;
225
- protected _forceElement?: Element | undefined;
226
226
  click(options?: UserEventClickOptions): Promise<void>;
227
227
  dblClick(options?: UserEventClickOptions): Promise<void>;
228
228
  tripleClick(options?: UserEventClickOptions): Promise<void>;
@@ -1,2 +1,4 @@
1
1
  import '@vitest/browser/context';
2
- export { L as Locator, s as selectorEngine } from '../index-BHH2eSIh.js';
2
+ import '../public-utils-D6S2-5kI.js';
3
+ export { L as Locator, s as selectorEngine } from '../index-BHQhKvO1.js';
4
+ import 'vitest/utils';
@@ -1,5 +1,7 @@
1
1
  import { page, server } from '@vitest/browser/context';
2
- import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, s as selectorEngine, L as Locator } from '../index-BHH2eSIh.js';
2
+ import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector } from '../public-utils-D6S2-5kI.js';
3
+ import { s as selectorEngine, L as Locator } from '../index-BHQhKvO1.js';
4
+ import 'vitest/utils';
3
5
 
4
6
  page.extend({
5
7
  getByLabelText(text, options) {
@@ -24,19 +26,25 @@ page.extend({
24
26
  return new PlaywrightLocator(getByTitleSelector(title, options));
25
27
  },
26
28
  elementLocator(element) {
27
- return new PlaywrightLocator(selectorEngine.generateSelectorSimple(element), element);
29
+ return new PlaywrightLocator(
30
+ selectorEngine.generateSelectorSimple(element),
31
+ element
32
+ );
28
33
  }
29
34
  });
30
35
  class PlaywrightLocator extends Locator {
31
- constructor(selector, _forceElement) {
36
+ constructor(selector, _container) {
32
37
  super();
33
38
  this.selector = selector;
34
- this._forceElement = _forceElement;
39
+ this._container = _container;
35
40
  }
36
41
  locator(selector) {
37
- return new PlaywrightLocator(`${this.selector} >> ${selector}`);
42
+ return new PlaywrightLocator(`${this.selector} >> ${selector}`, this._container);
38
43
  }
39
44
  elementLocator(element) {
40
- return new PlaywrightLocator(selectorEngine.generateSelectorSimple(element), element);
45
+ return new PlaywrightLocator(
46
+ selectorEngine.generateSelectorSimple(element),
47
+ element
48
+ );
41
49
  }
42
50
  }
@@ -1,6 +1,8 @@
1
1
  import { page, server } from '@vitest/browser/context';
2
2
  import { userEvent } from '@testing-library/user-event';
3
- import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, s as selectorEngine, L as Locator, h as convertElementToCssSelector } from '../index-BHH2eSIh.js';
3
+ import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, h as getElementError } from '../public-utils-D6S2-5kI.js';
4
+ import { s as selectorEngine, L as Locator, c as convertElementToCssSelector } from '../index-BHQhKvO1.js';
5
+ import 'vitest/utils';
4
6
 
5
7
  page.extend({
6
8
  getByLabelText(text, options) {
@@ -25,19 +27,22 @@ page.extend({
25
27
  return new PreviewLocator(getByTitleSelector(title, options));
26
28
  },
27
29
  elementLocator(element) {
28
- return new PreviewLocator(selectorEngine.generateSelectorSimple(element), element);
30
+ return new PreviewLocator(
31
+ selectorEngine.generateSelectorSimple(element),
32
+ element
33
+ );
29
34
  }
30
35
  });
31
36
  class PreviewLocator extends Locator {
32
- constructor(_pwSelector, _forceElement) {
37
+ constructor(_pwSelector, _container) {
33
38
  super();
34
39
  this._pwSelector = _pwSelector;
35
- this._forceElement = _forceElement;
40
+ this._container = _container;
36
41
  }
37
42
  get selector() {
38
43
  const selectors = this.elements().map((element) => convertElementToCssSelector(element));
39
44
  if (!selectors.length) {
40
- throw new Error(`element not found: ${this._pwSelector}`);
45
+ throw getElementError(this._pwSelector, this._container || document.documentElement);
41
46
  }
42
47
  return selectors.join(", ");
43
48
  }
@@ -78,9 +83,12 @@ class PreviewLocator extends Locator {
78
83
  throw new Error('The "preview" provider doesn\'t support `screenshot` method.');
79
84
  }
80
85
  locator(selector) {
81
- return new PreviewLocator(`${this._pwSelector} >> ${selector}`);
86
+ return new PreviewLocator(`${this._pwSelector} >> ${selector}`, this._container);
82
87
  }
83
88
  elementLocator(element) {
84
- return new PreviewLocator(selectorEngine.generateSelectorSimple(element), element);
89
+ return new PreviewLocator(
90
+ selectorEngine.generateSelectorSimple(element),
91
+ element
92
+ );
85
93
  }
86
94
  }
@@ -1,5 +1,7 @@
1
1
  import { page, server } from '@vitest/browser/context';
2
- import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, s as selectorEngine, L as Locator, h as convertElementToCssSelector } from '../index-BHH2eSIh.js';
2
+ import { g as getByLabelSelector, a as getByRoleSelector, b as getByTestIdSelector, c as getByAltTextSelector, d as getByPlaceholderSelector, e as getByTextSelector, f as getByTitleSelector, h as getElementError } from '../public-utils-D6S2-5kI.js';
3
+ import { s as selectorEngine, L as Locator, c as convertElementToCssSelector } from '../index-BHQhKvO1.js';
4
+ import 'vitest/utils';
3
5
 
4
6
  page.extend({
5
7
  getByLabelText(text, options) {
@@ -24,19 +26,19 @@ page.extend({
24
26
  return new WebdriverIOLocator(getByTitleSelector(title, options));
25
27
  },
26
28
  elementLocator(element) {
27
- return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(element), element);
29
+ return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(element));
28
30
  }
29
31
  });
30
32
  class WebdriverIOLocator extends Locator {
31
- constructor(_pwSelector, _forceElement) {
33
+ constructor(_pwSelector, _container) {
32
34
  super();
33
35
  this._pwSelector = _pwSelector;
34
- this._forceElement = _forceElement;
36
+ this._container = _container;
35
37
  }
36
38
  get selector() {
37
39
  const selectors = this.elements().map((element) => convertElementToCssSelector(element));
38
40
  if (!selectors.length) {
39
- throw new Error(`element not found: ${this._pwSelector}`);
41
+ throw getElementError(this._pwSelector, this._container || document.documentElement);
40
42
  }
41
43
  return selectors.join(", ");
42
44
  }
@@ -45,7 +47,7 @@ class WebdriverIOLocator extends Locator {
45
47
  return this.triggerCommand("__vitest_selectOptions", this.selector, values);
46
48
  }
47
49
  locator(selector) {
48
- return new WebdriverIOLocator(`${this._pwSelector} >> ${selector}`);
50
+ return new WebdriverIOLocator(`${this._pwSelector} >> ${selector}`, this._container);
49
51
  }
50
52
  elementLocator(element) {
51
53
  return new WebdriverIOLocator(selectorEngine.generateSelectorSimple(element), element);
@@ -1,4 +1,5 @@
1
- import { server, page } from '@vitest/browser/context';
1
+ import { page } from '@vitest/browser/context';
2
+ import { stringify } from 'vitest/utils';
2
3
 
3
4
  var __defProp = Object.defineProperty;
4
5
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
@@ -5510,213 +5511,53 @@ function getByRoleSelector(role, options = {}) {
5510
5511
  return `internal:role=${role}${props.map(([n, v]) => `[${n}=${v}]`).join("")}`;
5511
5512
  }
5512
5513
 
5513
- // @__NO_SIDE_EFFECTS__
5514
- function getBrowserState() {
5515
- return window.__vitest_browser_runner__;
5514
+ function getElementLocatorSelectors(element) {
5515
+ const locator = page.elementLocator(element);
5516
+ return {
5517
+ getByAltText: (altText, options) => locator.getByAltText(altText, options),
5518
+ getByLabelText: (labelText, options) => locator.getByLabelText(labelText, options),
5519
+ getByPlaceholder: (placeholderText, options) => locator.getByPlaceholder(placeholderText, options),
5520
+ getByRole: (role, options) => locator.getByRole(role, options),
5521
+ getByTestId: (testId) => locator.getByTestId(testId),
5522
+ getByText: (text, options) => locator.getByText(text, options),
5523
+ getByTitle: (title, options) => locator.getByTitle(title, options)
5524
+ };
5516
5525
  }
5517
- // @__NO_SIDE_EFFECTS__
5518
- function getWorkerState() {
5519
- const state = window.__vitest_worker__;
5520
- if (!state) {
5521
- throw new Error("Worker state is not found. This is an issue with Vitest. Please, open an issue.");
5526
+ function debug(el, maxLength, options) {
5527
+ if (Array.isArray(el)) {
5528
+ el.forEach((e) => console.log(prettyDOM(e, maxLength, options)));
5529
+ } else {
5530
+ console.log(prettyDOM(el, maxLength, options));
5522
5531
  }
5523
- return state;
5524
5532
  }
5525
- // @__NO_SIDE_EFFECTS__
5526
- function convertElementToCssSelector(element) {
5527
- if (!element || !(element instanceof Element)) {
5528
- throw new Error(
5529
- `Expected DOM element to be an instance of Element, received ${typeof element}`
5530
- );
5533
+ function prettyDOM(dom, maxLength = Number(import.meta.env.DEBUG_PRINT_LIMIT ?? 7e3), prettyFormatOptions = {}) {
5534
+ if (maxLength === 0) {
5535
+ return "";
5531
5536
  }
5532
- return getUniqueCssSelector(element);
5533
- }
5534
- function escapeIdForCSSSelector(id) {
5535
- return id.split("").map((char) => {
5536
- const code = char.charCodeAt(0);
5537
- if (char === " " || char === "#" || char === "." || char === ":" || char === "[" || char === "]" || char === ">" || char === "+" || char === "~" || char === "\\") {
5538
- return `\\${char}`;
5539
- } else if (code >= 65536) {
5540
- return `\\${code.toString(16).toUpperCase().padStart(6, "0")} `;
5541
- } else if (code < 32 || code === 127) {
5542
- return `\\${code.toString(16).toUpperCase().padStart(2, "0")} `;
5543
- } else if (code >= 128) {
5544
- return `\\${code.toString(16).toUpperCase().padStart(2, "0")} `;
5545
- } else {
5546
- return char;
5547
- }
5548
- }).join("");
5549
- }
5550
- function getUniqueCssSelector(el) {
5551
- const path = [];
5552
- let parent;
5553
- let hasShadowRoot = false;
5554
- while (parent = getParent(el)) {
5555
- if (parent.shadowRoot) {
5556
- hasShadowRoot = true;
5557
- }
5558
- const tag = el.tagName;
5559
- if (el.id) {
5560
- path.push(`#${escapeIdForCSSSelector(el.id)}`);
5561
- } else if (!el.nextElementSibling && !el.previousElementSibling) {
5562
- path.push(tag.toLowerCase());
5563
- } else {
5564
- let index = 0;
5565
- let sameTagSiblings = 0;
5566
- let elementIndex = 0;
5567
- for (const sibling of parent.children) {
5568
- index++;
5569
- if (sibling.tagName === tag) {
5570
- sameTagSiblings++;
5571
- }
5572
- if (sibling === el) {
5573
- elementIndex = index;
5574
- }
5575
- }
5576
- if (sameTagSiblings > 1) {
5577
- path.push(`${tag.toLowerCase()}:nth-child(${elementIndex})`);
5578
- } else {
5579
- path.push(tag.toLowerCase());
5580
- }
5581
- }
5582
- el = parent;
5537
+ if (!dom) {
5538
+ dom = document.body;
5583
5539
  }
5584
- return `${(/* @__PURE__ */ getBrowserState()).provider === "webdriverio" && hasShadowRoot ? ">>>" : ""}${path.reverse().join(" > ")}`;
5585
- }
5586
- function getParent(el) {
5587
- const parent = el.parentNode;
5588
- if (parent instanceof ShadowRoot) {
5589
- return parent.host;
5540
+ if ("element" in dom && "all" in dom) {
5541
+ dom = dom.element();
5590
5542
  }
5591
- return parent;
5543
+ const type = typeof dom;
5544
+ if (type !== "object" || !dom.outerHTML) {
5545
+ const typeName = type === "object" ? dom.constructor.name : type;
5546
+ throw new TypeError(`Expecting a valid DOM element, but got ${typeName}.`);
5547
+ }
5548
+ const pretty = stringify(dom, Number.POSITIVE_INFINITY, {
5549
+ maxLength,
5550
+ highlight: true,
5551
+ ...prettyFormatOptions
5552
+ });
5553
+ return dom.outerHTML.length > maxLength ? `${pretty.slice(0, maxLength)}...` : pretty;
5592
5554
  }
5555
+ function getElementError(selector, container) {
5556
+ const error = new Error(`Cannot find element with locator: ${asLocator("javascript", selector)}
5593
5557
 
5594
- const selectorEngine = Ivya.create({
5595
- browser: ((name) => {
5596
- switch (name) {
5597
- case "edge":
5598
- case "chrome":
5599
- return "chromium";
5600
- case "safari":
5601
- return "webkit";
5602
- default:
5603
- return name;
5604
- }
5605
- })(server.config.browser.name),
5606
- testIdAttribute: server.config.browser.locators.testIdAttribute
5607
- });
5608
- class Locator {
5609
- _parsedSelector;
5610
- _pwSelector;
5611
- _forceElement;
5612
- click(options = {}) {
5613
- return this.triggerCommand("__vitest_click", this.selector, options);
5614
- }
5615
- dblClick(options = {}) {
5616
- return this.triggerCommand("__vitest_dblClick", this.selector, options);
5617
- }
5618
- tripleClick(options = {}) {
5619
- return this.triggerCommand("__vitest_tripleClick", this.selector, options);
5620
- }
5621
- clear() {
5622
- return this.triggerCommand("__vitest_clear", this.selector);
5623
- }
5624
- hover(options) {
5625
- return this.triggerCommand("__vitest_hover", this.selector, options);
5626
- }
5627
- unhover(options) {
5628
- return this.triggerCommand("__vitest_hover", "html > body", options);
5629
- }
5630
- fill(text, options) {
5631
- return this.triggerCommand("__vitest_fill", this.selector, text, options);
5632
- }
5633
- dropTo(target, options = {}) {
5634
- return this.triggerCommand(
5635
- "__vitest_dragAndDrop",
5636
- this.selector,
5637
- target.selector,
5638
- options
5639
- );
5640
- }
5641
- selectOptions(value) {
5642
- const values = (Array.isArray(value) ? value : [value]).map((v) => {
5643
- if (typeof v !== "string") {
5644
- const selector = "element" in v ? v.selector : selectorEngine.generateSelectorSimple(v);
5645
- return { element: selector };
5646
- }
5647
- return v;
5648
- });
5649
- return this.triggerCommand("__vitest_selectOptions", this.selector, values);
5650
- }
5651
- screenshot(options) {
5652
- return page.screenshot({
5653
- ...options,
5654
- element: this
5655
- });
5656
- }
5657
- getByRole(role, options) {
5658
- return this.locator(getByRoleSelector(role, options));
5659
- }
5660
- getByAltText(text, options) {
5661
- return this.locator(getByAltTextSelector(text, options));
5662
- }
5663
- getByLabelText(text, options) {
5664
- return this.locator(getByLabelSelector(text, options));
5665
- }
5666
- getByPlaceholder(text, options) {
5667
- return this.locator(getByPlaceholderSelector(text, options));
5668
- }
5669
- getByTestId(testId) {
5670
- return this.locator(getByTestIdSelector(server.config.browser.locators.testIdAttribute, testId));
5671
- }
5672
- getByText(text, options) {
5673
- return this.locator(getByTextSelector(text, options));
5674
- }
5675
- getByTitle(title, options) {
5676
- return this.locator(getByTitleSelector(title, options));
5677
- }
5678
- query() {
5679
- if (this._forceElement) {
5680
- return this._forceElement;
5681
- }
5682
- const parsedSelector = this._parsedSelector || (this._parsedSelector = selectorEngine.parseSelector(this._pwSelector || this.selector));
5683
- return selectorEngine.querySelector(parsedSelector, document.documentElement, true);
5684
- }
5685
- element() {
5686
- const element = this.query();
5687
- if (!element) {
5688
- throw new Error(`element not found: ${asLocator("javascript", this._pwSelector || this.selector)}`);
5689
- }
5690
- return element;
5691
- }
5692
- elements() {
5693
- if (this._forceElement) {
5694
- return [this._forceElement];
5695
- }
5696
- const parsedSelector = this._parsedSelector || (this._parsedSelector = selectorEngine.parseSelector(this._pwSelector || this.selector));
5697
- return selectorEngine.querySelectorAll(parsedSelector, document.documentElement);
5698
- }
5699
- all() {
5700
- return this.elements().map((element) => this.elementLocator(element));
5701
- }
5702
- get state() {
5703
- return getBrowserState();
5704
- }
5705
- get worker() {
5706
- return getWorkerState();
5707
- }
5708
- get rpc() {
5709
- return this.worker.rpc;
5710
- }
5711
- triggerCommand(command, ...args) {
5712
- const filepath = this.worker.filepath || this.worker.current?.file?.filepath || void 0;
5713
- return this.rpc.triggerCommand(
5714
- this.state.contextId,
5715
- command,
5716
- filepath,
5717
- args
5718
- );
5719
- }
5558
+ ${prettyDOM(container)}`);
5559
+ error.name = "VitestBrowserElementError";
5560
+ return error;
5720
5561
  }
5721
5562
 
5722
- export { Locator as L, getByRoleSelector as a, getByTestIdSelector as b, getByAltTextSelector as c, getByPlaceholderSelector as d, getByTextSelector as e, getByTitleSelector as f, getByLabelSelector as g, convertElementToCssSelector as h, selectorEngine as s };
5563
+ export { Ivya as I, getByRoleSelector as a, getByTestIdSelector as b, getByAltTextSelector as c, getByPlaceholderSelector as d, getByTextSelector as e, getByTitleSelector as f, getByLabelSelector as g, getElementError as h, getElementLocatorSelectors as i, debug as j, prettyDOM as p };
package/dist/utils.js ADDED
@@ -0,0 +1,3 @@
1
+ import '@vitest/browser/context';
2
+ import 'vitest/utils';
3
+ export { j as debug, h as getElementError, i as getElementLocatorSelectors, p as prettyDOM } from './public-utils-D6S2-5kI.js';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@vitest/browser",
3
3
  "type": "module",
4
- "version": "2.1.0-beta.3",
4
+ "version": "2.1.0-beta.4",
5
5
  "description": "Browser running for Vitest",
6
6
  "license": "MIT",
7
7
  "funding": "https://opencollective.com/vitest",
@@ -44,6 +44,10 @@
44
44
  "types": "./dist/locators/index.d.ts",
45
45
  "default": "./dist/locators/index.js"
46
46
  },
47
+ "./utils": {
48
+ "types": "./utils.d.ts",
49
+ "default": "./dist/utils.js"
50
+ },
47
51
  "./*": "./*"
48
52
  },
49
53
  "main": "./dist/index.js",
@@ -58,7 +62,7 @@
58
62
  "peerDependencies": {
59
63
  "playwright": "*",
60
64
  "webdriverio": "*",
61
- "vitest": "2.1.0-beta.3"
65
+ "vitest": "2.1.0-beta.4"
62
66
  },
63
67
  "peerDependenciesMeta": {
64
68
  "playwright": {
@@ -78,7 +82,7 @@
78
82
  "msw": "^2.3.5",
79
83
  "sirv": "^2.0.4",
80
84
  "ws": "^8.18.0",
81
- "@vitest/utils": "2.1.0-beta.3"
85
+ "@vitest/utils": "2.1.0-beta.4"
82
86
  },
83
87
  "devDependencies": {
84
88
  "@testing-library/jest-dom": "^6.4.8",
@@ -93,10 +97,10 @@
93
97
  "playwright-core": "^1.45.3",
94
98
  "safaridriver": "^0.1.2",
95
99
  "webdriverio": "^8.39.1",
96
- "@vitest/runner": "2.1.0-beta.3",
97
- "@vitest/ui": "2.1.0-beta.3",
98
- "@vitest/ws-client": "2.1.0-beta.3",
99
- "vitest": "2.1.0-beta.3"
100
+ "@vitest/ui": "2.1.0-beta.4",
101
+ "vitest": "2.1.0-beta.4",
102
+ "@vitest/runner": "2.1.0-beta.4",
103
+ "@vitest/ws-client": "2.1.0-beta.4"
100
104
  },
101
105
  "scripts": {
102
106
  "build": "rimraf dist && pnpm build:node && pnpm build:client",
package/utils.d.ts ADDED
@@ -0,0 +1,21 @@
1
+ // should be in sync with tester/public-utils.ts
2
+ // we cannot bundle it because vitest depend on the @vitest/browser and vise versa
3
+ // fortunately, the file is quite small
4
+
5
+ import { LocatorSelectors } from '@vitest/browser/context'
6
+ import { StringifyOptions } from 'vitest/utils'
7
+
8
+ type PrettyDOMOptions = Omit<StringifyOptions, 'maxLength'>
9
+
10
+ export declare function getElementLocatorSelectors(element: Element): LocatorSelectors
11
+ export declare function debug(
12
+ el?: Element | Locator | null | (Element | Locator)[],
13
+ maxLength?: number,
14
+ options?: PrettyDOMOptions,
15
+ ): void
16
+ export declare function prettyDOM(
17
+ dom?: Element | Locator | undefined | null,
18
+ maxLength?: number,
19
+ prettyFormatOptions?: PrettyDOMOptions,
20
+ ): string
21
+ export declare function getElementError(selector: string, container?: Element): Error