Bookmarklets cause syntax errors in Javascript code

Question

(Background: I tried using the JS code found here https://github.com/refined-github/refined-github/issues/1892 but using bookmarks to load all comments in the GitHub PR)

I have the following JS code which works fine when pasted into the console (Chrome).

(() => {
    let tryAttempts = 0;

    function loadComments () {
        let needRescheduling = false;
        const buttons = document.querySelectorAll(".ajax-pagination-btn[data-disable-with]")
        
        buttons.forEach((button) => {
            button.click();
            needRescheduling = true;
            tryAttempts = 0;
        })
        
        if (needRescheduling || tryAttempts < 5) {
            if (needRescheduling) {
                console.log("Loading comments.")
            } else {
                console.log("Looking for more to load.");
            }
            tryAttempts++;
            setTimeout(loadComments, 500)
        } else {
            console.log("All comments loaded.");
    
            const resolvedButtons = document.querySelectorAll(".js-toggle-outdated-comments[data-view-component]");
    
            resolvedButtons.forEach((button) => {
                button.click();
            })
            
            console.log("All resolved comments loaded.")
        }
    }
    loadComments();

})();

Then I tried bookmarking it in Chrome to convert it to

javascript: (() => {    let tryAttempts = 0;    function loadComments () {        let needRescheduling = false;        const buttons = document.querySelectorAll(".ajax-pagination-btn[data-disable-with]")                buttons.forEach((button) => {            button.click();            needRescheduling = true;            tryAttempts = 0;        })                if (needRescheduling || tryAttempts < 5) {            if (needRescheduling) {                console.log("Loading comments.")            } else {                console.log("Looking for more to load.");            }            tryAttempts++;            setTimeout(loadComments, 500)        } else {            console.log("All comments loaded.");                const resolvedButtons = document.querySelectorAll(".js-toggle-outdated-comments[data-view-component]");                resolvedButtons.forEach((button) => {                button.click();            })                        console.log("All resolved comments loaded.")        }    }    loadComments();})();

This will generate a syntax error. Uncaught SyntaxError: Unexpected identifier 'button'

What am I doing wrong here?

Answer 1

Your code depends on automatic semicolon insertion.

That is, some places in your code use line breaks instead of semicolons.

Whatever method you use to convert it to a bookmarklet will remove these new lines, but you will not be able to replace them with semicolons.

You need to add the semicolon manually or fix it so that the semicolon is inserted automatically.