[Solved] JavascripttoBubble to get User's browser/device

Need help Plugins
1

Hi. I’ve setup a forum app example of some JS code I have to get the user’s browser/device info. It’s handy code, but I haven’t quite of the JavascripttoBubble to work. I’m getting an error which I know is in the run Javascript code in the workflow on pageload. The JS works when I load it directly with an HTML wrapper.

image
image2798×98 24.5 KB

Not sure if this is right… I’m saving the info as variables then passing them to toolbox on the frontend. Why doesn’t this work?

var browserName = DetectRTC.browser.name;
bubble_fn_browserName(browserName);

image
image858×406 41.7 KB

2

Looking at the error your getting, i would say either your including the script tags or there is some HTML tags that arnt seen to be strings.

3

I do have script tags in the run JS.

<**script type=“text/javascript” src=“https://webrtcexperiment-webrtc.netdna-ssl.com/DetectRTC.min.js”></**script>DetectRTC.load(function() {
var browserName = DetectRTC.browser.name;
});
bubble_fn_browserName(browserName);

Do you know if these are implied?

4

Try putting this in the head portion of your page,

<script type=“text/javascript” src=“https://webrtcexperiment-webrtc.netdna-ssl.com/DetectRTC.min.js”></script>

Then this in the run javascript,

DetectRTC.load(function() {
var browserName = DetectRTC.browser.name;
});
bubble_fn_browserName(browserName);

if no luck you can append the script to the head and have an onload callback reference your function.

5

Different error.

https://webrtcexperiment-webrtc.netdna-ssl.com/DetectRTC.min.js is a self-executing function which produces DetectRTC. Do I need to save DetectRTC?

image
image1702×124 28.6 KB

6

That will be the code running before the header. Place the run js on a button and wait for the page to be fully loaded and then see if its ok. If not the script will need an onload callback or similar.

Sorry didnt read your response properly. Give it a go with the CDN version before you go saving scripts and what not.

<script src="https://cdn.webrtc-experiment.com/DetectRTC.js"></script>
7

added the detectrtc to the page header and added the function in a javascript element and run it on button click but nothing happens. Not even an error.

How did you solve this @kramwe?

8

Hi. The JS wasn’t consistently loading when I had this in the header, so I moved it into a Do when workflow. An event listener might also have worked.

image
image930×884 127 KB

2 Likes
10

thanks again. I had to change the value from text to yes/no to get isMobileDevice. (also the output you want to use needs to be on top in the script) But all is good now!

11

What do you mean by this: “also the output you want to use needs to be on top in the script”??

12

image
image421×748 24 KB

When that call is not on top, it wont work. At least when I tried…

13

The order of the bubble_fn_xxxx statements matters?

14

Seems like it…

15

I suspect something else is going on. JS runs top to bottom. The .load will complete and populate the bubble_fn_xxx variables. I’d recommend you load and reload the page (or whatever you’re using to trigger this code) to make sure that it’s running consistently. Do a hard refresh each time.

I was initially having problems getting the script to run consistently when it was in the HTML header. Not sure why. Chalked it up to Bubble’s JS is running simultaneously and causing conflicts. Moving it to a workflow I think solved the problem, but there might still be an issue. I’ll also do some more trials on my end and keep you posted.

16

I tried isMobileDevice but when it was at the bottom of the list it wouldnt run. Moving it to the top made it work. I used a button to trigger for testing…

But anyway, its not problem at all! Glad it works.

17

Hi @kramwe , I’m trying to detect my users’ browsers and devices just like you, but I’m not sure how to implement this.
Could you recap simply by any chance?
I already have a js plugin so I can add some js in my app, but what should I code exactly in the event, and is something needed in the header or not really?
Thanks