Broken since version 17.2.0.49

[Peter Benedix]

Hello,

I have to use the currente Version 17.2.0.49 but when using a RichTextBox, I get this exception:

 Microsoft.AspNetCore.Components.Web.Rendering.RemoteRenderer[100]
      Unhandled exception rendering component: TypeError: Unable to get property 'ownerDocument' of undefined or null reference
Microsoft.AspNetCore.Components.Web.Rendering.RemoteRendererException: TypeError: Unable to get property 'ownerDocument' of undefined or null reference
   at Microsoft.AspNetCore.Components.Rendering.Renderer.InvokeRenderCompletedCallsAfterUpdateDisplayTask(Task updateDisplayTask, Int32[] updatedComponents)
warn: Microsoft.AspNetCore.Components.Server.ComponentHub[3]
      Unhandled exception in circuit CfDJ8G3xCA9Aj2ZPnDUWgg8hsEP8MRPi70A4g1V3EIEXz5Kft3SgBnuukZ0tLSw_Yqodsgoy7XqVcVsU1gaTInutwQtrVAvTW-G7itUNtaFhoxE8ZzoWfQDhJ_HPELzfhuOTlWy-cfW4aoOozdz2oIIi0hFAzSjAdaAnYF2w_2JimNnp
System.AggregateException: One or more errors occurred. (TypeError: Unable to get property 'ownerDocument' of undefined or null reference)
 ---> Microsoft.AspNetCore.Components.Web.Rendering.RemoteRendererException: TypeError: Unable to get property 'ownerDocument' of undefined or null reference
   at Microsoft.AspNetCore.Components.Rendering.Renderer.InvokeRenderCompletedCallsAfterUpdateDisplayTask(Task updateDisplayTask, Int32[] updatedComponents)
   --- End of inner exception stack trace ---

Using Syncfusion.EJ2.WordEditor.Blazor (17.2.0.46-beta) it's working - using Syncfusion.EJ2.Blazor (17.2.0.49-beta) it does not.

This is the code:

@page "/"
@using Syncfusion.EJ2.Blazor.RichTextEditor;

<h1>Hello, world!</h1>

Welcome to your new app.

<EjsRichTextEditor Placeholder="Message EN">
    <ChildContent>
        <p>@Message</p>
        <RichTextEditorToolbarSettings Items="@Tools"></RichTextEditorToolbarSettings>
    </ChildContent>
</EjsRichTextEditor>

@code
{

     public object[] Tools = new object[]{
        "Bold", "Italic", "Underline", "StrikeThrough",
        "FontName", "FontSize", "FontColor", "BackgroundColor",
        "LowerCase", "UpperCase", "|",
        "Formats", "Alignments", "OrderedList", "UnorderedList",
        "Outdent", "Indent", "|",
        "CreateTable", "CreateLink", "Image", "|", "ClearFormat", "Print",
        "SourceCode", "|", "Undo", "Redo"
    };

    public string Message { get; set; }

}

Is there something broken again?

[Pandiyaraj Muniyandi]

Hi Peter, 

 

Sorry for the inconvenience caused. 

 

We have tried to replicate your reported issue with the given code and the following ways. But we were unable to reproduce the issue at our end. Also, the RichTextEditor component renders properly without any console errors. 

• RichTextEditor render with shared sample codes
• Rendered both RichTextEditor and DocumentEditor on the same page

Note: we are using Preview8 version of Visual studio 2019. 

 

We have prepared sample for your reference, and download it from below link. 

https://www.syncfusion.com/downloads/support/forum/147279/ze/RichTextEditor561547710 

 

Could you share the following details that help us to provide the solution at earliest? 

• Whether you have cleared the local NuGet cache and installed the new NuGet? If no, follow the steps which are mentioned in the links to clear the NuGet cache and check the application once again. Reference:  https://stackoverflow.com/a/34935038 
• Confirm whether you changed to the latest CDN version for these files?

 

    <link rel='nofollow' href="https://cdn.syncfusion.com/ej2/17.2.49/material.css" rel="stylesheet" /> 

    <script src="https://cdn.syncfusion.com/ej2/17.2.49/dist/ej2.min.js"></script> 

    <script src="https://cdn.syncfusion.com/ej2/17.2.49/dist/ejs.interop.min.js"></script> 

 

 

  

Regards, 

Pandiyaraj M 

[Peter Benedix]

Thanks for your reply. I was able to reproduce the issue. Wrap the RichTextBox into a div and set display:none - than it will crash.

<div style="display:none">
    <EjsRichTextEditor Placeholder="Message EN">
        <ChildContent>
            <p>@Message</p>
            <RichTextEditorToolbarSettings Items="@Tools"></RichTextEditorToolbarSettings>
        </ChildContent>
    </EjsRichTextEditor>
</div>

I need to hide and unhide the RichtextBox. So it looks like a bug for me - is there a workaround=

[Buvana Sathasivam]

Hi Peter, 

We have checked your shared code. We didn’t face any console error or crash issue when set display as ‘none’ on Rich Text editor wrapper div element.  

We can achieve your requirement using conditions like below. 

 

<button @onclick=@(() => this.IsVisible = true)>click to open RTE</button> 

<button @onclick=@(() => this.IsVisible = false)>click to close RTE</button> 

 

@if (this.IsVisible) 

{ 

        <div> 

            <EjsRichTextEditor Placeholder="Message EN"> 

                <ChildContent> 

                    <p>@Message</p> 

                    <RichTextEditorToolbarSettings Items="@Tools"></RichTextEditorToolbarSettings> 

                </ChildContent> 

            </EjsRichTextEditor> 

        </div> 

    } 

 

@code 

{ 

public bool IsVisible { get; set; } = false; 

} 

In the above code, we have dynamically shown or hide the Rich Text Editor component when click the buttons. 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/RichTextEditor483285659  

If you face the issue still, kindly share the below information. 

• Share these version details - Preview, NuGet, ej2.min.js, ej.interop libraries.
• Your page code which used to show/hide the Rich Text Editor component.
• If possible, can you please modify the above sample and reproduce your issue.

Regards, 

Buvana S 

 

[Peter Benedix]

Thanks for your reply but that causes the same issue I think. I've recorded a video for you to show and this is the coresponding code:

@using Syncfusion.EJ2.Blazor.RichTextEditor
@using Syncfusion.EJ2.Blazor.Buttons;

<h1>Messages</h1>

@if (this.IsVisible)
{

    <EjsRichTextEditor Placeholder="Message EN">
        <ChildContent>
            <p>@MessageDE</p>
            <RichTextEditorToolbarSettings Items="@Tools"></RichTextEditorToolbarSettings>
        </ChildContent>
    </EjsRichTextEditor>

}
<EjsButton @onclick="toggle">Toggle</EjsButton>

@code {
    // Parametrisierung für die RichText-Boxen
    public object[] Tools = new object[]{
        "Bold", "Italic", "Underline", "StrikeThrough",
        "FontName", "FontSize", "FontColor", "BackgroundColor",
        "LowerCase", "UpperCase", "|",
        "Formats", "Alignments", "OrderedList", "UnorderedList",
        "Outdent", "Indent", "|",
        "CreateTable", "CreateLink", "Image", "|", "ClearFormat", "Print",
        "SourceCode", "|", "Undo", "Redo"
    };

    string MessageDE { get; set; }

    public bool IsVisible { get; set; } = false;

    void toggle()
    {
        IsVisible = !IsVisible;
    }
}

Attachment: ExceptionRichText_62e326bd.zip

[Pandiyaraj Muniyandi]

Hi Peter,  

 

Good day to you. 

 

We have validated the reported issue as per shared video replication steps and able to reproduce from our end. We confirmed “ `ownerDocument of null` exception error occurs, while type and save the current value in RichTextEditor” as a defect from our end and logged a report for the same. We will validate and include the fix in weekly patch release which is scheduled on mid of September. 

 

You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this feedback link, https://www.syncfusion.com/feedback/8739/ 

 

Regards, 

Pandiyaraj M 

[Peter Benedix]

Great....next control that is payed by us but not useable. Same like ListBox, Scheduler,....

[Pandiyaraj Muniyandi]

Hi Peter, 

 

We regret this inconvenience caused.  

 

The above reported issue occurs on MS Edge browser alone and we will make sure to work our components with all browsers with our beta testing. We will fix the reported issue with high priority and include in our upcoming Bi-weekly release, which is expected in mid of September. We appreciate your patience until then. 

 

Regards, 

Pandiyaraj M 

[Pandiyaraj Muniyandi]

Hi Peter, 

 

Good day to you. 

 

We have resolved the reported issue “ownerDocument of null" exception error occurs, while type and save the current value in RichTextEditor” and included in the patch release version 17.2.52-beta. As well as, we have added support to .NET Core 3.0 RC1 with this release. Kindly refer the below release notes section https://ej2.syncfusion.com/blazor/documentation/release-notes/17.2.52/#richtexteditor 

 

We suggest you upgrade to the latest version to resolve this issue in your end.  

 

We have prepared sample for your reference get it from below link 

https://www.syncfusion.com/downloads/support/forum/147279/ze/RTE1341267306 

 

Regards, 

Pandiyaraj M 

[Peter Benedix]

Thanks but you will understand, that we have quit with Syncfusion this time. Too many bugs in too many controls. We can't tell our customers 'please wait one or two weeks until Syncfusion has made his job'.

[Niklas Teich]

Hey @Peter,

i'm currently testing and prototyping with Syncfusion because we need a stable and reliable UI framework for blazor.
You think Syncfusion is not the right choice? What are your alternatives?

Greetings,

Niklas