@lvce-editor/test-worker 13.27.0 → 14.0.0

package/dist/api.d.ts

@@ -28,15 +28,36 @@ interface ILocatorExternal {
 	readonly type: (text: string) => Promise<void>;
 }
 
+interface ParsedCssSelectorPart {
+	readonly selector: string;
+	readonly type: "css";
+}
+
+interface ParsedTextSelectorPart {
+	readonly text: string;
+	readonly type: "text";
+}
+
+interface ParsedHasTextSelectorPart {
+	readonly text: string;
+	readonly type: "has-text";
+}
+
+interface ParsedNthSelectorPart {
+	readonly index: number;
+	readonly type: "nth";
+}
+export type ParsedSelectorPart = ParsedCssSelectorPart | ParsedTextSelectorPart | ParsedHasTextSelectorPart | ParsedNthSelectorPart;
+export type ParsedCssSelector = readonly ParsedSelectorPart[];
+
 interface ILocatorCreateOptions {
 	readonly hasText?: string;
 	readonly nth?: number;
 }
 export declare class Locator implements ILocatorExternal {
-	readonly _selector: any;
-	readonly _nth: number;
-	readonly _hasText: string;
-	constructor(selector: any, options?: ILocatorCreateOptions);
+	readonly _selector: string;
+	readonly _parsed: ParsedCssSelector;
+	constructor(selector: string, options?: ILocatorCreateOptions, parsed?: ParsedCssSelector);
 	click({ button }?: {
 		readonly button?: string;
 	}): Promise<void>;

package/dist/testWorkerMain.js

@@ -1235,22 +1235,40 @@ const locatorInvoke = async (locator, method, ...params) => {
 };
 
 const printLocator = locator => {
-  if (locator._nth !== -1) {
-    return `${locator._selector}:nth(${locator._nth})`;
-  }
-  if (locator._hasText) {
-    return `${locator._selector} "${locator._hasText}"`;
+  let result = '';
+  for (const part of locator._parsed) {
+    if (part.type === 'css') {
+      if (!result) {
+        result = part.selector;
+        continue;
+      }
+      result = `${result} >> ${part.selector}`;
+      continue;
+    }
+    if (part.type === 'text') {
+      if (!result) {
+        result = `text=${part.text}`;
+        continue;
+      }
+      result = `${result} text=${part.text}`;
+      continue;
+    }
+    if (part.type === 'has-text') {
+      result = `${result} "${part.text}"`;
+      continue;
+    }
+    result = `${result}:nth(${part.index})`;
   }
-  return `${locator._selector}`;
+  return result;
 };
 
 const toBeVisible = locator => {
-  return `expected selector to be visible ${locator._selector}`;
+  return `expected selector to be visible ${printLocator(locator)}`;
 };
 const toHaveValue = (locator, {
   value
 }) => {
-  return `expected selector ${locator._selector} to have value ${value}`;
+  return `expected selector ${printLocator(locator)} to have value ${value}`;
 };
 const toHaveText = async (locator, options) => {
   const locatorString = printLocator(locator);
@@ -1545,6 +1563,72 @@ const setMockRpc = mockRpc => {
   state.mockRpcs[mockRpc.name] = mockRpc;
 };
 
+class CssParsingError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'CssParsingError';
+  }
+}
+
+const startTokenRegex = /^[a-z][a-z0-9-]*/;
+const getStartToken = selector => {
+  const match = selector.match(startTokenRegex);
+  return match ? match[0] : '';
+};
+
+const htmlElements = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdo', 'body', 'br', 'button', 'canvas', 'caption', 'center', 'cite', 'code', 'col', 'colgroup', 'command', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'label', 'legend', 'li', 'link', 'map', 'mark', 'menu', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'pre', 'progress', 'q', 'rp', 'rt', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr'];
+
+const isElement = selector => {
+  return htmlElements.includes(selector);
+};
+
+const isCssSelector = selector => {
+  if (!selector) {
+    return false;
+  }
+  if (selector.startsWith('.') || selector.startsWith('#') || selector.startsWith('[') || selector.startsWith('*') || selector.startsWith(':')) {
+    return true;
+  }
+  const startToken = getStartToken(selector);
+  if (!startToken) {
+    return false;
+  }
+  return isElement(startToken);
+};
+
+const parseCssSelector = selector => {
+  if (typeof selector !== 'string') {
+    throw new TypeError('selector must be of type string');
+  }
+  if (selector.startsWith('text=')) {
+    return [{
+      text: selector.slice('text='.length),
+      type: 'text'
+    }];
+  }
+  if (selector.includes('text=')) {
+    const index = selector.indexOf('text=');
+    const cssSelector = selector.slice(0, index).trimEnd();
+    if (!isCssSelector(cssSelector)) {
+      throw new CssParsingError(`unsupported selector: ${selector}`);
+    }
+    return [{
+      selector: cssSelector,
+      type: 'css'
+    }, {
+      text: selector.slice(index + 'text='.length),
+      type: 'text'
+    }];
+  }
+  if (isCssSelector(selector)) {
+    return [{
+      selector,
+      type: 'css'
+    }];
+  }
+  throw new CssParsingError(`unsupported selector: ${selector}`);
+};
+
 const performAction = async (locator, action, options) => {
   const invoke = getLocatorInvoke(locator);
   return invoke('TestFrameWork.performAction', locator, action, options);
@@ -1564,7 +1648,7 @@ const toButtonNumber = buttonType => {
 };
 
 class Locator {
-  constructor(selector, options = {}) {
+  constructor(selector, options = {}, parsed) {
     if (!options || typeof options !== 'object' || Array.isArray(options)) {
       throw new TypeError('options must be of type object');
     }
@@ -1575,8 +1659,7 @@ class Locator {
     string(hasText, 'options.hasText must be of type string');
     number(nth, 'options.nth must be of type number');
     this._selector = selector;
-    this._nth = nth;
-    this._hasText = hasText;
+    this._parsed = parsed || applyLocatorOptions(parseCssSelector(selector), options);
   }
   async click({
     button = 'left'
@@ -1597,20 +1680,15 @@ class Locator {
     return performAction(this, 'hover', options);
   }
   first() {
-    return new Locator(this._selector, {
-      nth: 0
-    });
+    return new Locator(this._selector, {}, withNth(this._parsed, 0));
   }
   locator(subSelector) {
-    if (this._nth !== -1) {
-      return new Locator(`${this._selector}:nth-of-type(${this._nth + 1}) ${subSelector}`);
-    }
-    return new Locator(`${this._selector} ${subSelector}`);
+    const selector = `${this._selector} ${subSelector}`;
+    return new Locator(selector, {}, [...this._parsed, ...parseCssSelector(subSelector)]);
   }
   nth(nth) {
-    return new Locator(this._selector, {
-      nth
-    });
+    number(nth, 'nth must be of type number');
+    return new Locator(this._selector, {}, withNth(this._parsed, nth));
   }
   async type(text) {
     const options = {
@@ -1625,6 +1703,29 @@ class Locator {
     });
   }
 }
+const applyLocatorOptions = (parsed, {
+  hasText = '',
+  nth = -1
+}) => {
+  let nextParsed = parsed;
+  if (hasText) {
+    nextParsed = [...nextParsed, {
+      text: hasText,
+      type: 'has-text'
+    }];
+  }
+  if (nth !== -1) {
+    nextParsed = withNth(nextParsed, nth);
+  }
+  return nextParsed;
+};
+const withNth = (parsed, nth) => {
+  const filtered = parsed.filter(part => part.type !== 'nth');
+  return [...filtered, {
+    index: nth,
+    type: 'nth'
+  }];
+};
 
 const createLocator = (selector, options = {}) => {
   string(selector, 'selector must be of type string');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/test-worker",
-  "version": "13.27.0",
+  "version": "14.0.0",
   "description": "Test Worker",
   "repository": {
     "type": "git",