Widget: invalidate layout on css class changes

Toggling a css class could change the size of a widget and could
therefore require a layout invalidation.
From java code, it is not possible to invalidate the layout, so it
would be necessary to create a custom widget and do it with JS.
Or we could add the possibility to invalidate the layout to Widget.java.
But actually calling invalidate layout from outside of a widget should
never be necessary, so we decided to do it on every cssClass change.

If it turns out that it has too many side effects
(flickering, performance) on widgets that don't require the
invalidation, we will think of another solution.

292520

1 files changed, 4 insertions, 0 deletions

diff --git a/eclipse-scout-core/src/widget/Widget.js b/eclipse-scout-core/src/widget/Widget.js
index 109442c7fe..02dab6974f 100644
--- a/eclipse-scout-core/src/widget/Widget.js
+++ b/eclipse-scout-core/src/widget/Widget.js
@@ -938,6 +938,10 @@ export default class Widget {
       return;
     }
     this.$container.addClass(this.cssClass);
+    if (this.htmlComp) {
+      // Replacing css classes may enlarge or shrink the widget (e.g. setting the font weight to bold makes the text bigger) -> invalidate layout
+      this.invalidateLayoutTree();
+    }
   }
 
   setCssClass(cssClass) {