Fix visible property on the root of a component

Just like opacity and other properties, it needs to prevent inlining.

And also add the same warning as for opacity if it is used on the root
(the Window)

internal/compiler/passes.rs

@@ -134,7 +134,7 @@ pub async fn run_passes(
             &global_type_registry.borrow(),
             diag,
         );
-        visible::handle_visible(component, &global_type_registry.borrow());
+        visible::handle_visible(component, &global_type_registry.borrow(), diag);
         lower_shadows::lower_shadow_properties(component, &doc.local_registry, diag);
         lower_property_to_element::lower_property_to_element(
             component,

internal/compiler/passes/inlining.rs

@@ -486,7 +486,11 @@ fn component_requires_inlining(component: &Rc<Component>) -> bool {
         let binding = binding.borrow();
         // The passes that dp the drop shadow or the opacity currently won't allow this property
         // on the top level of a component. This could be changed in the future.
-        if prop.starts_with("drop-shadow-") || prop == "opacity" || prop == "cache-rendering-hint" {
+        if prop.starts_with("drop-shadow-")
+            || prop == "opacity"
+            || prop == "cache-rendering-hint"
+            || prop == "visible"
+        {
             return true;
         }
         if (prop == "height" || prop == "width") && binding.expression.ty() == Type::Percent {

internal/compiler/passes/visible.rs

@@ -6,12 +6,25 @@
 use std::cell::RefCell;
 use std::rc::Rc;
 
+use crate::diagnostics::BuildDiagnostics;
 use crate::expression_tree::{Expression, NamedReference};
 use crate::langtype::{ElementType, NativeClass, Type};
 use crate::object_tree::{self, Component, Element, ElementRc};
 use crate::typeregister::TypeRegister;
 
-pub fn handle_visible(component: &Rc<Component>, type_register: &TypeRegister) {
+pub fn handle_visible(
+    component: &Rc<Component>,
+    type_register: &TypeRegister,
+    diag: &mut BuildDiagnostics,
+) {
+    if let Some(b) = component.root_element.borrow().bindings.get("visible") {
+        diag.push_warning(
+            "The visible property cannot be used on the root element, it will not be applied"
+                .into(),
+            &*b.borrow(),
+        );
+    }
+
     let native_clip =
         type_register.lookup_element("Clip").unwrap().as_builtin().native_class.clone();
 

internal/compiler/tests/syntax/basic/opacity.slint

@@ -11,4 +11,7 @@ export SuperSimple := Window {
 //              ^error{Cannot convert bool to float}
     }
 
+    visible: false;
+//          ^warning{The visible property cannot be used on the root element, it will not be applied}
+
 }

tests/cases/input/visible_mouse.slint

@@ -18,6 +18,10 @@ MaybeVisible := Rectangle {
     }
 }
 
+Invisible := TouchArea {
+    visible: false;
+}
+
 TestCase := Rectangle {
     height: 100phx;
     width: 100phx;
@@ -37,6 +41,8 @@ TestCase := Rectangle {
         y: 30phx;
     }
 
+    Invisible {  }
+
     test_rect := Rectangle { }
     property <bool> test: test_rect.visible && !el2.visible && el1.visible;
 }