Classic UI: Problem with Icons

Add-ons UIs
1

For a simple dashboard several sitemaps are included into a single HTML website.
The given code is stripped down to give a simple example that still shows the issue.

HTML-code:

<!DOCTYPE html>
 <html lang="en">
    <head>
        <title>Test</title>
    </head>
    <body>
        <header>
        </header>
    <table border="1">
        <tr>
            <td><iframe width="200" height="400" src="http://localhost:8080/basicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/basicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/basicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/basicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/basicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/basicui/app?sitemap=test"></iframe></td>
        </tr>
        <tr>
            <td><iframe width="200" height="400" src="http://localhost:8080/classicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/classicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/classicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/classicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/classicui/app?sitemap=test"></iframe></td>
            <td><iframe width="200" height="400" src="http://localhost:8080/classicui/app?sitemap=test"></iframe></td>
        </tr>
    </table> 
    </body>
</html>

The sitemap looks like this:

sitemap test label="Test" {

    Frame {
        Text item= test1
        Text item= test2
        Text item= test3
        Text item= test4
        Text item= test5
   }
}

The items all are similar to this:

Number    testX    "Test X [%d]"    <temperature>    (gTest) {someBinding}

The value of the items are assigned in a rule or by a binding.

Problem:
When loading the above website all items are shown with the icon, text, and value.
When an item is updated the icon disappears and only text and value remain.
When the item is updated again the icon may reappear.

What I’ve found out so far:

  • The console doesn’t flag any errors or warnings.
  • There’s no difference if the icons are defined with the items or in the sitemap.
  • Putting everything into a single sitemap works fine (no HTML table but just a single iframe with the sitemap).
  • Reducing the number of sitemaps:
    When an item is updated its value changes instantly. At the same time the icon of the item disappears. After 1-2 seconds the icon reappears again.
    This seems to be slow motion of the described issue.
  • System resources don’t seem to be a problem: openHAB is running on a desktop PC with a CPU usage of <20% and ~ 6GB unused memory.
  • This has been checked with several browsers / HTML-renderers which all behave the same:
    Firefox (Gecko), Chrome (Blink), Vivaldi (Blink), Midori (WebKit).
  • openHAB basic UI works fine in this respect but takes up too much screen space for my application and has other issues, too.

Now I hope someone could give me an idea on how to prevent this problem.