Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Conditional element causes runtime panic when used as breakpoint #7126

Open
jmEvoqua opened this issue Dec 17, 2024 · 5 comments · May be fixed by #7132
Open

Conditional element causes runtime panic when used as breakpoint #7126

jmEvoqua opened this issue Dec 17, 2024 · 5 comments · May be fixed by #7132
Labels
a:compiler Slint compiler internal (not the codegen, not the parser) bug Something isn't working

Comments

@jmEvoqua
Copy link

Bug Description

I tried to add a 'breakpoint' for a mobile screen inside a layout tree. I slimed down the example, but interstingly the panic only occures when the condition is inside a component.

Try to use the wrappers in the code below. Each wrapper causes a panic.

I also tried plastering width: 100%s, VerticalLayouts and HorizontalLayouts everywhere. Nothing helped.

Reproducible Code (if applicable)

component Wrapper {
    width: 100%;
    height: 100%;

    Rectangle {
        VerticalLayout {
            if root.width > 200px: Rectangle { }
        }
    }
}

component WrapperInherited inherits Rectangle {
    VerticalLayout {
        if root.width > 200px: Rectangle { }
    }
}

export component Test inherits Window {

    VerticalLayout {
        HorizontalLayout {

            // Wrapper { }
            
            // WrapperInherited { }
           
            Rectangle {
                VerticalLayout {
                    if root.width > 200px: Rectangle { }
                }
            }
        }
    }
}

Environment Details

  • Slint Version: 1.8.0
  • Platform/OS:
  • Programming Language:
  • Backend/Renderer:

Product Impact

This bug blocks us from building a mobile friendly version (lower prio)

@jmEvoqua jmEvoqua added bug Something isn't working need triaging Issue that the owner of the area still need to triage labels Dec 17, 2024
@tronical
Copy link
Member

The panic is

thread 'main' panicked at /Users/simon/src/slint/internal/core/properties.rs:523:9:
Recursion detected

That means that there's a circular dependency. For example:

At least in case of the direct use (without wrapper), root.width refers to the Window's width. And that in turn doesn't depend directly on the constraints of the layout.

@jmEvoqua
Copy link
Author

But shouldn't the wrapper with width: 100% just take the parents width and do not depend on the layout?

A workaround is to make the whole layout conditional:

component WrapperInherited inherits Rectangle {
    if root.width > 200px: VerticalLayout {
        if root.width > 200px: Rectangle { }
    }
}

I am not sure if this only works because of #407.

Or is there another way to achieve the behaviour I want? In a nested layout tree, I want to use a vertical layout on small screens, and a horizontal on larger ones.

@jmEvoqua
Copy link
Author

Another workaround is to wrap the WrapperInherited inside a rectangle:

component WrapperInherited inherits Rectangle {
    VerticalLayout {
        if root.width > 200px: Rectangle { }
    }
}

export component Test inherits Window {

    VerticalLayout {
        HorizontalLayout {
            Rectangle {
                WrapperInherited { }
            }
        }
    }
}

I am not sure why it works, and also not if this is desired behaviour or if it will change. This does not work with the non-inherited Wrapper.

@ogoffart ogoffart added a:compiler Slint compiler internal (not the codegen, not the parser) and removed need triaging Issue that the owner of the area still need to triage labels Dec 17, 2024
@ogoffart
Copy link
Member

Recursion detected means that there is a binding loop, which was not detected by the compiler at compile time. I'm fixing the compiler in #7132 to properly detect the loop at compile time.

I think you're right that your workaround only work because of #407.
But I think we'll have anyway to be careful when fixing that bug.
Given the current issues with layout I think we'll probably going to rework that and have a new layouting system and somehow keep both systems for compatibility. (And opt-in the new system with a pragma or edition or something like that)

@jmEvoqua
Copy link
Author

jmEvoqua commented Dec 17, 2024

Thx for the insights. I think it is a great idea to keep both systems around.
That way I can focus on achieving the layouts I want now and do not need to worry about breaking changes 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a:compiler Slint compiler internal (not the codegen, not the parser) bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants