Listener and Refresh problem with Safari and Chrome

[wep4you]

Hello,

first I want to thank you for this really good piece of code. I want to use it in my open hab environment, but there is a problem with my browsers.

On the safari browser the buttons didn't work, i tried the examples with the combo fields. If i press the buttons for Panel and the timeline, nothing happens, no message of the change is sent to Openhab. If i try the same sitemap with Chrome the button press is sent to open hab immediately.

On chrome browser the buttons work, but the chart didn't reload, this works on safari, so if i push the button on chrome, the change works on the safari browser, if i have the same site open in both browsers.

[wborn]

Hi, I just tested the library with Safari 10.0.2 (12602.3.12.0.1) on macOS Sierra (10.12.2) and things worked without any issues for me. I also use the latest version of Chrome myself without any issues.

The following information would help with troubleshooting this issue:

1. Your openHAB version and build number
2. The UI you are using. I've tested with Basic UI. When you are using another UI (e.g. Classic UI) you'll need to provide the w and sitemap parameters either in the Webview URL or the Javascript code
3. Your exact browser / OS version
4. Any warnings/errors that show up in your browser debug console
5. If you are running openHAB and Grafana on the same machine. I.e. there could be Cross-site scripting (XSS) issues which would show up as warnings/errors in the browser debug console

There is also a known ESH issue about newly added items not properly updating. So restarting openHAB is necessary when you have just added the library examples to an already running openHAB instance.

[wep4you]

Thanks for the fast reply, it seems that in safari it was the issue you wrote ESH issue, after restart it worked fine.

In chrome the update didn't work, but after i tested some other items, it seems thats a problem with the basic ui itself, so no issue with your code.

I just have a problem in the open hab iOS App, there i get an basic auth error, but could also be an issue with the iOS App itself.

[wborn]

I just have a problem in the open hab iOS App, there i get an basic auth error, but could also be an issue with the iOS App itself.

Does the webview work in the iOS app when you use a hardcoded Grafana URL and not a page using the library? If that also does not work it will probably be an issue in the app itself. Perhaps you are having the same issue that is reported in: https://github.com/openhab/openhab.ios/issues/84

The Android App also has issues with Webviews. I just use Basic UI on my smartphone because everything I need just works with it.

[MHerbst]

The Android App also has issues with Webviews. I just use Basic UI on my smartphone because everything I need just works with it.

With Chrome 55 the Basic UI does not work too on Android. With the current beta of Chrome (Version 56) it works again. The control used in HABdroid is based on the same browser engine, that is at least one reason why it doesn't work in the app.

[wborn]

I just had another try on getting the library to work with the openHAB Android App and this time I had more luck. I had to do the following to get it working:

• The Webview URL in your sitemap has to be fully qualified, it does not work when the URL starts with /static/, so use something like. :

  Webview url="https://www.yourmachine.com/static/somepage.html?dashboard=climate&fromItem=Climate_Chart_Period&panelItem=Climate_Chart_Data&w=0100&render=true&width=auto&height=auto" height=9

• The Grafana JavaScript seems to be too complex for the current Webview used in the Android App, it logs errors like those reported in https://github.com/grafana/grafana/issues/7129 . That can be fixed by using a rendered graph with using render=true as smarthome-grafana library parameter. So make sure you use the most recent version of the library (which also supports long polling events to be compatible with browsers that don't support SSE).

• The library needs to know which sitemap page to subscribe to events. So add a w=0100 parameter in the URL used in the Webview. The right number can be obtained from the URL of the Basic UI page showing the same Webview. This number may change when you add/remove sitemap pages.

• Make sure your Grafana username / password match those used for accessing openHAB (or allow anonymous access). Monitoring the Grafana logs helps to see if the app is making the right requests and if there are any authorization issues, i.e. sudo tail -F /var/log/grafana/grafana.log

The same approach may also get it to work with the iOS App.

[wborn]

With some code adjustments in the Android App I now even got the the full Grafana Javascript views working. It seems that the default Android WebView is pretty restricted and not HTML5 compliant. This causes issues with AngularJS used by Grafana.

This is the Android code which resolved it form me: http://stackoverflow.com/a/10599794

I'll see if a PR with these gets merged into the Android App. :-)

[wborn]

I've submitted PR https://github.com/openhab/openhab.android/pull/266 for making the Android App WebView compatible with Grafana Javascript panels.

[wborn]

The PR got approved and is part of the openHAB Android App v1.8.0.6 that has been on Google Play for some time now. With the configuration changes mentioned above it loads Grafana Javascript panels just fine.

When there are still issues in the iOS App I think it is best to enter an issue for this in the openHAB iOS App issue tracker. I'm not able to test this on iOS myself.