CSS Vaadin Loading Indicator funktioniert seit Java 17 nicht mehr

[OnDemand]

Moin zusammen,

habe meine App auf Java17 und Spring Boot 3 angehoben, Vaadin läuft auf v24.

Nun habe ich mit dieser Anleitung >klick< eingebaut, dass der Hintergrund dunkel werden soll und darüber ein Gif Loading Spinner gezeigt wird. Hat auch alles super funktioniert vor dem Update, nun aber nach dem Update wird der Hintergrund nicht mehr dunkel, es wird nur das Gif angezeigt (welches einen transparenten Hintergrund hat)

Hat jemand ne Idee woran das liegen kann? Hab schon alles versucht, Frontend tausend mal neu gebaut, Indexe und Caches gelöscht von IDE wie auch Browser. Der Hintergrund will einfach nicht dunkel werden.

.v-loading-indicator {
    position: fixed; /* Occupy whole screen even if scrolled */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* Eat mouse events when visible, doesn't prevent scrolling */
    pointer-events: auto;
    /* Animated with delay to prevent flashing */
    animation: fadein 0.4s ease-out 0.3s normal 1 both;
    z-index: 2147483647;
}

.v-loading-indicator:before {
    position: fixed;
    top: 35%;
    left: 35%;
    content: url("https://xxx.com/preloader.gif");
}


@keyframes fadein {
    0% {
        background: rgba(0, 0, 0, 0);
    }
    100% {
        background: rgba(0, 0, 0, .6); /* Darkens the UI */
    }
}

Die benötigte Einstellung um den Standard Indicator zu entfernen habe ich auch gemacht.

 @Override
    public void serviceInit(ServiceInitEvent serviceInitEvent) {
        serviceInitEvent.getSource().addUIInitListener(uiInitEvent -> {
            LoadingIndicatorConfiguration conf = uiInitEvent.getUI().getLoadingIndicatorConfiguration();
            // disable default theme -> loading indicator isn't shown
            conf.setApplyDefaultTheme(false);
            conf.setFirstDelay(400); // 300ms is the default

            /* Delay for setting the 'second' class name */
            conf.setSecondDelay(1600); // 1500ms is the default

            /* Delay for setting the 'third' class name */
            conf.setThirdDelay(5000);
        });
    }

Hab von CSS zwar überhaupt keinen Plan, aber scheint als hätte sich irgendwie der Klassenname oder wie das in CSS heisst, geändert. Wenn ich im Browser untersuche, finde ich nix was .v-loading-indicator heißt. Aber das gif wird ja angezeigt also muss es das ja doch irgenwie geben.

Vielleicht ist hier ein CSS Profi unter uns der mir einen Tipp geben kann

 

[mihe7]

Kenn mich mit Vaadin nicht aus, aber nach https://vaadin.com/docs/v14/flow/advanced/tutorial-loading-indicator müsste es ja im HTML ein entsprechendes div geben.