@whitesev/utils 2.6.8 → 2.7.0

package/src/DOMUtils.ts

@@ -0,0 +1,287 @@
+import type { WindowApiOption } from "./types/WindowApi";
+import { WindowApi } from "./WindowApi";
+
+class DOMUtils {
+	private windowApi: typeof WindowApi.prototype;
+	constructor(option?: WindowApiOption) {
+		this.windowApi = new WindowApi(option);
+	}
+	/**
+	 * 选择器，可使用以下的额外语法
+	 *
+	 * + :contains([text]) 作用: 找到包含指定文本内容的指定元素
+	 * + :empty 作用:找到既没有文本内容也没有子元素的指定元素
+	 * + :regexp([text]) 作用: 找到符合正则表达式的内容的指定元素
+	 * @param selector 选择器
+	 * @param parent 指定父元素
+	 * @example
+	 * DOMUtils.selector("div:contains('测试')")
+	 * > div.xxx
+	 * @example
+	 * DOMUtils.selector("div:empty")
+	 * > div.xxx
+	 * @example
+	 * DOMUtils.selector("div:regexp('^xxxx$')")
+	 * > div.xxx
+	 */
+	selector<K extends keyof HTMLElementTagNameMap>(
+		selector: K,
+		parent?: Element | Document | DocumentFragment | ShadowRoot
+	): HTMLElementTagNameMap[K] | undefined;
+	selector<E extends Element = Element>(
+		selector: string,
+		parent?: Element | Document | DocumentFragment | ShadowRoot
+	): E | undefined;
+	selector<E extends Element = Element>(
+		selector: string,
+		parent?: Element | Document | DocumentFragment | ShadowRoot
+	) {
+		return this.selectorAll<E>(selector, parent)[0];
+	}
+	/**
+	 * 选择器，可使用以下的额外语法
+	 *
+	 * + :contains([text]) 作用: 找到包含指定文本内容的指定元素
+	 * + :empty 作用:找到既没有文本内容也没有子元素的指定元素
+	 * + :regexp([text]) 作用: 找到符合正则表达式的内容的指定元素
+	 * @param selector 选择器
+	 * @param parent 指定父元素
+	 * @example
+	 * DOMUtils.selectorAll("div:contains('测试')")
+	 * > [div.xxx]
+	 * @example
+	 * DOMUtils.selectorAll("div:empty")
+	 * > [div.xxx]
+	 * @example
+	 * DOMUtils.selectorAll("div:regexp('^xxxx$')")
+	 * > [div.xxx]
+	 * @example
+	 * DOMUtils.selectorAll("div:regexp(/^xxx/ig)")
+	 * > [div.xxx]
+	 */
+	selectorAll<K extends keyof HTMLElementTagNameMap>(
+		selector: K,
+		parent?: Element | Document | DocumentFragment | ShadowRoot
+	): HTMLElementTagNameMap[K][];
+	selectorAll<E extends Element = Element>(
+		selector: string,
+		parent?: Element | Document | DocumentFragment | ShadowRoot
+	): E[];
+	selectorAll<E extends Element = Element>(
+		selector: string,
+		parent?: Element | Document | DocumentFragment | ShadowRoot
+	) {
+		const context = this;
+		parent = parent || context.windowApi.document;
+		selector = selector.trim();
+		if (selector.match(/[^\s]{1}:empty$/gi)) {
+			// empty 语法
+			selector = selector.replace(/:empty$/gi, "");
+			return Array.from(parent.querySelectorAll<E>(selector)).filter(($ele) => {
+				return $ele?.innerHTML?.trim() === "";
+			});
+		} else if (
+			selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)
+		) {
+			// contains 语法
+			let textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
+			let text = textMatch![2];
+			selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
+			return Array.from(parent.querySelectorAll<E>(selector)).filter(($ele) => {
+				// @ts-ignore
+				return ($ele?.textContent || $ele?.innerText)?.includes(text);
+			});
+		} else if (
+			selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)
+		) {
+			// regexp 语法
+			let textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
+			let pattern = textMatch![2];
+			let flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
+			let flags = "";
+			if (flagMatch) {
+				pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
+				flags = flagMatch[3];
+			}
+			let regexp = new RegExp(pattern, flags);
+			selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
+			return Array.from(parent.querySelectorAll<E>(selector)).filter(($ele) => {
+				// @ts-ignore
+				return Boolean(($ele?.textContent || $ele?.innerText)?.match(regexp));
+			});
+		} else {
+			// 普通语法
+			return Array.from(parent.querySelectorAll<E>(selector));
+		}
+	}
+	/**
+	 * 匹配元素，可使用以下的额外语法
+	 *
+	 * + :contains([text]) 作用: 找到包含指定文本内容的指定元素
+	 * + :empty 作用:找到既没有文本内容也没有子元素的指定元素
+	 * + :regexp([text]) 作用: 找到符合正则表达式的内容的指定元素
+	 * @param $el 元素
+	 * @param selector 选择器
+	 * @example
+	 * DOMUtils.matches("div:contains('测试')")
+	 * > true
+	 * @example
+	 * DOMUtils.matches("div:empty")
+	 * > true
+	 * @example
+	 * DOMUtils.matches("div:regexp('^xxxx$')")
+	 * > true
+	 * @example
+	 * DOMUtils.matches("div:regexp(/^xxx/ig)")
+	 * > false
+	 */
+	matches(
+		$el: HTMLElement | Element | null | undefined,
+		selector: string
+	): boolean {
+		selector = selector.trim();
+		if ($el == null) {
+			return false;
+		}
+
+		if (selector.match(/[^\s]{1}:empty$/gi)) {
+			// empty 语法
+			selector = selector.replace(/:empty$/gi, "");
+			return $el.matches(selector) && $el?.innerHTML?.trim() === "";
+		} else if (
+			selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)
+		) {
+			// contains 语法
+			let textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
+			let text = textMatch![2];
+			selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
+			// @ts-ignore
+			let content = $el?.textContent || $el?.innerText;
+			if (typeof content !== "string") {
+				content = "";
+			}
+			return $el.matches(selector) && content?.includes(text);
+		} else if (
+			selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)
+		) {
+			// regexp 语法
+			let textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
+			let pattern = textMatch![2];
+			let flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
+			let flags = "";
+			if (flagMatch) {
+				pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
+				flags = flagMatch[3];
+			}
+			let regexp = new RegExp(pattern, flags);
+			selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
+			// @ts-ignore
+			let content = $el?.textContent || $el?.innerText;
+			if (typeof content !== "string") {
+				content = "";
+			}
+			return $el.matches(selector) && Boolean(content?.match(regexp));
+		} else {
+			// 普通语法
+			return $el.matches(selector);
+		}
+	}
+	/**
+	 * 根据选择器获取上层元素，可使用以下的额外语法
+	 *
+	 * + :contains([text]) 作用: 找到包含指定文本内容的指定元素
+	 * + :empty 作用:找到既没有文本内容也没有子元素的指定元素
+	 * + :regexp([text]) 作用: 找到符合正则表达式的内容的指定元素
+	 * @param $el 元素
+	 * @param selector 选择器
+	 * @example
+	 * DOMUtils.closest("div:contains('测试')")
+	 * > div.xxx
+	 * @example
+	 * DOMUtils.closest("div:empty")
+	 * > div.xxx
+	 * @example
+	 * DOMUtils.closest("div:regexp('^xxxx$')")
+	 * > div.xxxx
+	 * @example
+	 * DOMUtils.closest("div:regexp(/^xxx/ig)")
+	 * > null
+	 */
+	closest<K extends keyof HTMLElementTagNameMap>(
+		$el: HTMLElement | Element,
+		selector: string
+	): HTMLElementTagNameMap[K] | null;
+	closest<E extends Element = Element>(
+		$el: HTMLElement | Element,
+		selector: string
+	): E | null;
+	closest<E extends Element = Element>(
+		$el: HTMLElement | Element,
+		selector: string
+	): E | null {
+		selector = selector.trim();
+
+		if (selector.match(/[^\s]{1}:empty$/gi)) {
+			// empty 语法
+			selector = selector.replace(/:empty$/gi, "");
+			let $closest = $el?.closest<E>(selector);
+			if ($closest && $closest?.innerHTML?.trim() === "") {
+				return $closest;
+			}
+			return null;
+		} else if (
+			selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)
+		) {
+			// contains 语法
+			let textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
+			let text = textMatch![2];
+			selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
+			let $closest = $el?.closest<E>(selector);
+			if ($closest) {
+				// @ts-ignore
+				let content = $el?.textContent || $el?.innerText;
+				if (typeof content === "string" && content.includes(text)) {
+					return $closest;
+				}
+			}
+			return null;
+		} else if (
+			selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
+			selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)
+		) {
+			// regexp 语法
+			let textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
+			let pattern = textMatch![2];
+			let flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
+			let flags = "";
+			if (flagMatch) {
+				pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
+				flags = flagMatch[3];
+			}
+			let regexp = new RegExp(pattern, flags);
+			selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
+			let $closest = $el?.closest<E>(selector);
+			if ($closest) {
+				// @ts-ignore
+				let content = $el?.textContent || $el?.innerText;
+				if (typeof content === "string" && content.match(regexp)) {
+					return $closest;
+				}
+			}
+			return null;
+		} else {
+			// 普通语法
+			let $closest = $el?.closest<E>(selector);
+			return $closest;
+		}
+	}
+}
+
+let domUtils = new DOMUtils();
+
+export { domUtils };

package/src/Dictionary.ts

@@ -1,4 +1,4 @@
-import { Utils } from "./Utils";
+import { CommonUtil } from "./CommonUtil";
 
 class UtilsDictionary<K, V> {
 	private items: {
@@ -120,7 +120,7 @@ class UtilsDictionary<K, V> {
 	 * @param data 需要合并的字典
 	 */
 	concat(data: UtilsDictionary<K, V>) {
-		this.items = Utils.assign(this.items, data.getItems());
+		this.items = CommonUtil.assign(this.items, data.getItems());
 	}
 	forEach(
 		callbackfn: (value: V, key: K, dictionary: UtilsDictionary<K, V>) => void

package/src/Hooks.ts

@@ -33,18 +33,17 @@ class Hooks {
 				return "";
 			}
 			try {
-				eval(
-					"_context[_funcName] = function " +
-						_funcName +
-						"(){\n" +
-						"let args = Array.prototype.slice.call(arguments,0);\n" +
-						"let obj = this;\n" +
-						"hookFunc.apply(obj,args);\n" +
-						"return _context['realFunc_" +
-						_funcName +
-						"'].apply(obj,args);\n" +
-						"};"
-				);
+				new Function(
+					"_context",
+					"_funcName",
+					"hookFunc",
+					`_context[_funcName] = function ${_funcName}() {
+        let args = Array.prototype.slice.call(arguments, 0);
+        let obj = this;
+        hookFunc.apply(obj, args);
+        return _context['realFunc_${_funcName}'].apply(obj, args);
+    };`
+				)(_context, _funcName, hookFunc);
 				(_context as any)[_funcName].prototype.isHooked = true;
 				return true;
 			} catch (e) {

package/src/Httpx.ts

@@ -1,3 +1,5 @@
+import { CommonUtil } from "./CommonUtil";
+import { TryCatch } from "./TryCatch";
 import type {
 	HttpxAllowInterceptConfig,
 	HttpxHookErrorData,
@@ -8,7 +10,6 @@ import type {
 	HttpxPromise,
 	HttpxInitOption,
 } from "./types/Httpx";
-import { Utils } from "./Utils";
 import { GenerateUUID } from "./UtilsCommon";
 
 class Httpx {
@@ -250,13 +251,13 @@ class Httpx {
 				if (typeof args[1] === "object") {
 					/* 处理第二个参数details */
 					let optionArg = args[1];
-					Utils.assign(option, optionArg, true);
+					CommonUtil.assign(option, optionArg, true);
 					option.url = url;
 				}
 			} else {
 				/* 传入的是配置 */
 				let optionArg = args[0];
-				Utils.assign(option, optionArg, true);
+				CommonUtil.assign(option, optionArg, true);
 			}
 			return option;
 		},
@@ -297,7 +298,9 @@ class Httpx {
 					userRequestOption.responseType ||
 					this.context.#defaultRequestOption.responseType,
 				/* 对象使用深拷贝 */
-				headers: Utils.deepClone(this.context.#defaultRequestOption.headers),
+				headers: CommonUtil.deepClone(
+					this.context.#defaultRequestOption.headers
+				),
 				data: userRequestOption.data || this.context.#defaultRequestOption.data,
 				redirect:
 					userRequestOption.redirect ||
@@ -316,7 +319,7 @@ class Httpx {
 					userRequestOption.revalidate ||
 					this.context.#defaultRequestOption.revalidate,
 				/* 对象使用深拷贝 */
-				context: Utils.deepClone(
+				context: CommonUtil.deepClone(
 					userRequestOption.context ||
 						this.context.#defaultRequestOption.context
 				),
@@ -329,7 +332,7 @@ class Httpx {
 				fetch:
 					userRequestOption.fetch || this.context.#defaultRequestOption.fetch,
 				/* 对象使用深拷贝 */
-				fetchInit: Utils.deepClone(
+				fetchInit: CommonUtil.deepClone(
 					this.context.#defaultRequestOption.fetchInit
 				),
 				allowInterceptConfig: {
@@ -627,13 +630,13 @@ class Httpx {
 				if (
 					option[keyName as keyof HttpxRequestOption] == null ||
 					(option[keyName as keyof HttpxRequestOption] instanceof Function &&
-						Utils.isNull(option[keyName as keyof HttpxRequestOption]))
+						CommonUtil.isNull(option[keyName as keyof HttpxRequestOption]))
 				) {
 					Reflect.deleteProperty(option, keyName);
 					return;
 				}
 			});
-			if (Utils.isNull(option.url)) {
+			if (CommonUtil.isNull(option.url)) {
 				throw new TypeError(`Utils.Httpx 参数 url不符合要求: ${option.url}`);
 			}
 			return option;
@@ -861,11 +864,11 @@ class Httpx {
 			let originResponse: HttpxResponseData<HttpxRequestOption> = argsResult[0];
 			/* responseText为空，response不为空的情况 */
 			if (
-				Utils.isNull(originResponse["responseText"]) &&
-				Utils.isNotNull(originResponse["response"])
+				CommonUtil.isNull(originResponse["responseText"]) &&
+				CommonUtil.isNotNull(originResponse["response"])
 			) {
 				if (typeof originResponse["response"] === "object") {
-					Utils.tryCatch().run(() => {
+					TryCatch().run(() => {
 						originResponse["responseText"] = JSON.stringify(
 							originResponse["response"]
 						);
@@ -886,7 +889,7 @@ class Httpx {
 				// 自定义个新的response
 				let httpxResponse: any = httpxResponseText;
 				if (details.responseType === "json") {
-					httpxResponse = Utils.toJSON(httpxResponseText);
+					httpxResponse = CommonUtil.toJSON(httpxResponseText);
 				} else if (details.responseType === "document") {
 					let parser = new DOMParser();
 					httpxResponse = parser.parseFromString(
@@ -1139,7 +1142,7 @@ class Httpx {
 							fetchResponseType.includes("application/json"))
 					) {
 						// response返回格式是JSON格式
-						response = Utils.toJSON(responseText);
+						response = CommonUtil.toJSON(responseText);
 					} else if (
 						option.responseType === "document" ||
 						option.responseType == null
@@ -1245,7 +1248,7 @@ class Httpx {
 				"[Httpx-constructor] 未传入GM_xmlhttpRequest函数或传入的GM_xmlhttpRequest不是Function，将默认使用window.fetch"
 			);
 		}
-		Utils.coverObjectFunctionThis(this);
+		CommonUtil.coverObjectFunctionThis(this);
 		this.interceptors.request.context = this;
 		this.interceptors.response.context = this;
 		this.config(option);
@@ -1258,11 +1261,14 @@ class Httpx {
 		if (typeof option.xmlHttpRequest === "function") {
 			this.GM_Api.xmlHttpRequest = option.xmlHttpRequest;
 		}
-		this.#defaultRequestOption = Utils.assign(
+		this.#defaultRequestOption = CommonUtil.assign(
 			this.#defaultRequestOption,
 			option
 		);
-		this.#defaultInitOption = Utils.assign(this.#defaultInitOption, option);
+		this.#defaultInitOption = CommonUtil.assign(
+			this.#defaultInitOption,
+			option
+		);
 	}
 	/**
 	 * 拦截器

package/src/LockFunction.ts

@@ -1,10 +1,8 @@
-import { Utils } from "./Utils";
-
 class LockFunction<K extends (...args: any[]) => any | Promise<any> | void> {
 	#flag: boolean = false;
 	#delayTime: number = 0;
 	#callback: K;
-	#context: typeof Utils;
+	#timeId: number | undefined = void 0;
 	lock: () => void;
 	unlock: () => void;
 	run: (...args: any[]) => Promise<void>;
@@ -25,22 +23,21 @@ class LockFunction<K extends (...args: any[]) => any | Promise<any> | void> {
 		this.#callback = callback;
 		if (typeof context === "number") {
 			this.#delayTime = context;
-			this.#context = Utils;
 		} else {
 			this.#delayTime = delayTime as number;
-			this.#context = context;
 		}
 		/**
 		 * 锁
 		 */
 		this.lock = function () {
 			that.#flag = true;
+			clearTimeout(that.#timeId);
 		};
 		/**
 		 * 解锁
 		 */
 		this.unlock = function () {
-			Utils.workerSetTimeout(() => {
+			that.#timeId = setTimeout(() => {
 				that.#flag = false;
 			}, that.#delayTime);
 		};
@@ -58,7 +55,7 @@ class LockFunction<K extends (...args: any[]) => any | Promise<any> | void> {
 				return;
 			}
 			that.lock();
-			await that.#callback.apply(that.#context, args);
+			await that.#callback.apply(this, args);
 			that.unlock();
 		};
 	}

package/src/Progress.ts

@@ -1,5 +1,5 @@
+import { CommonUtil } from "./CommonUtil";
 import type { ProgressParamConfig } from "./types/Progress";
-import { Utils } from "./Utils";
 
 class Progress {
 	#config: ProgressParamConfig = {
@@ -48,7 +48,7 @@ class Progress {
 	 * @param paramConfig 配置信息
 	 */
 	constructor(paramConfig: ProgressParamConfig) {
-		this.#config = Utils.assign(this.#config, paramConfig);
+		this.#config = CommonUtil.assign(this.#config, paramConfig);
 		if (!(this.#config.canvasNode instanceof HTMLCanvasElement)) {
 			throw new Error(
 				"Utils.Progress 参数 canvasNode 必须是 HTMLCanvasElement"

package/src/TryCatch.ts

@@ -1,5 +1,4 @@
 import type { UtilsTryCatchConfig, UtilsTryCatchType } from "./types/TryCatch";
-import { Utils } from "./Utils";
 
 export const TryCatch = function (...args: any) {
 	/* 定义变量和函数 */
@@ -17,7 +16,7 @@ export const TryCatch = function (...args: any) {
 		 * @returns
 		 */
 		config(paramDetails: UtilsTryCatchConfig) {
-			defaultDetails = Utils.assign(defaultDetails, paramDetails);
+			defaultDetails = Object.assign(defaultDetails, paramDetails);
 			return TryCatchCore;
 		},
 		/**
@@ -63,9 +62,7 @@ export const TryCatch = function (...args: any) {
 		let result = void 0;
 		try {
 			if (typeof callback === "string") {
-				(function () {
-					eval(callback as string);
-				}).apply(funcThis, args);
+				result = new Function(callback).apply(funcThis, args);
 			} else {
 				result = (callback as Function).apply(funcThis, args);
 			}
@@ -81,10 +78,10 @@ export const TryCatch = function (...args: any) {
 			}
 			if (handleErrorFunc) {
 				if (typeof handleErrorFunc === "string") {
-					result = function () {
-						return eval(handleErrorFunc);
-						// @ts-ignore
-					}.apply(funcThis, [...args, error]);
+					result = new Function(handleErrorFunc).apply(funcThis, [
+						...args,
+						error,
+					]);
 				} else {
 					result = handleErrorFunc.apply(funcThis, [...args, error]);
 				}