setValue for RichTextEditor in ComponentRenderer doesn't work

Hello everyone,

I would like to create a VirtualList composed of Details, each containing a RichTextEditor. I am struggling to set the values loaded from the database. Can someone provide guidance on how to achieve this? I am using an example that involves the use of ComponentRenderer. The sample values in the database are in HTML format, for example, "

Example

. RichTextEditor is empty after setValue(). Here is code:

    public VirtualListView(MedicalDiagnosisService medicalDiagnosisService) {
        VirtualList<MedicalDiagnosis> virtualList = new VirtualList<>();
        virtualList.setItems(medicalDiagnosisService.findAll());
        virtualList.setRenderer(cardRenderer);
    }

    private final ComponentRenderer<Details, MedicalDiagnosis> cardRenderer =
            new ComponentRenderer<>(medicalDiagnosis -> {
                RichTextEditor richTextEditor = new RichTextEditor();

                Details details = new Details();

                richTextEditor.setValue(medicalDiagnosis.getDescription());
                details.setSummaryText(medicalDiagnosis.getDiagnosisDate().toString());
                details.addContent(richTextEditor);

                return details;
            });

What version are you using?

24.1.4

        Details details = new Details();
        RichTextEditor richTextEditor = new RichTextEditor();
        richTextEditor.setValue("<p> Example </p>");
        details.setSummaryText("example");
        details.addContent(richTextEditor);

For this setValue() works good.

Problem is with ComponentRenderer

You could check if it would help to only instantiate the rich text editor once the details is opened, it might be a problem because it’s initially hidden (this would also improve performance)

https://cookbook.vaadin.com/lazy-details

It works! Thank you very much!!

Make sure you read Rich Text Editor | Components | Vaadin Docs