Page doesn't load correctly in Safari

Worked for me as well.

Created new container group and copied the content and voila, all displayed correctly, no unresponsive inputs.

Thanks @pnodseth!

Looks like I was to quick to celebrate.
If the group within a group has more groups\repeating groups, then it still behaves funny, even though recreated.

It does work for simple groups though.

1 Like

Filled a bug report for this one.

Good!
I’m seeing some other issues as well in Safari, where text is scrambled together. Have you experienced that as well?

Not exactly so, but more like elements suddenly aligning funny for no reason, yes.
I had few buttons disappearing and input elements being far more to the side than they were supposed to.

Maybe it is of a similar nature.

I’m having the same problem. When my page loads in Safari the first time, it’s all skewed and missing content. If I click a new page state then click back again it corrects itself.

Bloody annoying and recreating from a blank page doesn’t work on my end. Will probably need to redesign.

1 Like

Have any of you submitted this as a bug?

I’ve had that alot as well.

I did.

1 Like

Hi All!

Emmanuel suggested a solution that worked for me for the rest of the cases.
Previously, all these pages had the structure that all the groups that are accessible in the subsequent steps of the flow (i.e. not the first group visible upon load), had their “Element visible upon page load” ticket to No.

So if you change the app logic for all these groups to be visible upon page load, but then define a condition for them to become invisible unless some specific criteria is met (in my case, I have a State defined on the Page level, that is changed when I navigate the menu groups), they are loaded correctly.

Please check it out and let us know if it works for you.

@pnodseth, @gregoryjohn, @JohnM

2 Likes

Thanks for sharing. I went through my app and reversed all of the show/hide logic on the groups. Reports from the field are that it fixed the loading/alignment problem (or at least greatly reduced it).

1 Like

Yes, this is very frustrating for developers who are invested in browser compatibility across the Safari browser for the millions of people using iPhones and iPads. The issue can suddenly pop up unexpectedly when everything had worked fine before.

For anyone else coming across this thread and needing a quick solution - in my case, all I had to do was:

  1. Change the Y position of a single element in the misbehaving group and keep within the group eg. I changed my page title from 40 to 530, pretty much below everything else but still within the group. Then hide it, eg. change to a single letter 6px transparent and hide on page load (just to be absolutely sure!) Then I renamed it ‘Stupid thing to keep for Safari’ :slight_smile:
  2. Create a new element eg. in my case a new page title

= Page loads just fine now on all iOS devices.

1 Like

I’m also facing these visibility problems, but in my case the reverse condition solution doesn’t help either.

However, I noticed that with the original condition (unhide when condition is met), the group doesn’t load (as expected) but when I then change the size of the browser window, the elements pop up and stay visible.

Anyone else seeing this? If it is consistent behaviour, how to solve this?

Hi Vince.

The above is the only solution that is working that we found so far.

groups to be visible upon page load, but then define a condition for them to become invisible unless some specific criteria is met

Based on what you just wrote - I guess you may be not doing that right.

(unhide when condition is met)

The setup should be - all groups should be VISIBLE upon page load.
Then each of them should have a condition to be invisible unless a certain criteria is met.

Then this works :slight_smile: try it out and let us know.

By the way, from what we see - mostly the groups that have a Repeating Group in them are affected by that issue.
Simple groups with static content usually are rendered alright even if the above approach is not implemented.

 

Vlad Larin
GM@Bubblewits - #1 No-code Developer & Bubble Certified Partner
  Bubblewits.com - Get in Touch!
  Zeroqode.com - Buy Great Bubble Templates
  Builtwithoutcode.com - Bubble Apps collection

Hi Vlad, thanks!

But that was the reason I replied to this topic, the ‘reverse’ condition wasn’t working for me. I’ll do some additional tests with a simpler group setup and see if that works.

Sure!
I’ll also check out if there is anything else we are doing to make it work, but I’m pretty sure we’re not.

I really did not grasp the full scope of this problem until today. It seems more elements are not showing up in safari because of these hide to unhide conditions.

For most I’ve managed to flip the condition around, but this really is not very ‘safe’. However, I need to do this because there are a lot of people using safari and today I figured out a user couldnt complete an action because of this issue.

I will have to make a change to a lot of elements to accommodate for the Safari problem. I read in another topic where emmanuel mentioned that it is actually safari having the issue and not Bubble. But could it also be a double sides issue?

Would be really nice if this could be resolved but has the exact problem been identified yet? Could nitwits like me help with that in any way? @emmanuel

1 Like