Group Summary Render Bug?

[martyn.compton]

Not sure if I've found a bug, rendering in group summaries doesn't seem to work consistently and sometimes results in incorrect rendering like the image attached (upper group summary isn't filling out heights/colours of DIV elements like the lower one is...) - Other times this renders absolutely fine... no change to the code, just reloading the page...

Code for renderer as follows:

groupSummary : {
                    showTooltip:false,
                    summaries: [{
                        label:"Utilisation", 
                        renderer : function renderer(renderRef){ 
                            if (renderRef.events.length>0){
                                let resourceList = that.schedulerResourceTimeRangeStore._data;
                                
                                let resourceCount = resourceList.filter(record=>{
                                        return (that.schedulerEngine.resourceStore.getById(record.resourceId).desk===renderRef.events[0].getResource().desk &&
                                            moment(record.startDate).isBefore(moment(renderRef.endDate)) &&
                                            moment(record.startDate).add(record.duration,"minutes").isAfter(moment(renderRef.startDate)));
                                        }
                                    ).length;

                                let backgroundColor="#00FF00";
                                let utilPercent = Math.round((renderRef.events.length/resourceCount)*100);
                                if (utilPercent!==Infinity){
                                    if (utilPercent>=60){
                                        backgroundColor="#FFFF00";
                                    }
                                    if(utilPercent>=80){
                                        backgroundColor="#FF0000";
                                    }
                                }
                                else{
                                    utilPercent="Inf";
                                    backgroundColor="#FF0000";
                                }

                                let barHeight=utilPercent;
                                if (barHeight>100){barHeight=100;}

                                return "<div class='bar-outer'><div class='bar-inner' style='height:"+barHeight+"%;background-color: "+ backgroundColor + "'><label class='" + (utilPercent > 50 ? "b-summarybar-label-inside" : "") + "'>" + utilPercent + "%</label></div></div>";
                            }
                            else {
                                return "<div class='bar-outer'><div class='bar-inner' style='background-color: #00FF00'><label>0%</label></div></div>";
                            }
                        }
                    }]
                }

[mats]

Can you reproduce this in our samples? If yes, please provide a modified version of our sample that we can inspect?

[pmiklashevich]

Also please mention what scheduler version you're using. Try to update to the latest and see if it helps?

[martyn.compton]

Currently running 2.0.3 - it appears that this bug also affects your current example on your example pages

Untitled.png (156.35 KiB) Viewed 2072 times

[martyn.compton]

For your example above, the 4 on the top group summary on friday 06 is rendering internally as the following

<div class="bar-outer">
<div class="bar-inner" style="height:0%">
<label class>4</label>
</div>
</div>

Which is incorrect, it should be outputting

<div class="bar-outer">
<div class="bar-inner" style="height:100%">
<label class="b-summary-label-inside">4</label>
</div>
</div>

I'm seeing very similar behavior in my code as well

[martyn.compton]

This may be an issue with older versions of Chrome, we are running Version 60.0.3112.78 (enterprise locked to not update... really annoying) but everything seems to run fine on my dev install of Chromium...

Looks like it's probably a backwards compatability issue with regards the handling of the internal rendering of these elements

[mats]

Confirmed, ticket opened: https://app.assembla.com/spaces/bryntum/tickets/8667-groupsummary-sometimes-not-rendering/details#

We'll get this fixed!

[martyn.compton]

Thanks mats, was driving me slightly insane trying to figure out where I was going wrong!...

[martyn.compton]

Hi Mats,

Saw this was marked as fixed on the bug report but I'm still experiencing the same issue having upgraded to 2.1.3

Martyn

[pmiklashevich]

Hello Martyn,

Please provide more details, because I cannot reproduce the issue with our online demo anymore. Please see:

2019-07-17_1621.png (425.14 KiB) Viewed 1954 times

Best,
Pavel