TildesCommentLinkFix.user.js

// ==UserScript==
// @name         Tildes Comment Link Fix
// @namespace    https://gist.github.com/blankdvth/6da89fff580e8cf6e50f88847ddb5729
// @version      1.2.0
// @description  Fixes comment links (anchors) not working as a result of Tildes' comment collapsing feature.
// @author       blank_dvth
// @match        https://tildes.net/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=tildes.net
// @grant        none
// ==/UserScript==

/* 
    USER SETTINGS
    This script is not big enough to warrant a visual settings menu, so adjust settings here.
    true = enable, false = disable
*/
const alwaysRun_S = false; // If enabled, will always run the script, even if the comment was not collapsed (site works fine in this case). This is useful if you want to make use of the other settings.
const smoothScroll_S = false; // If enabled, will smoothly (animated) scroll to the comment. If disabled, will jump to the comment.
const uncollapseIndividual_S = true; // If enabled will uncollapse parent comments into one line instead of fully uncollapsing them.
const uncollapseChildren_S = true; // If enabled, will uncollapse all children of the comment. If disabled, will leave them collapsed.
const collapseIrrelevant_S = true; // The script uncollapses all parents to ensure the comment is visible. This will collapse irrelevant (not direct parent) comments again.
// END OF USER SETTINGS

/**
 * Uncollapses the comment if it is collapsed.
 * @param {HTMLElement} element Article element of the actual comment
 * @param {boolean} individual If true, will "uncollapse" into one line instead of fully uncollapsing
 * @returns {boolean} True if the comment was collapsed, false if it was not
 */
function uncollapse(element, individual = false) {
    if (element.nodeName !== "ARTICLE") return false;
    var removed = false;
    if (
        !individual &&
        element.classList.contains("is-comment-collapsed-individual")
    ) {
        element.classList.remove("is-comment-collapsed-individual");
        removed = true;
    }
    if (element.classList.contains("is-comment-collapsed")) {
        if (individual)
            element.classList.add("is-comment-collapsed-individual");
        element.classList.remove("is-comment-collapsed");
        removed = true;
    }
    return removed;
}

/**
 * Uncollapses all direct parents of the comment.
 * @param {HTMLElement} element Article element of the actual comment
 * @param {boolean} collapseIrrelevant If true, will collapse irrelevant comments again
 * @param {boolean} individual If true, will "uncollapse" into one line instead of fully uncollapsing
 * @returns {boolean} True if any parent was collapsed, false if none were
 */
function uncollapseParents(element, collapseIrrelevant, individual) {
    const relevant = []; // List of relevant elements (direct parents)
    var wasCollapsed = false; // Whether any parent was collapsed
    while (
        element.parentElement &&
        element.parentElement.nodeName !== "SECTION"
    ) {
        element = element.parentElement;
        relevant.push(element); // Add parent to relevant list
        if (uncollapse(element, individual)) wasCollapsed = true;
        // Collapse all irrelevant sibling comments (if feature enabled)
        if (collapseIrrelevant && element.nodeName === "ARTICLE") {
            element
                .querySelectorAll(
                    `article#${element.id} > ol.comment-tree > li.comment-tree-item > article:not(.is-comment-collapsed)`
                )
                .forEach((child) => {
                    if (!relevant.includes(child))
                        child.classList.add("is-comment-collapsed");
                });
        }
    }
    return wasCollapsed;
}

/**
 * Uncollapses all direct children of the comment.
 * @param {HTMLElement} element Article element of the actual comment
 */
function uncollapseChildren(element) {
    element
        .querySelectorAll("article.is-comment-collapsed article.is-comment-collapsed-individual")
        .forEach(uncollapse);
}

(function () {
    if (!location.hash.startsWith("#comment-")) return; // Not a comment hash
    const comment = document.getElementById(location.hash.substring(1)); // Get comment element
    if (!comment) return; // Comment does not exist
    // Uncollapse the comment itself, and it's parents, then perform other actions if needed/enabled
    if (
        uncollapse(comment) |
            uncollapseParents(
                comment,
                collapseIrrelevant_S,
                uncollapseIndividual_S
            ) ||
        alwaysRun_S
    ) {
        // Uncollapse all children (if feature enabled)
        if (uncollapseChildren_S) uncollapseChildren(comment);
        // Scroll to the comment
        if (smoothScroll_S) comment.scrollIntoView({ behavior: "smooth" });
        else comment.scrollIntoView();
    }
})();