HABPanel debug possibilites

Hello,
since a while I do my best to develop HAP Panel based on the Matrix Theme. I do make progress slow but still. Lately I slowed down rapidly on the debugging possibilities. Let me present the example.
I wish to have all battery icons format displayed dependently on their capacity. For this I defined different style of the icon and implement condition formatting. For some reasons few sensors are recognised as almost empty however they are 100% charged. Some icons are not displayed at all on one device on another there is no problem (cashing?)
How can I debug my code? How can I get what is really behind the displayed values?

This is the real status of my sensor batts:

This is the representation on the Panel:

This is my code on the HABPanel:

/*Part of the .css file

.section .icon.off svg {
  stroke: #565f58;
  fill: #565f58;
}
.section .icon.on svg {
  stroke: #26bf75;
  fill: #26bf75;
}
.section .icon.warn svg {
  stroke: #ff2c0a;
  fill: #ff2c0a;
  animation: blinker 1s linear infinite;
}
.section .icon.warny svg {
  stroke: #ffb70a;
  fill: #ffb70a;
}
end of style formating */

<div class="title">Batteries</div>
  <div class="controls">
  	<div ng-repeat="item in itemsInGroup('gBattery')">
 		<div class="widget wide" ng-if="itemValue(item.name) >='80'">
			<div class="icon off"><svg viewBox="0 0 48 48"><use xlink:href="/static/matrix-theme/squidink.svg#charging-3"></use></svg></div>
        <div class="name">{{item.label}}</div>
 		<div class="valueGroup">
			<div class="value">{{item.value}}%</div>
		</div>
    </div>
    <div class="widget wide" ng-if="itemValue(item.name) <'80' && itemValue(item.name) >='60'">
		<div class="icon off"><svg viewBox="0 0 48 48"><use xlink:href="/static/matrix-theme/squidink.svg#charging-2"></use></svg></div>
        <div class="name">{{item.label}}</div>
        <div class="valueGroup">
		<div class="value">{{item.value}}%</div>
	</div>
	</div>
    <div class="widget wide" ng-if="itemValue(item.name) <'60' && itemValue(item.name) >='20'">
		<div class="icon warny"><svg viewBox="0 0 48 48"><use xlink:href="/static/matrix-theme/squidink.svg#charging-1"></use></svg></div>
        <div class="name">{{item.label}}</div>
        <div class="valueGroup">
		<div class="value">{{item.value}}%</div>
	</div>
	</div>
    <div class="widget wide" ng-if="itemValue(item.name) <'15'">
	    <div class="icon warn"><svg viewBox="0 0 48 48"><use xlink:href="/static/matrix-theme/squidink.svg#charging-1"></use></svg></div>
        <div class="name">{{item.label}}</div>
        <div class="valueGroup">
		<div class="value">{{item.value}}%</div>
	</div>
	</div>    
    </div>
  </div>