Page doesn't load correctly in Safari

I have an issue on some of my pages, that things don’t load and display correctly when viewed in Safari. In chrome it seems to be working just fine.

Below is an example from one of the pages. On page load, a repeating group might not be showing, and some text might be skewed around. If I resize the page just slightly, it suddenly displays everything like it should be.
I made a Gif that shows some of the behaviour that occurs. When I resize, everything displays like it should. In this Gif, the unwanted behaviour is:

  1. The repeating group below the first blue sub-header just shows partly the first row.
  2. The text from the second blue sub-header isn’t displaying.

I don’t know if it’s related, but safari console has a few warnings about “page expects an ID”.

Have you tried messing around with the responsive settings? If even just to see if it affects the behavior?

I’m not sure, but I have my doubts it could be related to the responsive settings as it is loading fine in both Chrome and Firefox.

My default to troubleshoot display behavior is group sizes and settings, page sizes and settings, and any other potential elements “floating” around.

If even only as a proof of concept, I might adjust some group sizes to see if the behavior is affected in anyway.

Did you google that console error?

As a side note: If you’re on a paid plan, it’s always a good idea to write down the exact time you begin diagnosing so you can revert back in version control.

There are some hidden groups (layered on top of each other) that are shown/hidden based on different states, and I’ve had a suspicion that it might have something to do about it.
But I think its strange that it only occurs in Safari?

I don’t know - I’m probably too opinionated to be a web developer, but I don’t touch Safari with a ten foot pole :sweat:

The first step is to mess around with the layout - delete a group or whatever. If it changes the behavior then you know it’s the layout. Once you know what it is, you can start focusing in on adjustments.

If it isn’t the layout, then you can start looking at other potential sources of the bug (such as that console error).

Another thing I forgot to mention is that the behaviour isn’t consistent.
If i reload the page in safari, sometimes it displays correctly, sometimes not. Seems like on the first load it renders incorrectly, and next time it might render the way it should.

Safari is a bit of a bear, unfortunately. That’s probably not a Bubble thing, just a reality thing. Every tech company I’ve ever worked at has 2 hated browsers, and Safari is one of them. I’ll let you guess what the other one is :slight_smile:

Hehe :slight_smile:
Well, it’s enough of an issue if my users on Safari experience this.
Guess I’ll just have to play with the groups/responsive settings and see if there is a change.

Having exact same issue with Safari, with everything working just fine with Chrome.
@pnodseth, any success so far for you after playing with sizes and groups, please?

Haven’t been able to identify what causes it unfortunately.
It’s very unpredictable. Sometimes the pages renders fine, sometimes not…

Thanks.
For me resizing a window back and forth always fixes the issue, but unfortunately, that hardly can be deemed as a solution :slight_smile:

I know :slight_smile:

Have you done any troubleshooting yourself?

Tried to play around with responsive settings and sizes of the elements, but it did not help.

Maybe it has something to do with the way the page is structured (multiple groups that are being hidden or made visible based on the user choices), because on simpler pages Safari seems to be running just fine.

Yeah I think so too.
Strange thing is that I have other pages with multiple hidden groups that works well.

Ok an update:
It was mainly one “container group” that caused this unpredictable behaviour.
So I tried creating a new container group and pasting in all the sub groups from the original container.
I’ve tested it a few times now, and it seems to have fixed that particular problem.

2 Likes

Thanks for the update!

You mean you just recreated exact same (new) container group with multiple groups in it and it worked?

Yep - or at least it seems to work so far. :slight_smile:

1 Like

Thanks a lot :slight_smile: that’s really weird though! :slight_smile:

We saw sometime strange things like that one. I suspect some ‘hidden’ code that hasn’t be removed (when moving or erasing an object). After recreating the object, it always work. Some time consuming, but at that point very acceptable.

2 Likes