[Solved] Testing a Bubble native app with Phonegap

Hi guys,

I’ve just been sent the zip file of my native app for Bubble. I followed all the instructions, built the ipa on Phonegap, submitted to iTunes connect, all accepted and ok, tried it in Testflight - hangs on the splash screen.

I feel like it’d be easier to troubleshoot if I could use the Phonegap desktop app and its Developer app on the iPhone, but I’m a bit lost in terms of building a project there. Can anyone offer a guide? Or even better, has anyone had the same splash screen issue?

Thanks, Richard.

Have you uploaded a development key to Phonegap and tested locally on your device? If so, did it work when you did?
Did you make any changes to the config.xml or index.html files before you packaged the file?

I’ve just tried testing the Phonebuild ipa locally on my device with xcode using a dev certificate. Installed and ok, but still hangs eternally on the splash screen (currently the Bubble logo splash screen).

I edited the app name and app identifier to match in the config file, that’s all. I didn’t edit the index file, is there something that needs changing there too?

Hmm… Usually the only thing I change on the index file is the viewport dimensions, so I doubt anything is wrong with that.

Just going to run through some troubleshooting questions to double check a few things:

  1. Is this a new app? If so, have you deployed a live version of it yet?
  2. Do you have any workflows that take place as soon as the page loads?
  3. Does the device have a solid internet connection?

Thanks Nate I really appreciate it.

  1. Yes it’s a new app, my first one. Live version is deployed, you can find it here:

http://www.activateenglish.com

  1. Yes, everything is hidden. The login box shows when the user is logged out, the main menu shows if the user is logged in.

  2. Yes, on wifi and tested with browser and other apps.

Hmm I want to try something out. Just sent you a DM.

So I’m looking at the index.html. I’m not a programmer, so I’m probably just poking with things that I don’t understand, but there’s this line:

window.web_url_equivalent_for_phonegap = "https://activateenglish.bubbleapps.io/index"
When I try to access the link they’re pointing to, I get this message:

“Oops! You’ve pointed activateenglish.bubbleapps.io to Bubble, but we don’t have an application associated with this domain yet!”

I wonder if that’s something to do with it? @emmanuel

Yes you should change the

window.web_url_equivalent_for_phonegap = “https://activateenglish.bubbleapps.io/index

to the URL that works, like http://activateenglish.com/

I’ve made some progress, already tried what you said Emmanuel. Now the app on the iPhone shows a splash screen for about a minute, then shows a blank white screen. I can see a scroll bar at the bottom if I touch and drag (though it doesn’t scroll), but no elements at all. This app works on mobile browsers and in the Bubble test app, not sure what I’m doing wrong :frowning:

I even made one element visible on page load (the top and bottom green banners) to make sure it’s not a hidden elements problem.

Discovered the source of the problem: The zip file of the app I’d been sent was set up with a mistake in the app name. I’ve copied and renamed my app on the Bubble system to reflect the name in the zip file I was sent and now it’s working!

1 Like

Perfect! Had a feeling It was something like that. Glad it worked out. :grin:

Did you by any chance use code free startup?

Hey Richard,

Do you mind posting a screenshot of the line you changed and on what file in the zipped file?

Thank you in advance!

I don’t have a domain for my native app. So what should I change:

window.web_url_equivalent_for_phonegap = "https://ptn.bubbleapps.io/index"

to?

You shouldn’t have to change it. My problem was I had set up my own domain name, and there was a typo in the URL of the app file I was sent by Bubble. I’ve just copied and pasted the URL from your posted code and it works, so your app should also work. Are you having problems?

Hey Andy, sorry I never replied to you before, I’m sure you’ve already solved the problem. It was the index.html file in the zip file.

I changed the line:

window.web_url_equivalent_for_phonegap =

It had the bubbleapp URL, I had to change it to the URL of my custom domain, followed by the page that’s your native app, for me for example it was the index page, so:

window.web_url_equivalent_for_phonegap = "http://www.activateenglish.com/index"

Oh yes, i have a problem. :blush:

I use Phone Gap on my Mac and view the app in PhoneGap Develop on my iPhone. The app starts fine. I know this since I have put in some text lines in index.html. But, my Bubble app is not started. Nothing happens after the index.html shows my text lines.

I have tried make the index myself based on the PhoneGap template (Hello World). I also had to move stuff into a folder “www” since it was not there in the zip file sent from Bubble.

So, it feels I’m very stuck on the finishing line, having bought the Apple Developer account and all(!)

To be honest I could never get the PhoneGap desktop app to work. Try this site:

https://build.phonegap.com

It takes the zip file sent by Bubble without any modifications and outputs files for iOS, Android and Windows phone. You need a developer key, but if you’ve already signed up as an Apple developer it shouldn’t be too hard to find it. Test the iOS file Phonegap outputs in Xcode and see if that works. Let me know if you need help with that.

Thanks for not giving up on me! :slight_smile:

I’ve tried to use PhoneGap Build before, without luck. Tried again now and also tried PhoneGap desktop app.

My steps:
I * created my own config.xml and index.html based on the PhoneGap desktop app Hello World project, and pasted in the the code in index.html from the zip file from Bubble.

  • I added som text in the index.html body to see if the page even is loaded.
  • I created a folder named www to put everything in (but the config.xml) as the PhoneGap Hello World app has it.

I get:
Both the PhoneGap desktop app and the downloaded app from the PhoneGap Build gives the same result - the index.html i shown, but my Bubble app is not loaded:

Link to my app:

config.xml:



index.html