[BUG-2608] - 8.1 Perspective - Column Container not opening at correct breakpoint

As title suggests. When first navigating to a page, the column container will sometimes not have the correct breakpoint. when the viewport dimensions change it corrects.

@PGriffith @cmallonee Still encountering this issue. I think it has to do with bindings not being evaluated when the column container loads. I have bindings for span and height and these always seem to mess up when the page loads.

Still have this issue, I have operators annoyed at this behaviour. Would like to come up with some sort of resolution or further information soon so I can stop saying “I don’t know”.

How It loads sometimes:


How it should load:

This issue is still occurring in 8.1.1.

Hey Michael,

How do your bindings look that drive the span and height?

Height is bound as an expression (I’ve done this because copying components in a column container does not retain the height value)

The span is determined by taking a minwidth custom property and using the breakpoint widths to determine the minimum span required to keep the width of the component large enough.

I also have order bindings that just reflect a custom property on the component for ease of changing order on all breakpoints.

It seems like these don’t get evaluated correctly somehow. I can fix it by clicking the navigation link again from the menu tree or by resizing the page.

From what it looks like the span and maybe order properties are defaulting to None when your view loads and for some reason the initial navigation to the window isn’t firing those bindings.

What happens if you make them persistent? Do they load incorrectly on first load?

I’m assuming you don’t have a binding on custom.minWidth?

Persistent doesn’t appear to make a difference. Interestingly, when I inspect element, some of the items in the column container don’t even exist, when I resize they pop into existence. Looking at the ones that are working, they seem to have an undefined span. Can IA shed some light on how the column container determines the span? It seems like the bindings for the column container are being evaluated without the custom properties (When I delete the custom properties the same behaviour is seen in the designer). On a related note, when copying items with bindings, the props with bindings will not be visible. To get them to show up you need to deselect the component and select it again. Not sure if this behaviour has been seen elsewhere.

columnTest.zip (8.7 KB)
Here is an export of a view using labels in a column container. Best way to replicate is to change one of the bindings to persistent, and then save while the session is open. It consistently occurs for me in this way. @cmallonee

Bump for visibility.

We hear you, and are looking into it. What should we expect to see in the attached project? Are you seeing this behavior on a recent release?

8.1.5 is the version that this behaviour is replicated on. I have a page setup looking at that view directly. When the issue occurs, none of the labels will be visible. Reloading the webpage or changing the viewport dimensions will correct the behaviour and the labels will be at their correct dimensions. I am using chrome version 90.0.4430.212 as the browser, I haven’t tried replicating in firefox.

Other things to note: Labels and containers will not be in the page when the issue occurs, it is as if they do not exist. Embedded views do not exhibit this behaviour, but they will have incorrect span or position.

Before:

after reload/resize:

Note that the inner container only gets populated after the resize.

I am able to get the issue to occur more consistently when the update notification is turned off.

Okay, I see what is going on. We’ll get this fixed immediately. Thanks!

Thanks @ynejati. Are you able to explain why this happens? It might assist others with different problems.

Sure. The column container expects that children have a rowIndex on initialization. If there is no rowIndex found on initialization, it will cause the issue that you’re seeing when no children are rendered to the container, i.e. the blank screen. The column container also does not listen to changes to the position property of its children at the moment. Until a fix for both is merged, you might be able to work around these issues by doing something to force the column container to update, like changing its dimensions or writing to its props once the rowIndex binding has been evaluated.

Interesting, I assume this goes for the other position properties as well like span and column index.

Yes, all position properties. Fix should be available in the next nightly build and eventually 8.1.8 final. Thanks for your patience.