I am so depressed. I have invested hours learning Bubble, but now it feels like a complete waste of time and money!
Why? I have built a website. Looks great on Bubble and works as intended. But in the real world? No. I tried Developer Tools and it does not display on various devices as it should, even with a Chrome browser. So there is a a conflict between how the website looks using Developer Tools and using the Responsive tab on Bubble.
To add insult to injury, even Developer Tools does not accurately emulate each device either! How on earth can this be described as a ātoolā if it does not do what it is supposed to do? I have no idea how I am going to resolve this problem.
Bubble sounds great in theory. But if the website does not render exactly as shown on various devices and using different browsers, whats the point???
Based on this comment, I am going to assume you have built your site to be responsive, and were using the bubble responsive editor to test the responsiveness. Now, when testing you are using chrome developer tools responsive testing tool, but the way the site looks on chrome developer tools responsive testing is not the same as it looked in Bubble responsive editor.
If that is what you are saying, you are absolutely correct. I personally do not use the bubble responsive editor to test my responsiveness and I donāt use chrome responsive testing tool either. Bubble responsive editor when I last used it was pretty horrible, and I donāt bother to do check-ins to see if they ever improved it. Chrome for whatever reason doesnāt play nice with Bubble when I test in Google Chrome and things look different at times.
I use Mozilla Firefox for testing responsiveness. Not just because of the above statements about Bubble and Chrome, but also because I can test with height (hugely important and a shame bubble responsive editor doesnāt provide) and I hate seeing so much of the developer tools in chrome when all I want is responsive testing.
Firefox has responsive testing as standalone so no clutter.
Also, makes it easier for me to not have to remember about debug_mode affecting my responsiveness as Iām not logged into bubble on firefox, so no debug_mode possible.
If you want real robust testing, there are tools that emulate the different devices, even their OS systems.
One Iāve used as free trial of sorts and then start paying. Iāve personally never actually needed something as robust as my responsiveness works fine and I donāt believe the OS makes much difference as I believe Bubble handles all of that for us.
If you have not built your site responsively, then a good place to start is with Bubble tutorials as I think they are interactive.
Thanks George, however, the site has indeed been built to be responsive.
The issues are complex. I appreciate that, strictly speaking, Developer Tools is nothing to do with Bubble.
But the Responsive functionality on Bubble does not accurately reflect real-world testing of how my website renders on numerous devices, so reverting to Developer Tools (as recommended in Bubble tutorials) was a fall-back strategy.
Thank you for your comprehensive response Boston - really appreciate it. I confirm that I have built the website responsively.
The lack of cross compatibility with devices and browsers really surprises me - I am new to the computer world but not stupid - it seems to be a complete mess although I suppose I should be more forgiving as it is probably extremely complicated and there will be a legacy issues too.
But it sounds like you grasp what I am talking about and recognise that the rendering on Bubble and Developer Tools is not perfect and cannot be 100% trusted to do so accurately across numerous devices and/or website browsers. I feel sorry for people who simply put their faith in it and donāt do their own tests to see if their website is behaving as it should!
I appreciate your advice with trying alternative responsive testing tools. I might do this. However, it seems to me that the only fool-proof way (and to have complete confidence) is to actually test the website in different browsers on real devices and tackle problems as they arise.
Obviously, amending the build to solve a problem on one browser or device might create an issue for the rendering on another.
I presume it is possible to code so that the browser detects the device and browser combo of the user (where it is known that there is an issue) and to behave differently? If so, that would solve the issue - but then Bubble is supposed to be a no-code website builder!
Can you screenshot what exact issues youāre seeing (comparing the responsive editor, which Iāve never had an issue with, to what you see on the screen for a given width)?
What Iāve noticed about the Chrome developer tools when viewing bubble sitesā¦
they work great, but, thereās a bug that you can fix (at least I do).
When you first try to view a bubble site it will not render correctly.
In my views I have just about all of the devicesā¦
Iāve found if I click to view on the iPad, and then click back to other devices it works great.
Yeah, sounds odd but it works. Iāve never taken the time to understand the rationale behind it.
I always use the Galaxy S9 view first because itās 320 wideā¦but 99% of the time it doesnāt look right. I click on the iPad and then back to the Galaxy S9 and it is perfect.
Occasionally, Iāll have to click on a couple of other views to get everything working right.
Also, if you want to view all your sites at once on a lot of devices I use the Chrome extension āresponsive viewerā. It has a free addition and has a lot of options that help.
Other options listed are probably just as good but I havenāt tried all of those.
