Error in Splunk dashboard while loading

[uagraw01]

Hello Splunkers!!

I am getting below message populating while loading Splunk dashboard as I am using one javascript and css in the dashboard. Please help to fix this error so I will completely disappear.

Error while loading Splunk dashboard.

Error showing in developer console.

[bowesmana]

Can you post your javascript?

[uagraw01]

require(["jquery", "splunkjs/mvc", "splunkjs/mvc/simplexml/ready!"], function($, mvc) {
  
    // Properties
    var earliest = 0;
    var latest = 0;
  
    // Update Lead Time to the correct format
    function setFormatLeadTime() {
        $("#lead_time svg text").each(function() {
            if(!$(this).text().match(":")) {
                $(this).text(secondsTimeSpanToDHM($(this).text()));
            }
        });
    }
    
    // Open a URL in a new window
    function setUrl(url) {
        window.open(url, "_blank");
        return false;
    }
  
    // Default Token Components
    var tokens = mvc.Components.get("default");
    
    // Set On-Click listeners
    $("#throughput .splunk-chart").click(function(){ setUrl("/app/customer_reports/throughput_report_-_0136_system?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#availability .splunk-chart").click(function(){ setUrl("/app/customer_reports/availability_report?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#completeness .splunk-chart").click(function(){ setUrl("/app/customer_reports/completeness_order?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#on_time .splunk-chart").click(function(){ setUrl ("/app/customer_reports/on-time_performance_report_customer?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#utilization .splunk-chart").click(function(){ setUrl("/app/customer_reports/load_forming_logic?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#partitioning .splunk-chart").click(function(){ setUrl("/app/customer_reports/load_forming_logic?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#group_coherence .splunk-chart").click(function(){ setUrl("/app/customer_reports/load_forming_logic?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#lead_time .splunk-chart").click(function(){ setUrl("/app/customer_reports/lead_time_report?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    $("#productivity .splunk-chart").click(function(){ setUrl("/app/customer_reports/productivity_total?form.time.earliest="+earliest+"&form.time.latest="+latest+"") });
    
    // Set Token listener for Lead Time
    tokens.on("change:lead_time", function(model, value, options) {
        setTimeout(function() { setFormatLeadTime() }, 500);
        setTimeout(function() { setFormatLeadTime() }, 1500);
    });
    
    // Set Token listener for earliest_epoch
    tokens.on("change:time.earliest_epoch", function(model, value, options) {
        earliest = value;
    }); 
    
    // Set Token listener for latest_epoch
    tokens.on("change:time.latest_epoch", function(model, value, options) {
        latest = value;
    }); 

    // Attribute listener for date time picker 
    $("#time div[data-test='time-range-dropdown'] button").attrchange({
        trackValues: true, /* Default to false, if set to true the event object is updated with old and new value.*/
        callback: function (event) { 
            //event               - event object
            //event.attributeName - Name of the attribute modified
            //event.oldValue      - Previous value of the modified attribute
            //event.newValue      - New value of the modified attribute
            //Triggered when the selected elements attribute is added/updated/removed
            if (event.attributeName == "aria-expanded" && event.newValue == "true") {
                $("div[data-test-panel-id='date'] > button[data-test='toggle']").click();
                $("div[data-test='range-type'] button").attrchange({
                    trackValues: true,
                    callback: function (event) { 
                        $("button[data-test-value='since']").click()
                    }
                });
                $("div[data-test-value='between'] > button[data-test='toggle']").click(); 
            }
        }
    });

});

@bowesmana Please check the above pasted script.

[bowesmana]

Have you looked at the chromestatus URL - that tells you the events were deprecated in July 2024 - you can re-enable them, but you may want to look at your script against that explanation.

[uagraw01]

@bowesmana Could you help me to understand what does it actually mean ?

[bowesmana]

Unfortunately not - I don't understand it myself