Why the NodeRed dashboard slider doesn't work on my iPhone browser

Dashboard
1

My environment setup a NodeRed by docker image on a Linux VM.
NodeRed: 0.19.0
Dashboard: 2.26.0
VM network: bridge adaptor

I expect the slide bar can be drag by my finger just like using a mouse. Is that make sense?

It is quite simple, but I still post my flow here.

[{"id":"f2aeb8b7.3ee49","type":"tab","label":"Test","disabled":false,"info":""},{"id":"bf7583e.2b0db","type":"ui_slider","z":"f2aeb8b7.3ee49","name":"Test","label":"slider","tooltip":"","group":"da5ddd6a.0fd28","order":1,"width":0,"height":0,"passthru":true,"outs":"all","topic":"LL","min":0,"max":"100","step":1,"x":550,"y":260,"wires":[["c7e2a5e4.528598"]]},{"id":"c7e2a5e4.528598","type":"debug","z":"f2aeb8b7.3ee49","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","x":730,"y":260,"wires":[]},{"id":"da5ddd6a.0fd28","type":"ui_group","z":"","name":"Test","tab":"b11cb0b4.df1768","order":1,"disp":true,"width":"6","collapse":false},{"id":"b11cb0b4.df1768","type":"ui_tab","z":"","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]
2

Works fine for me (NR running on MacOS). You are running an old release of NR. The current release is v1.2.6 so you might want to upgrade (do qa backup first.

3

Hi @zenofmud
I have tried node-red v1.2.6 and the result is the same. I find the different result when I use different smart phone. Here is the video to show the different.

  1. iPhone 7+: the slide bar stuck at zero and the slider return null on debug window. https://drive.google.com/file/d/1SodnOLm3HWdEZCRGLNJTZsCTHIPDTe3d/view?usp=sharing
  2. Samsung Galarxy Tablet J: the slider works as expected. https://drive.google.com/file/d/17BjD0UDD0Zjo7A_82DJn97pV2sgLm4lD/view?usp=sharing

** both test are running on Chrome browser

  1. Chrome on iPhone: v87.0.4280.77
  2. Chrome on Samsung: v87.0.4280.101

I don't have other smart phone for test at the moment.
Do you know why this happen?

4

What version of iOS are you running?

I have iOS 14.2 on my iPhone SE, and the slider works fine using both Safari and Chrome.

In your video, I see the iPhone it does work - msgs are returned - it's just the slider doesn't stay put. Is that the issue?

5

I have tried Safari, Chrome, Firefox on my iPhone7+, but they all failure and the return value is null. I just test another Samsung Note8 with Chrome and it work perfect. Currently,

  • iPhone7+ w/ Safari, Chrome, Firefox --> failure
  • Samsung Note8 w/ Chrome --> Success
  • Samsung Tab J w/ Chrome --> Success

Will try another iPhone later.

6

Works fine for me on my iPhone SE using iOS 14.2

Do you have tthe same issue using Safari on a computer? This was an issue (see HINT (dashboard) - How to use the slider without the second click (in Safari)) back in 2018 but it has been fixed now.

What version of node.js are you running? You can get this from the Node-RED startup log

7

My node.js version is 8.16.2
I just test another iPhone 8 w/ iOS 14.0.2 and it works fine. My iPhone7+ is iOS 12.3.1
Not quite sure it related to iOS version. Update current test

  • iPhone7+ w/ iOS 12.3.1 on Safari, Chrome, Firefox --> failure
  • iPhone8 w/ iOS 14.0.2 on Chrome --> Success
  • Samsung Note8 on Chrome --> Success
  • Samsung Tab J on Chrome --> Success
8

Since it works with iOS 14 and doesn't with iOS 12 and NR hasn't changed, that points to an iOS bug that was fixed by Apple at some point in time.

If possible I would update the iPhone 7+

9

Definitely iOS version issue. APPLE forces all browsers to use webkit (thats why if fails on all browsers)

10

Old webkit version is likely more accurate.

2 Likes
11

Thank you all. I think it is clear for me. Cheers, happy new year.

12

Final update. After upgrading my iPhone7+ to iOS 14.3, all the problems solved. Thank you all and FYR.

(new) iPhone7+ w/ iOS 14.3 on Safari --> Success

  • iPhone7+ w/ iOS 12.3.1 on Safari, Chrome, Firefox --> failure
  • iPhone8 w/ iOS 14.0.2 on Chrome --> Success
  • Samsung Note8 on Chrome --> Success
  • Samsung Tab J on Chrome --> Success
13

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.