JSFiddle - React, Tailwind, and code Playground

by Rodolpho Brock

HTML

<button onclick="runMessages()">1. runMessages()</button>
<button onclick="toggleConsoles(false)">2. toggleConsoles(false)</button>
<button onclick="toggleConsoles(true)">3. toggleConsoles(true)</button>

<p>*Remember, after you disable the console.info() all messages will not be thrown. Even the info of disabling.</p>

JavaScript

function toggleConsoles(enabled){
    console.enable("debug", enabled);
    console.enable("log", enabled);
    console.enable("info", enabled);
    console.enable("warn", enabled);
    console.enable("error", enabled);
}

function runMessages(){
    console.debug("This is a debug message...")
    console.log("This is a log message...")
    console.info("This is a info message...")
    console.warn("This is a warn message...")
    console.error("This is a error message...")
}

function extendConsole() {
    "use strict";
    try {
        var disabledConsoles = {};

        console.enable = function (level, enabled) {
            // Prevent errors in browsers without console[level]
            if (window.console === 'undefined' || !window.console || window.console === null) {
                window.console = {};
            }
            if (window.console[level] === 'undefined' || !window.console[level] || window.console[level] == null) {
                window.console[level] = function() {};
            }

            if (enabled) {
                if (disabledConsoles[level]) {
                    window.console[level] = disabledConsoles[level];
                }
                console.info("console." + level + "() was enabled.");
            } else {
                disabledConsoles[level] = window.console[level];
                window.console[level] = function () { };
                console.info("console." + level + "() was disabled.");
            }
        };
    } catch (exception) {
        console.error("extendConsole() threw an exception.");
        console.debug(exception);
    }
}

// 
// IIFE - Immediately Invoked Function Expression
// https://stackoverflow.com/questions/18307078/jquery-best-practises-in-case-of-document-ready
(
    function (yourcode) {
        "use strict";
        // The global jQuery object is passed as a parameter
        yourcode(window.jQuery, window, document);
    }(
        function ($, window, document) {
           ...