querysub 0.2.0

package/src/diagnostics/errorLogs/hookErrors.ts

@@ -0,0 +1,60 @@
+import { isNode } from "typesafecss";
+import { addLocalLog } from "./ErrorLogController";
+import { LogRaw, LogType } from "./ErrorLogCore";
+import { red, yellow } from "socket-function/src/formatting/logColors";
+
+// Hooks console.* functions to store errors in files
+export function hookErrors() {
+    if (isNode()) {
+        process.on("unhandledRejection", async (reason: any, promise) => {
+            console.error(`Uncaught promise rejection: ${String(reason.stack || reason)}`);
+        });
+        process.on("uncaughtException", (error: Error) => {
+            console.error(`Uncaught exception: ${String(error.stack || error)}`);
+        });
+
+        function hookConsoleFnc(type: LogType, fncName: "log" | "warn" | "error" | "info") {
+            const originalFnc = console[fncName];
+            console[fncName] = (...args: any[]) => {
+                if (
+                    typeof args[0] === "string"
+                    && !args[0].includes("\x1b")
+                ) {
+                    if (fncName === "warn") {
+                        args = args.slice();
+                        args[0] = yellow(args[0]);
+                    } else if (fncName === "error") {
+                        args = args.slice();
+                        args[0] = red(args[0]);
+                    }
+                }
+                if (fncName === "warn" || fncName === "error") {
+                    // Add stack traces
+                    if (args.length === 1 && typeof args[0] === "string" && !args[0].includes("\n")) {
+                        args = args.slice();
+                        args[0] = new Error(args[0]).stack || args[0];
+                    }
+                }
+                addLocalLog({ message: args.join(" | "), time: Date.now() }, type);
+                originalFnc(...args);
+            };
+        }
+        // NOTE: Hooking log will produce too much data. If we want to know if somethin happened,
+        //  we should use console.info OR... even better, track in it the DB, at an app level.
+        //hookConsoleFnc("info", "log");
+        hookConsoleFnc("info", "info");
+        hookConsoleFnc("warn", "warn");
+        hookConsoleFnc("error", "error");
+    } else {
+        // NOTE: We aren't going to log clientside errors serverside... just yet...
+        // window.onerror = window.onunhandledrejection = (...args: unknown[]) => {
+        //     let error = args[4] as Error;
+        //     if (!error) {
+        //         error = (args[0] as any).reason || { message: args[0] };
+        //     }
+        //     // Ignore ResizeObserver errors, they are spurious
+        //     //  - https://github.com/vercel/next.js/discussions/51551
+        //     if (error.message.startsWith("ResizeObserver loop")) return;
+        // };
+    }
+}

package/src/diagnostics/errorLogs/logFiltering.tsx

@@ -0,0 +1,149 @@
+import { URLParam, createURLSync } from "../../../src/library-components/URLParam";
+import preact from "preact"; import { qreact } from "../../../src/4-dom/qreact";
+import { Button } from "../../../src/library-components/Button";
+import { css } from "typesafecss";
+import { LogBlockInfo } from "../../../src/diagnostics/errorLogs/ErrorLogCore";
+import { cache } from "socket-function/src/caching";
+import { formatNumber } from "socket-function/src/formatting/format";
+import { TimelineInfo } from "./LogTimeSelector";
+import { getPathFromStr, getPathStr } from "../../../src/path";
+
+// NOTE: You visit the page to see errors, so that's what we mostly show.
+//     - We show all values inside the top UI AND the "last" UI
+//          - The "top" UI helps the user discover what they can see
+//          - The "last" UI results in being able to see if the warning fraction is increasing
+//              - Also, because of the minimum size, it SHOULD allow seeing if there are any fatals
+//                  or infos (the fraction will almost always be crushed by warnings though).
+//      - The rest of the UI is just based on showing when things happened, and then
+//          resolving recent issues.
+
+export const showFatalURL = new URLParam("showLogs", true);
+export const showErrorURL = new URLParam("showErrors", true);
+export const showWarningURL = new URLParam("showWarnings", false);
+export const showInfoURL = new URLParam("showInfos", false);
+
+export const showOldestLogsFirstURL = new URLParam("logOldestFirst", false);
+export const showLiveLogsURL = new URLParam("showLiveLogs", true);
+
+// getPathStr(ids)
+export const filterToClassesURL = new URLParam("filterToClasses", "");
+export const filterMachineIdsURL = new URLParam("filterMachineIds", "");
+export const filterThreadIdsURL = new URLParam("filterThreadIds", "");
+
+export function getPathArrayLax(str: string) {
+    if (!str) return [];
+    let array = getPathFromStr(str);
+    if (!array.length) return [str];
+    return array;
+}
+export function getLogFilterClasses() {
+    return getPathArrayLax(filterToClassesURL.value);
+}
+export function getLogFilterMachineIds() {
+    return getPathArrayLax(filterMachineIdsURL.value);
+}
+export function getLogFilterThreadIds() {
+    return getPathArrayLax(filterThreadIdsURL.value);
+}
+
+export const fatalColor = { h: -5, s: 75, l: 75 };
+export const errorColor = { h: 0, s: 50, l: 50 };
+export const warnColor = { h: 50, s: 50, l: 50 };
+export const infoColor = { h: 200, s: 50, l: 50 };
+
+export const countColors = {
+    fatal: fatalColor,
+    error: errorColor,
+    warn: warnColor,
+    info: infoColor,
+};
+
+export type Counts = {
+    total: number;
+    fatal: number;
+    error: number;
+    warn: number;
+    info: number;
+};
+export let countTypes = ["fatal", "error", "warn", "info"] as const;
+
+
+export class PickLogType extends qreact.Component<{
+    infos: TimelineInfo[] | undefined;
+}> {
+    render() {
+        let counts = countTypesCache(this.props.infos);
+        function renderShowButton(config: {
+            url: URLParam<boolean>;
+            title: string;
+            color: { h: number; s: number; l: number; };
+            count: number;
+        }) {
+            let { url, title, color, count } = config;
+            color = { ...color };
+            if (!url.value) {
+                color.s -= 30;
+            }
+            return (
+                <Button
+                    class={css
+                        .hsla(color.h, color.s, color.l, 1)
+                        .button
+                        .color("white")
+                        .border("1px solid hsl(0, 0%, 10%)")
+                        .boldStyle
+                        .pad2(30, 16)
+                        + (!url.value ? css.opacity(0.5) : "")
+                    }
+                    onClick={() => url.value = !url.value}
+                >
+                    {url.value ? "Hide " : "Show "} {formatNumber(count)} {title}s
+                </Button>
+            );
+        }
+        return (
+            <div class={css.hbox(2).center}>
+                {renderShowButton({
+                    url: showFatalURL,
+                    title: "Fatal",
+                    color: fatalColor,
+                    count: counts.fatalCount,
+                })}
+                {renderShowButton({
+                    url: showErrorURL,
+                    title: "Error",
+                    color: errorColor,
+                    count: counts.errorCount,
+                })}
+                {renderShowButton({
+                    url: showWarningURL,
+                    title: "Warning",
+                    color: warnColor,
+                    count: counts.warnCount,
+                })}
+                {renderShowButton({
+                    url: showInfoURL,
+                    title: "Info",
+                    color: infoColor,
+                    count: counts.infoCount,
+                })}
+            </div>
+        );
+    }
+}
+
+const countTypesCache = cache((infos: TimelineInfo[] | undefined) => {
+    let fatalCount = 0;
+    let errorCount = 0;
+    let warnCount = 0;
+    let infoCount = 0;
+    if (infos) {
+        for (let info of infos) {
+            fatalCount += info.fatalCount;
+            errorCount += info.errorCount;
+            warnCount += info.warnCount;
+            infoCount += info.infoCount;
+        }
+    }
+    return { fatalCount, errorCount, warnCount, infoCount };
+});

package/src/diagnostics/heapTag.ts

@@ -0,0 +1,13 @@
+import { cache } from "socket-function/src/caching";
+
+const ENABLE_HEAP_TAGS = false;
+
+export const heapTagObj = cache((name: string): <T>(obj: T) => T => {
+    let cls = eval(`(class ${name} { })`);
+    return (obj) => {
+        if (!ENABLE_HEAP_TAGS) return obj;
+        let taggedObj = new cls();
+        Object.assign(taggedObj, obj);
+        return taggedObj;
+    };
+});

package/src/diagnostics/listenOnDebugger.ts

@@ -0,0 +1,77 @@
+import { isNode } from "socket-function/src/misc";
+import inspector from "inspector";
+import fs from "fs";
+import { getSubFolder } from "../fs";
+import { SocketFunction } from "socket-function/SocketFunction";
+import debugbreak from "debugbreak";
+
+let devToolsUrl = "";
+
+export function listenOnDebugger(name: string) {
+    if (devToolsUrl) return;
+    if (!isNode()) return;
+    // NOTE: Fails if we are already listening, which is fine.
+    try { inspector.open(); } catch { }
+    let url = inspector.url();
+    if (!url) {
+        url = baseGetInspectorUrl();
+    }
+
+    devToolsUrl = `devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&${url.replace("://", "=")}`;
+    devToolsUrl = devToolsUrl.replace("devtools://devtools/bundled", "https://notdevtools.com/devtools");
+    console.log(`Debugger listening on ${devToolsUrl}`);
+
+    const ext = ".url";
+    const debuggerFolder = getSubFolder("debugger");
+    let otherDebuggers = fs.readdirSync(debuggerFolder);
+    otherDebuggers = otherDebuggers.filter(x => x.endsWith(ext));
+    // Delete all files for processes that no longer exist
+    for (let other of otherDebuggers) {
+        let pid = +other.split("-")[0];
+        let ppid = +other.split("-")[1];
+        if (!doesProcessExist(pid) || !doesProcessExist(ppid)) {
+            try {
+                fs.unlinkSync(debuggerFolder + other);
+            } catch { }
+        }
+    }
+
+    // TODO: Support OSX links are well (detect the system and switch depending on that)
+    let linkBody = `[InternetShortcut]
+URL=${devToolsUrl}
+`;
+    fs.writeFileSync(getSubFolder("debugger") + process.pid + "-" + process.ppid + "-" + name + ext, linkBody);
+    setTimeout(() => {
+        if (SocketFunction.mountedNodeId) {
+            let subName = SocketFunction.mountedNodeId.replaceAll(":", "_") + "-" + name;
+            fs.writeFileSync(getSubFolder("debugger") + process.pid + "-" + process.ppid + "-" + subName + ext, linkBody);
+        }
+    }, 5 * 1000);
+}
+export function getDebuggerUrl() {
+    if (!devToolsUrl) throw new Error(`listenOnDebugger must be called before getDebuggerUrl`);
+    return devToolsUrl;
+}
+function doesProcessExist(pid: number) {
+    try {
+        process.kill(pid, 0);
+        return true;
+    } catch {
+        return false;
+    }
+}
+function baseGetInspectorUrl() {
+    function getNextPort() {
+        return 49152 + ~~((65535 - 49152) * Math.random());
+    }
+
+    while (true) {
+        let url = inspector.url();
+        if (url) return url;
+        try {
+            inspector.open(getNextPort());
+        } catch {
+            continue;
+        }
+    }
+}