Blazor.GraphEditor Not Working in Blazor Server / Blazor Hybrid Setup

[rcapil]

The library does not work out-of-the-box when used in a Blazor Server / Blazor Hybrid setup. In our use case, we're using it in a Blazor Hybrid setup and we need it to be thread safe and have internal component calls to use InvokeAsync(). We pulled in the project into our solution and made this tweak to get it working:

// GraphEditor.razor
<CascadingValue Value="callbackContext">
    <SVGEditor @ref=SVGEditor
               Input=@Input
               InputUpdated="(string s) => { Input = s; InvokeAsync(()=> StateHasChanged());}" // Wrapped in InvokeAsync
               SupportedElements=SupportedElements
               DisableContextMenu=true />
</CascadingValue>

We were able to get the sample code from Index.razor working in our Blazor Hybrid setup but it crashes after some time and we get this error:

System.InvalidOperationException: 'Collection was modified; enumeration operation may not execute.'

That happens on Node.cs class line 65:

 public override string StateRepresentation => base.StateRepresentation + Stroke + R.ToString() + (Image ?? "");

Any ideas as to what is happening here?

Would you be able to make enhancements to allow this library to work with a Server/Hybrid setup? If not, what other tweaks would we need to make to get passed the error above?

We also notice the visualization and animation is slower when in the context of a Server/Hybrid setup, is this due to the nature of the configuration that it requires constant server updates?

[KristofferStrube]

Hey @rcapil, thanks for your interest in the project! 😁

I have not tested it heavily in Blazor Server so it might have some kinks as you have noticed. I will add a minimal Blazor Server example project and make sure that it works in both Blazor WASM and Server. I will probably have time to add this and make adjustments to make it more Blazor-Server-Friendly before the weekend.

To answer your question of whether it might be slow in Blazor Server: Yes, it will definitely be slower in Blazor Server. The project is based on SVG updates to the DOM which will probably become a bottleneck for the SignalR connection when you have large graphs. I don't have a lot of experience with Blazor Hybrid, but I would expect that the problem is lesser for that compared to Blazor Server. If it is easy to get a minimal sample of Blazor Hybrid set up, then I will add that as well. In what type of project do you use Blazor Hybrid in your scenario?

[rcapil]

Hi Kristoffer,

Thanks for the quick response! In our project we have a WPF Blazor Hybrid embedding it via BlazorWebView control. Looking forward to the new examples. Thanks!

[rcapil]

HI @KristofferStrube,

Just checking in on this. Are there any updates on this issue? Thanks!

[KristofferStrube]

Hey @rcapil sorry for not updating. I have looked into the issue. It seems like there are many problems that occur when the running the GraphEditor in the Server mode so I will have to look more into it. I think most of them originate when the different render states are executed, so I'm looking into what adjustment I can make to when I change the graph in correlation to when rerenders are triggered.