Giters

Basaingeal / Razor.SweetAlert2

A Razor class library for interacting with SweetAlert2

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Flickering problem

daparici opened this issue · comments

commented

When swal.Fire() is called, the sweetalert dialog is shown for milliseconds in the center of the screen and then it's animated fading from up to down causing a little flick. Is there any way to avoid this?

commented

This sounds like a problem with the sweetalert2 library, as most functionality is relayed straight to the library through JS interop. There is a patch version of the library that I will be updating to tomorrow. I don't see an active/closed issue about this in the sweetalert2 repo though, so it's possible it's on my end.

Let me do some work to reproduce and I'll see what I can find.

commented

@daparici I'm not seeing this problem with the latest version or the version before that.
Could you let me know if it's a server or WASM app that you're having trouble with, and which browser you're seeing it on as well?

commented

Closed due to lack of response.

commented

Hi,

We're seeing the same issue as well. When a sweet alert is fired for the first time it's popping up the default styled alert in the middle before it pops up the themed one. The only theme that I didn't see this happening on was the dark theme. Refreshing the page also seems to cause the issue again, although it didn't consistently reproduce it. We're using v2.6.6 and server-side blazor if that helps.

default-popping-up

commented

I see now. I'll take another look at it.

I think this is happening because the theme setting isn't actually checked until the first FireAsync() call is actually made. That because it has to load the stylesheet for the theme, but it can't do it on page load because Blazor is a SPA framework, and there may not be a component injecting the SweetAlertService loaded on page load (if it's used on one page that isn't the homepage).

So likely the flickering is happening because the sweet alert pops up before the browser has finished loading the stylesheet for the theme.

I'll see what I can do about it, to somehow preload the theme stylesheet when the service is injected into a loaded component. If the SweetAlert were a Blazor component, that would be easy, but since it's a service, it might be a bit trickier.

commented

Hi Michael,

Any luck with this?

commented

I've been working through a potential solution over the past few days. I'm hoping to have a PR out sometime tomorrow.