Auto-refresh charts and widgets in MainUI

sidamos · June 22, 2022, 5:49am

Created an issue about the key property in the custom widget disabling the inline stylesheet of the widget code on the page:

github.com/openhab/openhab-webui

Using property "key" in custom widget code disables stylesheet on the widget page code

opened 05:48AM - 22 Jun 22 UTC

sidamos

bug main ui

## The problem When I use the property "key" in custom widget code (to force re…fresh of trend lines like described here: https://community.openhab.org/t/auto-refresh-charts-and-widgets-in-mainui/132504), then the inline stylesheet of the widget code on the page does not work anymore. ## Expected behavior Using property "key" in custom widget code should not break stylesheets. ## Steps to reproduce Create a custom widget (property "key" is currently renamed): ``` uid: KeyTestWidget tags: [] props: timestamp: Jun 22, 2022, 7:28:26 AM component: f7-card config: keyX: =Math.random() title: Title slots: content: - component: oh-label-card config: label: Label ``` Create a new grid page and add the widget to the page with this yaml: ``` component: widget:KeyTestWidget config: title: Test stylesheet: | .card-header { color: red; } ``` Run the page. You can see that the title is red. Now edit the custom widget code and change "keyX" to "key" and save the widget. Reload the test page and run it again. The title is now white, so the stylesheet does not work anymore. ## Your environment ```yaml runtimeInfo: version: 3.2.0 buildString: Release Build locale: de-DE systemInfo: configFolder: /home/mythtv/openHAB/conf userdataFolder: /home/mythtv/openHAB/userdata logFolder: /home/mythtv/openHAB/userdata/logs javaVersion: 11.0.15 javaVendor: Eclipse Adoptium javaVendorVersion: Temurin-11.0.15+10 osName: Linux osVersion: 5.10.61-gentoo-x86_64 osArchitecture: amd64 availableProcessors: 4 freeMemory: 113013016 totalMemory: 487587840 bindings: - avmfritz - chromecast - denonmarantz - enigma2 - exec - homeconnect - homematic - http - ipcamera - lgwebos - mail - network - networkupstools - openweathermap - pushover - tr064 - unifi - unifiprotect clientInfo: device: ios: false android: false androidChrome: false desktop: true iphone: false ipod: false ipad: false edge: false ie: false firefox: false macos: false windows: false cordova: false phonegap: false electron: false nwjs: false webView: false webview: false standalone: false pixelRatio: 1.125 prefersColorScheme: light isSecureContext: false locationbarVisible: true menubarVisible: true navigator: cookieEnabled: true deviceMemory: N/A hardwareConcurrency: 4 language: de-DE languages: - de-DE - de - en-US - en onLine: true platform: Linux x86_64 screen: width: 2275 height: 1280 colorDepth: 24 support: touch: false pointerEvents: true observer: true passiveListener: true gestures: false intersectionObserver: true themeOptions: dark: dark filled: true pageTransitionAnimation: default bars: light homeNavbar: default homeBackground: default expandableCardAnimation: default userAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36 timestamp: 2022-06-22T05:11:24.858Z ```