[Bug]: Switching between rich text components to fast, causes Microsoft.JSInterop.JSException

[BpKlomp]

Blazorise Version

1.5.1

What Blazorise provider are you running on?

Bootstrap5

Link to minimal reproduction or a simple code snippet

Make two components that have one or more rich text editor components. Create a way to switch between te two. If you switch fast enough the eroor will be displayed

Steps to reproduce

//

What is expected?

It should not cause an error

What is actually happening?

In richtextedit.json line 120, editorRef is null before it's called. Because you switch before it loaded fully, it causes an error.

Microsoft.JSInterop.JSException: Cannot read properties of null (reading 'quill') TypeError: Cannot read properties of null (reading 'quill') at Module.setReadOnly (https://localhost:7207/_content/Blazorise.RichTextEdit/richtextedit.js?v=1.5.1.0:123:30) at https://localhost:7207/_framework/blazor.server.js:1:3506 at new Promise () at Ft.beginInvokeJSFromDotNet (https://localhost:7207/_framework/blazor.server.js:1:3480) at Ft._invokeClientMethod (https://localhost:7207/_framework/blazor.server.js:1:75072) at Ft._processIncomingData (https://localhost:7207/_framework/blazor.server.js:1:72696) at Ft.connection.onreceive (https://localhost:7207/_framework/blazor.server.js:1:67009) at i.onmessage (https://localhost:7207/_framework/blazor.server.js:1:51322) at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args) at Microsoft.JSInterop.JSObjectReferenceExtensions.InvokeVoidAsync(IJSObjectReference jsObjectReference, String identifier, Object[] args) at Blazorise.Modules.BaseJSModule.InvokeSafeVoidAsync(String identifier, Object[] args) at Blazorise.RichTextEdit.RichTextEdit.<>c__DisplayClass15_0.<b__1>d.MoveNext()

What browsers do you see the problem on?

Microsoft Edge

Any additional comments?

This bug has been happening for multiple versions of blazorize

[stsrki]

Can I ask you to create a simple reproducible?

[BpKlomp]

I will try to. After this message I started. The bug is not as easy to reproduce as I thought it would be. Something to do with the way we switch between components with some delay somewhere. Should have something soon

[BpKlomp]

I managed to track down what the issue was in my code. Though I did make a basic project to reproduce. Some stuff is probably unnecessary https://github.com/BpKlomp/RichTextEditBug/tree/main

If you run the project, you just have to switch between the two buttons a couple of times and it will happen quite consistently. The issue happens because of the extra state changes after switching. Its bad code, so maybe it's not worth fixing on your end. (index.razor line 37-40)

[stsrki]

It usually happens to be the users code at fault :)

Yeah, I think this is not so much of a Blazorise issue. If you agree, I will close it.

[BpKlomp]

The issue still exists somewhere, but it might be Blazor itself. Just the way it is caused on my end can be fixed. There is still scenarios where this will happen to others, for legitimate reasons.

Probably for now its fine to close it and if someone has the same issue they can reopen it.

[BpKlomp]

It seems like the issue is more likely than I first thought. The specific code we had in place, just caused this relatively often. But there is more cases where this or a related error happens (System.NullReferenceException at Blazorise.Extensions.ObjectExtensions+d__1.MoveNex)

The problem appears whenever you trigger a StateHasChanged during the loading/unloading of the rich text editor. This could be in a different function running on the side to the one that you're using to switch objects.

[stsrki]

I will try and see if we can improve it.