5.1.0.M3: Main UI shows blank screen on Android

Cause you mentioned that there are still a few UI bugs in 5.1 - > do not know if this is related but this widget of mine does no longer render correctly.

Hello there, I am still facing the blank OpenHAB MainUI page issue from whatever client I do not have still a valid session from before the upgrade from 5.0.3 to 5.1.0.

Every requested page results in a blank canvas, not only the overview (even error pages do not load).

The issue persist after updating the org.openhab.ui bundle to the Jenkins pipeline result `1481` (https://ci.openhab.org/job/openHAB-WebUI/lastSuccessfulBuild/artifact/bundles/org.openhab.ui/target/org.openhab.ui-5.2.0-SNAPSHOT.jar at the time of writing). Perhaps I misunderstood the method for testing the merged commit from yesterday, that should fix the issue with the NavBar?

I am running OpenHAB from the container image `docker.io/openhab/openhab:5.1.0-alpine`, also I have tried with and without enabling simple navbar for both desktop and mobile, but the issue persists; I did try to restart OpenHAB after updating the bundle, and also I tried to clear the /tmp and /cache folders from the container’s data volume, but it seemingly did not change the outcome.

This is what I see from the pages and inside the Home Page settings



I will also add that to exclude other variables I did spin up a fresh install with the same 5.1.0-alpine container but empty volumes, and from there I cannot reproduce the issue. I then proceeded to stop and start the container restoring one volume at a time, and I am served blank pages only if I restore the data volume (/openhab/userdata).

The fix might not be included in the build yet, or not loaded to your client.
Can you please check the Main UI commit on the about page? This one fixes an exact information about the Main UI version loaded in your browser.

Thanks for your reply, florian-h5; honestly I was not expecting other users or maintainers would have time to spend on this forum during the next days. I was planning on creating a new install and move bindings, things and items one at a time to obtain the exact context in which this occurs to me, so I will pause that for a bit and keep the affected setup as is to answer your questions.

To start from where I began, I rolled back my container image and its volumes to what I was using on OpenHAB 5.0.3, then I restarted the container with the newer image OpenHAB 5.1.0. At this time, the commit from the Main UI (I was still logged in from the previous session, opened with version 5.0.3 running) is 69bf7f37.

Then I updated the org.openhab.ui bundle to the JAR hosted at org.openhab.ui-5.2.0-SNAPSHOT.jar, which is still the artifact from the pipeline 1481 I referred to yesterday. Now the commit from Main UI is 25899286.

From what I can grasp from the commit history of the openhab-webui repository, your commit referenced yesterday which fixes the NavBar issue was merged before your other commit related to the swiper width, which appears to have the hash I see reported in the about page from MainUI after the bundle update to the snapshot package.

I will also attach the contents of the empty pages that loads from any other browser/curl/device where I do not have a saved login session:

Overview HTML (renders blank)

<!doctype html>
<html>
  <head>
    <meta http-equiv="Content-Security-Policy" content="default-src &#39;self&#39; &#39;unsafe-inline&#39; &#39;unsafe-eval&#39;; font-src &#39;self&#39; data:; img-src * data:; media-src * data: blob: media:; frame-src *; connect-src &#39;self&#39; *.openhab.org raw.githubusercontent.com api.iconify.design api.unisvg.com api.simplesvg.com *; worker-src &#39;self&#39; blob:;">

    <meta charset="utf-8" />
    <!--
  Cordova recommended default CSP. For more guidance, see:
      https://cordova.apache.org/docs/en/dev/guide/appdev/allowlist/#content-security-policy-csp
  <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *">
  Explanation:
    * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
           Note that UIWebView is deprecated, see https://developer.apple.com/documentation/uikit/uiwebview
    * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
    * Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
        * Enable inline JS: add 'unsafe-inline' to default-src
        * Enable eval(): add 'unsafe-eval' to default-src
  -->
    <!-- Explanation:
    * allow loading resources from the same origin, inline scripts (required for inline event listeners) and styles, and the use of eval() (required by ECharts)
    * allow loading fonts from the same origin, and data: URIs
    * allow loading images from any source, and data: URIs
    * allow loading media from any source, and data:, blob: and media: URIs
    * allow embedding (<iframe>) any source
    * allow connecting (through fetch(), XMLHttpRequest, WebSocket etc.) to the same origin, *.openhab.org, raw.githubusercontent.com (add-on logos etc.), Iconify icon sources, and any source
    * allows loading web workers from the same origin, and blob: URIs
  -->
  <!-- meta tag is inserted in the build process
  <meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline' 'unsafe-eval'; font-src 'self' data:; img-src * data:; media-src * data: blob: media:; frame-src *; connect-src 'self' *.openhab.org raw.githubusercontent.com api.iconify.design api.unisvg.com api.simplesvg.com *; worker-src 'self' blob:;">
  -->
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui, viewport-fit=cover"
    />

    <meta name="theme-color" content="#e64a19" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
    <title>openHAB</title>
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <link
      rel="apple-touch-icon"
      href="/res/icons/apple-touch-icon.png"
      type="image/png"
      sizes="180x180"
      crossorigin="use-credentials"
    />
    <link
      rel="icon"
      href="/res/icons/favicon.svg"
      type="image/svg+xml"
      sizes="any"
      crossorigin="use-credentials"
    />
    <link
      rel="icon"
      href="/res/icons/128x128.png"
      type="image/png"
      sizes="128x128"
      crossorigin="use-credentials"
    />
    <link rel="manifest" href="/assets/manifest-CKPzpPDv.json" crossorigin="use-credentials" />
    <script type="module" crossorigin src="/assets/index-BRrwo2Uh.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-D8bRwd_x.css">
  <link rel="manifest" href="/manifest.webmanifest"><script id="vite-plugin-pwa:register-sw" src="/registerSW.js"></script></head>
  <body>
    <div id="app"></div>
  </body>
</html>

Finally I will provide the network transactions between a Chromium browser from a guest profile (all settings to defaults, no extensions) and the OpenHAB service, when loading the overview:

Network traffic

I will also provide the logs collected with the org.openhab.ui level at TRACE, in both of the two cases:

Load MainUI from browser with saved login
19:23:50.095 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /overview/                                                                                                                                                                                                                                         
19:23:50.096 [DEBUG] [penhab.ui.internal.UIErrorPageServlet] - Returning index file as response with status 200 for request URI: /overview/                                                                                                                                                                                    
19:23:50.234 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/index-BRrwo2Uh.js                                                                                                                                                                                                                          
19:23:50.235 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/index-BRrwo2Uh.js                                                                 
19:23:50.239 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/index-D8bRwd_x.css                                                                                                                                                                                                                         
19:23:50.240 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /registerSW.js                                                                                                                                                                                                                                     
19:23:50.240 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/index-D8bRwd_x.css                                                                
19:23:50.241 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/registerSW.js                                                                                                                                                                          
19:23:51.058 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-BBLbxkea.js                                                                                                                                                                                                                             
19:23:51.058 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-B5blrAjX.js                                                                                                                                                                                                                             
19:23:51.058 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-BBLbxkea.js                                                                                                                                                                  
19:23:51.058 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-B5blrAjX.js                                                                                                                                                                  
19:23:51.063 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-nf_BlBCO.js                                                                                                                                                                                                                             
19:23:51.064 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-nf_BlBCO.js                                                                                                                                                                  
19:23:51.197 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /res/icons/favicon.svg                                                                                                                                                                                                                             
19:23:51.198 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /res/icons/apple-touch-icon.png                                                                                                                                                                                                                    
19:23:51.199 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/res/icons/favicon.svg                                                                                                                                                                  
19:23:51.199 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/res/icons/apple-touch-icon.png                                                  
19:23:51.284 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /images/openhab-logo.svg                                                                                                                                                                                                                           
19:23:51.285 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/images/openhab-logo.svg                                                                  
19:23:51.365 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/it-BEezSypD.js                                                                                                                                                                                                                             
19:23:51.366 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/it-BEezSypD.js                                                                                                                                                                  
19:23:51.373 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/esm-CQiG7ic0.js                                                                                                                                                                                                                            
19:23:51.373 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/esm-CQiG7ic0.js                                                                                                                                                                 
19:23:51.375 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-CRytLxEb.js                                                                                                                                                                                                                             
19:23:51.376 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-CRytLxEb.js                                                                                                                                                                  
19:23:51.389 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/it-Dx7lbnww.js                                                             
19:23:51.389 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/it-Dx4e6d0Q.js                                                             
19:23:51.389 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/it-Dx7lbnww.js  
19:23:51.390 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/it-Dx4e6d0Q.js  
19:23:51.473 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /fonts/Framework7Icons-Regular.woff2                                                                                                                                                                                                               
19:23:51.474 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/fonts/Framework7Icons-Regular.woff2                                                                                                                                                                                                                                                                                                                                                                          
... <redacted>
Load MainUI from browser **without** saved login
19:26:17.222 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /                                                                                                                                                                                                                                                  
19:26:17.223 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/                                                                                                                                                                                       
19:26:17.223 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getWelcomeFile /                                                                                                                                                                                                                                                
19:26:17.224 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /index.html                                                                                                                                                                                                                                        
19:26:17.225 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/index.html                                                                                                                                                                             
19:26:17.269 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/index-D8bRwd_x.css                                                                                                                                                                                                                         
19:26:17.270 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/index-D8bRwd_x.css                                                                                                                                                              
19:26:17.272 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/index-BRrwo2Uh.js                                                                                                                                                                                                                          
19:26:17.273 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /registerSW.js                                                                                                                                                                                                                                     
19:26:17.273 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/index-BRrwo2Uh.js                                                                                                                                                               
19:26:17.273 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/registerSW.js                                                                                                                                                                          
19:26:17.854 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-B5blrAjX.js                                                                                                                                                                                                                             
19:26:17.854 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-BBLbxkea.js                                                                                                                                                                                                                             
19:26:17.855 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-B5blrAjX.js                                                                                                                                                                  
19:26:17.856 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-BBLbxkea.js                                                                                                                                                                  
19:26:17.860 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-nf_BlBCO.js                                                                                                                                                                                                                             
19:26:17.861 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-nf_BlBCO.js                                                                                                                                                                  
19:26:17.924 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /sw.js                                                                                                                                                                                                                                             
19:26:17.925 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/sw.js                                                                                                                                                                                  
19:26:17.933 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /res/icons/favicon.svg                                                                                                                                                                                                                             
19:26:17.933 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/res/icons/favicon.svg                                                                                                                                                                  
19:26:17.956 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/esm-CQiG7ic0.js                                                                                                                                                                                                                            
19:26:17.956 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/it-BEezSypD.js                                                                                                                                                                                                                             
19:26:17.957 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/esm-CQiG7ic0.js                                                                                                                                                                 
19:26:17.957 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/it-BEezSypD.js                                                                                                                                                                  
19:26:17.957 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/en-CRytLxEb.js                                                                                                                                                                                                                             
19:26:17.958 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/en-CRytLxEb.js                                                                                                                                                                  
19:26:17.973 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/it-Dx4e6d0Q.js                                                                                                                                                                                                                             
19:26:17.974 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/it-Dx4e6d0Q.js                                                                                                                                                                  
19:26:17.974 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /workbox-8c29f6e4.js                                                                                                                                                                                                                               
19:26:17.974 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/it-Dx7lbnww.js                                                                                                                                                                                                                             
19:26:17.975 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/workbox-8c29f6e4.js                                                                                                                                                                    
19:26:17.975 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/it-Dx7lbnww.js                                                                                                                                                                  
19:26:18.046 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/zwave-network-CVlYtb2w.js                                                                                                                                                                                                                  
19:26:18.046 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/zwave-network-CVlYtb2w.js                                                                                                                                                       
19:26:18.075 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/zwave-network-BJMB-v6_.css                                                                                                                                                                                                                 
19:26:18.075 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/zwave-network-BJMB-v6_.css                                                                                                                                                      
19:26:18.088 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/zh-tw-D9o0foLq.js                                                                                                                                                                                                                          
19:26:18.089 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/zh-tw-D9o0foLq.js                                                                                                                                                               
19:26:18.104 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/zh-p8ntqs0k.js                                                                                                                                                                                                                             
19:26:18.105 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource bundle file returning bundleresource://228.fwk2053425932/app/assets/zh-p8ntqs0k.js                                                                                                                                                                  
19:26:18.125 [DEBUG] [org.openhab.ui.internal.UIServlet    ] - getResource: /assets/zh-hk-Bpi97Yp2.js
... <redacted>

This version should not have show a blank overview screen anymore.
I was able to reproduce the issue with MD and Aurora theme before fixing this, since then I cannot reproduce it anymore with the current CI build.
However, I have to reload app & clear cache on the about page of Main UI to properly load the updated UI.

Thanks for providing the data but that’s not really helpful in this case, especially the HTML is useless for web apps, it will always look the same for all Main UI pages. What you see is rendered through the JS code that is loaded from the server.

I am thinking more and more my issue is different, since I cannot access any page via any URL when I start my session from a client that has no saved cookie. Your example makes me feel that the about page should remain accessible after I update the OpenHAB version, to allow for “reloading the app”. I cannot do that if I update to 5.1.0 from a new client, since only access to the sitemaps is working for clients without a saved login session. I am doing my experiments using a guest profile in Chromium, which does not keep any site data, cookies or cache when closed, which I think is the same starting point of my mobile phone and on ther computers that did not have a saved active login to the OpenHAB server.

Your insight on the JavaScript is very helpful and I will collect more information regarding that from the browser developer tools.

This first network transaction is from the browser profile with the saved login session: even if I get a 401 error on the sitemaps endpoint, all the MainUI section and sitemaps loads correctly in this case

MainUI overview on saved login

MainUI overview on fresh session

Apparently the exact same JavaScript files are downloaded in the browser, but the messages in the console on a fresh session indicate a 401 error on the /rest/tags endpoint, which I do not get when loading up MainUI with a saved login session.

As I wrote before, I can access fine /basicui/app even from an incognito window on the same network as where the OpenHAB server is exposed

If this is actually a different issue perhaps I should carry on in another specific thread?

The 401 error when accessing a sitemap is “fine” as this is Main UI determining whether authentication token is required.
I can reproduce your issue when disabling implicit user role in API security settings. This is a different issue, but now that I can reproduce it is easy to fix (the fix took me 10 minutes):

1 Like

I can confirm that by enabling “Implicit User Role” from “Settings” > “API Security” allows to render again the overview page from the other devices without a saved login session.

I have to also thank you for taking the time to write a fix and submit it, even if it was 10 minutes it was still your time; not accounting for the time spent reading this thread. For me, enabling again the implicit user role is not a big deal, and also I cannot recall why I had that disabled.

You’re welcome! You are right, figuring out what was the issue by reading this thread took longer than implementing the fix, but that’s often how it is.
Implicit user role disabled is something that isn’t really common and I think therefore wasn’t tested previously, so “thanks” for finding this bug.

1 Like

I can also confirm that Florian’s commit fixes the issue when implicit user role is disabled: I am testing with the UI bundle updated to snapshot, which shows on the Help & About page the commit hash 7896dc4, which is subsequent to the commit for the fix (e0f81df).

Thanks again for looking into this!

1 Like