APEX

I have written a simple dynamic action plugin which has the purpose to refresh a region without showing the spinner while refreshing.

Plugin itself:

Plugin-Type: Dynamic Action

Category: Component

/*Render function*/
function render 
  ( p_dynamic_action in apex_plugin.t_dynamic_action
 
  , p_plugin         in apex_plugin.t_plugin )
return apex_plugin.t_dynamic_action_render_result
as

l_result     apex_plugin.t_dynamic_action_render_result;
  

begin
    
    l_result.javascript_function := 'nameSpace.hiddenRefresh';


    return l_result;
    
end render;

Javascript code:

var nameSpace = {
    hiddenRefresh: function(){
        var da = this;
        //selection via region 
        var regionId = da.action.affectedRegionId;

        jQuery = `#${regionId}`
        //adding css class to hide spinner
        $(jQuery).addClass('hiddenRefresh');

        
        /*****************************************************************/
        
        // VERSION 1 - begin
        	apex.jQuery("#" + regionId).on("apexafterrefresh", function() {
                	$(jQuery).removeClass('hiddenRefresh');
                	// Remove Eventlistener
                	apex.jQuery("#" + regionId).off("apexafterrefresh");

	
        	});
        
	
        	// Refresh Region
        	apex.region(regionId).refresh();
        // VERSION 1  - end
       
        /*****************************************************************/
       

        // VERSION 2 - begin
        var refresh = apex.region(regionId).refresh();
        // remove css class when done
        refresh.then(
        	_ => $(jQuery).removeClass('hiddenRefresh')
         );

        return refresh;
   
        
        // VERSION 2 - end
        /*****************************************************************/  
    }
};

CSS:

.hiddenRefresh .u-Processing { 
    display:none !important;
}

The javascript code includes two versions with the following purpose:

1. search for my element id
2. give the element classList my css-class
3. update region
4. remove the given css class from element when update is done → so that I'm able to refresh a region using the normal refresh action to show the spinner if needed

The first version seems to work, but if multiple refreshs happened at the same time, I would expect the spinner to show when the first refresh is done. So this version is not ideal.

The second version works perfectly fine for reports, but not for charts and here is why:

apex.region(reportId).refresh(); //returns promise
apex.region(chartId).refresh(); //returns nothing

For reports, this line returns a promise and the .then() function is triggered when done. Unfortunately, this is not the case for charts, because the function return nothing. Therefore, the .then function is not applicable in this case for charts.

My question: Is there a solution similar to my second version, which should work in every scenario? Why does the function return no promise for charts?

Any help would be much appreciated!