@jeniex/utils 1.0.6 → 1.0.8

package/browser/index.cjs

@@ -50,9 +50,9 @@ else {
     infoObject = { script: { name: document.title } };
 }
 const scriptName = infoObject.script.name;
-/** The identifier of the script to be used in logging */
+/** The identifier of the script to be used in logging. */
 const logId = `[${scriptName}]:`;
-/** The initial tab URL on the script run */
+/** The initial tab URL on the script run. */
 const tabURL = window.location.href;
 
 function alert(message) {
@@ -69,6 +69,90 @@ function prompt(message, _default) {
     return window.prompt(`[ ${scriptName} ]\n\n${message}`, _default);
 }
 
+async function fishResponse(url, options) {
+    const response = await fetch(url, options);
+    if (!response.ok) {
+        throw new Error(`Request to ${response.url} ended with ${response.status} status.`);
+    }
+    return response;
+}
+
+// Note: to set the 'cookie' header, you have to set 'anonymous' to true.
+async function fishXResponse(url, fishOptions) {
+    const { method, anonymous, headers, body, timeOut, onProgress } = fishOptions ?? {};
+    return new Promise((resolve, reject) => {
+        GM.xmlHttpRequest({
+            url,
+            method: method ?? 'GET',
+            headers,
+            anonymous,
+            data: body,
+            responseType: 'blob',
+            timeout: timeOut,
+            onprogress: onProgress,
+            onload({ response, statusText, status, finalUrl }) {
+                const ok = status >= 200 && status < 300;
+                if (!ok) {
+                    reject(new Error(`Request to ${url} ended with ${status} status.`));
+                    return;
+                }
+                const properResponse = new Response(response, {
+                    statusText,
+                    status,
+                });
+                Object.defineProperty(properResponse, 'url', { value: finalUrl });
+                resolve(properResponse);
+            },
+            onerror({ status }) {
+                reject(new Error(`Request to ${url} ended with ${status} status.`));
+            },
+        });
+    });
+}
+
+async function fishBlob(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.blob();
+}
+
+async function fishBuffer(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.arrayBuffer();
+}
+
+async function fishDocument(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    const responseText = await response.text();
+    const parser = new DOMParser();
+    return parser.parseFromString(responseText, 'text/html');
+}
+
+async function fishJson(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.json();
+}
+
+async function fishText(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.text();
+}
+
+// https://httpbin.org/anything
+const fish = {
+    blob: async (url, options) => fishBlob(url, options),
+    buffer: async (url, options) => fishBuffer(url, options),
+    document: async (url, options) => fishDocument(url, options),
+    json: async (url, options) => fishJson(url, options),
+    text: async (url, options) => fishText(url, options),
+};
+const fishX = {
+    blob: async (url, options) => fishBlob(url, options, true),
+    buffer: async (url, options) => fishBuffer(url, options, true),
+    document: async (url, options) => fishDocument(url, options, true),
+    json: async (url, options) => fishJson(url, options, true),
+    text: async (url, options) => fishText(url, options, true),
+};
+
 function $(selectors, parent) {
     const element = (parent ?? document).querySelector(ensureJoin(selectors));
     if (element === null) {
@@ -84,6 +168,91 @@ function $$(selectors, parent) {
     return elements;
 }
 
+/**
+ * @param key The name of the param in the search query.
+ * @param fullURL If provided, it will be our target, otherwise it is the current location.
+ */
+function getSearchParam(key, fullURL) {
+    const { search } = new URL(fullURL ?? window.location.href);
+    const searchParams = new URLSearchParams(search);
+    const value = searchParams.get(key);
+    if (value === null) {
+        return undefined;
+    }
+    return value;
+}
+/**
+ *
+ * @param key The name of the param that is to be in the search query.
+ * @param value Its value.
+ * @param fullURL If provided, it will be our target, otherwise it is the current location.
+ */
+function setSearchParam(key, value, fullURL) {
+    const updatedURL = [];
+    const { origin, pathname, search, hash } = new URL(fullURL ?? window.location.href);
+    const searchParams = new URLSearchParams(search);
+    searchParams.set(key, value);
+    updatedURL.push(origin, pathname, '?', searchParams.toString());
+    if (hash !== '') {
+        updatedURL.push(hash);
+    }
+    return updatedURL.join('');
+}
+
+function addStyle(css, parent = document.documentElement) {
+    const style = document.createElement('style');
+    style.setAttribute('type', 'text/css');
+    style.textContent = css;
+    parent.append(style);
+    return style;
+}
+
+/**
+ * Waits for image to fully load or throws an error if it fails.
+ */
+async function imageLoad(img) {
+    return new Promise((resolve, reject) => {
+        if (img.complete) {
+            resolve();
+            return;
+        }
+        let onLoad;
+        let onError;
+        const removeListeners = () => {
+            img.removeEventListener('load', onLoad);
+            img.removeEventListener('error', onError);
+        };
+        onLoad = () => {
+            removeListeners();
+            resolve();
+        };
+        onError = () => {
+            removeListeners();
+            reject(new Error('Image failed to load'));
+        };
+        img.addEventListener('load', onLoad);
+        img.addEventListener('error', onError);
+    });
+}
+
+/**
+ * Waits for the page to load.
+ * @param completely Whether or not to wait for resources to load as well.
+ */
+async function pageLoad(completely) {
+    return new Promise((resolve) => {
+        if (document.readyState === 'complete') {
+            resolve();
+            return;
+        }
+        if (completely === true) {
+            window.addEventListener('load', () => resolve());
+            return;
+        }
+        document.addEventListener('DOMContentLoaded', () => resolve());
+    });
+}
+
 function createFlagMessage(flag) {
     const { message: messageHeader, values, type } = flag;
     let message = messageHeader;
@@ -161,11 +330,18 @@ async function getOptions(flags) {
 
 exports.$ = $;
 exports.$$ = $$;
+exports.addStyle = addStyle;
 exports.alert = alert;
 exports.asserted = asserted;
 exports.confirm = confirm;
 exports.ensureJoin = ensureJoin;
+exports.fish = fish;
+exports.fishResponse = fishResponse;
+exports.fishX = fishX;
+exports.fishXResponse = fishXResponse;
 exports.getOptions = getOptions;
+exports.getSearchParam = getSearchParam;
+exports.imageLoad = imageLoad;
 exports.isFalsy = isFalsy;
 exports.isNotNullish = isNotNullish;
 exports.isNullish = isNullish;
@@ -173,7 +349,9 @@ exports.isString = isString;
 exports.isTruthy = isTruthy;
 exports.logId = logId;
 exports.noop = noop;
+exports.pageLoad = pageLoad;
 exports.prompt = prompt;
 exports.scriptName = scriptName;
+exports.setSearchParam = setSearchParam;
 exports.sleep = sleep;
 exports.tabURL = tabURL;

package/browser/index.d.ts

@@ -19,17 +19,67 @@ declare function alert(message?: string): void;
 declare function confirm(message: string): boolean;
 declare function prompt(message: string, _default?: string): string | null;
 
+type Method = 'CONNECT' | 'DELETE' | 'GET' | 'HEAD' | 'OPTIONS' | 'PATCH' | 'POST' | 'PUT' | 'TRACE';
+interface FishXOptions {
+    method?: Method;
+    anonymous?: boolean;
+    headers?: Record<string, string>;
+    body?: Blob | FormData | string;
+    timeOut?: number;
+    onProgress?: (response: VMScriptResponseObject<Blob>) => Promise<void> | void;
+}
+interface Fish<T> {
+    blob: (url: string, options?: T) => Promise<Blob>;
+    buffer: (url: string, options?: T) => Promise<ArrayBuffer>;
+    document: (url: string, options?: T) => Promise<Document>;
+    json: (url: string, options?: T) => Promise<object>;
+    text: (url: string, options?: T) => Promise<string>;
+}
+
+declare function fishResponse(url: string, options?: RequestInit): Promise<Response>;
+
+declare function fishXResponse(url: string, fishOptions?: FishXOptions): Promise<Response>;
+
+declare const fish: Fish<RequestInit>;
+declare const fishX: Fish<FishXOptions>;
+
 type Parent = Document | HTMLElement;
 type Selectors = string[] | string;
 declare function $<T = HTMLElement>(selectors: Selectors, parent?: Parent): T;
 declare function $$<T extends Element = HTMLElement>(selectors: Selectors, parent?: Parent): NodeListOf<T>;
 
+/**
+ * @param key The name of the param in the search query.
+ * @param fullURL If provided, it will be our target, otherwise it is the current location.
+ */
+declare function getSearchParam(key: string, fullURL?: string): string | undefined;
+/**
+ *
+ * @param key The name of the param that is to be in the search query.
+ * @param value Its value.
+ * @param fullURL If provided, it will be our target, otherwise it is the current location.
+ */
+declare function setSearchParam(key: string, value: string, fullURL?: string): string;
+
 declare const scriptName: string;
-/** The identifier of the script to be used in logging */
+/** The identifier of the script to be used in logging. */
 declare const logId: string;
-/** The initial tab URL on the script run */
+/** The initial tab URL on the script run. */
 declare const tabURL: string;
 
+declare function addStyle(css: string, parent?: HTMLElement): HTMLStyleElement;
+
+/**
+ * Waits for image to fully load or throws an error if it fails.
+ */
+declare function imageLoad(img: HTMLImageElement): Promise<void>;
+
+/**
+ * Waits for the page to load.
+ * @param completely Whether or not to wait for resources to load as well.
+ */
+declare function pageLoad(completely: boolean): Promise<void>;
+
 interface FlagBase {
     name: string;
     message: string;
@@ -56,4 +106,4 @@ type Options = Record<string, FlagValue>;
 
 declare function getOptions(flags: Flag[]): Promise<Options>;
 
-export { $, $$, Flag, Fn, Nullable, alert, asserted, confirm, ensureJoin, getOptions, isFalsy, isNotNullish, isNullish, isString, isTruthy, logId, noop, prompt, scriptName, sleep, tabURL };
+export { $, $$, Flag, Fn, Nullable, addStyle, alert, asserted, confirm, ensureJoin, fish, fishResponse, fishX, fishXResponse, getOptions, getSearchParam, imageLoad, isFalsy, isNotNullish, isNullish, isString, isTruthy, logId, noop, pageLoad, prompt, scriptName, setSearchParam, sleep, tabURL };

package/browser/index.js

@@ -48,9 +48,9 @@ else {
     infoObject = { script: { name: document.title } };
 }
 const scriptName = infoObject.script.name;
-/** The identifier of the script to be used in logging */
+/** The identifier of the script to be used in logging. */
 const logId = `[${scriptName}]:`;
-/** The initial tab URL on the script run */
+/** The initial tab URL on the script run. */
 const tabURL = window.location.href;
 
 function alert(message) {
@@ -67,6 +67,90 @@ function prompt(message, _default) {
     return window.prompt(`[ ${scriptName} ]\n\n${message}`, _default);
 }
 
+async function fishResponse(url, options) {
+    const response = await fetch(url, options);
+    if (!response.ok) {
+        throw new Error(`Request to ${response.url} ended with ${response.status} status.`);
+    }
+    return response;
+}
+
+// Note: to set the 'cookie' header, you have to set 'anonymous' to true.
+async function fishXResponse(url, fishOptions) {
+    const { method, anonymous, headers, body, timeOut, onProgress } = fishOptions ?? {};
+    return new Promise((resolve, reject) => {
+        GM.xmlHttpRequest({
+            url,
+            method: method ?? 'GET',
+            headers,
+            anonymous,
+            data: body,
+            responseType: 'blob',
+            timeout: timeOut,
+            onprogress: onProgress,
+            onload({ response, statusText, status, finalUrl }) {
+                const ok = status >= 200 && status < 300;
+                if (!ok) {
+                    reject(new Error(`Request to ${url} ended with ${status} status.`));
+                    return;
+                }
+                const properResponse = new Response(response, {
+                    statusText,
+                    status,
+                });
+                Object.defineProperty(properResponse, 'url', { value: finalUrl });
+                resolve(properResponse);
+            },
+            onerror({ status }) {
+                reject(new Error(`Request to ${url} ended with ${status} status.`));
+            },
+        });
+    });
+}
+
+async function fishBlob(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.blob();
+}
+
+async function fishBuffer(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.arrayBuffer();
+}
+
+async function fishDocument(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    const responseText = await response.text();
+    const parser = new DOMParser();
+    return parser.parseFromString(responseText, 'text/html');
+}
+
+async function fishJson(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.json();
+}
+
+async function fishText(url, options, x) {
+    const response = await (x ? fishXResponse : fishResponse)(url, options);
+    return response.text();
+}
+
+// https://httpbin.org/anything
+const fish = {
+    blob: async (url, options) => fishBlob(url, options),
+    buffer: async (url, options) => fishBuffer(url, options),
+    document: async (url, options) => fishDocument(url, options),
+    json: async (url, options) => fishJson(url, options),
+    text: async (url, options) => fishText(url, options),
+};
+const fishX = {
+    blob: async (url, options) => fishBlob(url, options, true),
+    buffer: async (url, options) => fishBuffer(url, options, true),
+    document: async (url, options) => fishDocument(url, options, true),
+    json: async (url, options) => fishJson(url, options, true),
+    text: async (url, options) => fishText(url, options, true),
+};
+
 function $(selectors, parent) {
     const element = (parent ?? document).querySelector(ensureJoin(selectors));
     if (element === null) {
@@ -82,6 +166,91 @@ function $$(selectors, parent) {
     return elements;
 }
 
+/**
+ * @param key The name of the param in the search query.
+ * @param fullURL If provided, it will be our target, otherwise it is the current location.
+ */
+function getSearchParam(key, fullURL) {
+    const { search } = new URL(fullURL ?? window.location.href);
+    const searchParams = new URLSearchParams(search);
+    const value = searchParams.get(key);
+    if (value === null) {
+        return undefined;
+    }
+    return value;
+}
+/**
+ *
+ * @param key The name of the param that is to be in the search query.
+ * @param value Its value.
+ * @param fullURL If provided, it will be our target, otherwise it is the current location.
+ */
+function setSearchParam(key, value, fullURL) {
+    const updatedURL = [];
+    const { origin, pathname, search, hash } = new URL(fullURL ?? window.location.href);
+    const searchParams = new URLSearchParams(search);
+    searchParams.set(key, value);
+    updatedURL.push(origin, pathname, '?', searchParams.toString());
+    if (hash !== '') {
+        updatedURL.push(hash);
+    }
+    return updatedURL.join('');
+}
+
+function addStyle(css, parent = document.documentElement) {
+    const style = document.createElement('style');
+    style.setAttribute('type', 'text/css');
+    style.textContent = css;
+    parent.append(style);
+    return style;
+}
+
+/**
+ * Waits for image to fully load or throws an error if it fails.
+ */
+async function imageLoad(img) {
+    return new Promise((resolve, reject) => {
+        if (img.complete) {
+            resolve();
+            return;
+        }
+        let onLoad;
+        let onError;
+        const removeListeners = () => {
+            img.removeEventListener('load', onLoad);
+            img.removeEventListener('error', onError);
+        };
+        onLoad = () => {
+            removeListeners();
+            resolve();
+        };
+        onError = () => {
+            removeListeners();
+            reject(new Error('Image failed to load'));
+        };
+        img.addEventListener('load', onLoad);
+        img.addEventListener('error', onError);
+    });
+}
+
+/**
+ * Waits for the page to load.
+ * @param completely Whether or not to wait for resources to load as well.
+ */
+async function pageLoad(completely) {
+    return new Promise((resolve) => {
+        if (document.readyState === 'complete') {
+            resolve();
+            return;
+        }
+        if (completely === true) {
+            window.addEventListener('load', () => resolve());
+            return;
+        }
+        document.addEventListener('DOMContentLoaded', () => resolve());
+    });
+}
+
 function createFlagMessage(flag) {
     const { message: messageHeader, values, type } = flag;
     let message = messageHeader;
@@ -157,4 +326,4 @@ async function getOptions(flags) {
     return options;
 }
 
-export { $, $$, alert, asserted, confirm, ensureJoin, getOptions, isFalsy, isNotNullish, isNullish, isString, isTruthy, logId, noop, prompt, scriptName, sleep, tabURL };
+export { $, $$, addStyle, alert, asserted, confirm, ensureJoin, fish, fishResponse, fishX, fishXResponse, getOptions, getSearchParam, imageLoad, isFalsy, isNotNullish, isNullish, isString, isTruthy, logId, noop, pageLoad, prompt, scriptName, setSearchParam, sleep, tabURL };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jeniex/utils",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "author": "JenieX",
   "homepage": "https://github.com/JenieX/utils",
   "type": "module",