gramjs/examples/betterLogging.js

rewireLoggingToElement(
    () => document.getElementById('log'),
    () => document.getElementById('log-container'),
    true,
)

function rewireLoggingToElement(eleLocator, eleOverflowLocator, autoScroll) {
    fixLoggingFunc('log')

    function fixLoggingFunc(name) {
        console.old = console.log
        console.log = function(...arg) {
            const output = produceOutput(name, arg)
            const eleLog = eleLocator()

            if (autoScroll) {
                const eleContainerLog = eleOverflowLocator()
                const isScrolledToBottom =
          eleContainerLog.scrollHeight - eleContainerLog.clientHeight <=
          eleContainerLog.scrollTop + 1
                eleLog.innerHTML += output + '<br>'
                if (isScrolledToBottom) {
                    eleContainerLog.scrollTop =
            eleContainerLog.scrollHeight - eleContainerLog.clientHeight
                }
            } else {
                eleLog.innerHTML += output + '<br>'
            }

        }
    }

    function produceOutput(name, args) {
        arg =  args[0].replace('%c','')
        return '<span style="'+ args[1]+'">'+arg+'</span>&nbsp;'
    
    }
}