[4.x] Missing formatting options in rich text editor

anita-chouhan commented 1 month ago

Describe the bug

Setup:

I'm using Vizy fields within matrix blocks.
Vizy field editor modes are set to Blocks & Rich Text.
Custom config files are being used for editors.
One custom config offers fewer formatting options than the other.
The matrix field contains several blocks with Vizy fields.

Issue:

If I first add the block with fewer formatting options to the matrix field and then add another block with more options, the second block will only show the common options and not all the available options.

Steps to reproduce

Here are the instructions:

Create a matrix field and add two blocks to it.
Name the blocks "Rich Text" and "List" respectively.
Add a Vizy-type field to each block.
Set the editor mode to "Blocks and Rich Text".
In the editor config option, select the "RichText" and "List" config files for the fields.
Enable the empty paragraph removal option for both blocks.
Add the matrix field to an entry.
Go to the entry and select the "List" block first, then choose the "Rich Text" block.
Check the available formatting options for both blocks.

Config files to test: RichText.json { "buttons": [ "formatting", "bold", "italic", "link", "unordered-list", "ordered-list" ], "toolbarFixed": true, "formatting": [ "h3", { "title": "Heading 3 Caption", "type": "heading", "editorStyle": ".vizy-h3-caption { font-size: 1.3em; }", "attrs": { "class": "vizy-h3-caption", "level": "6" } }, "h4", "h5", "blockquote", "paragraph" ] }

List.json { "buttons": ["formatting", "bold", "italic", "link", "unordered-list"], "formatting": ["h3", "paragraph"] }

Craft CMS version

4.10.6

Plugin version

2.1.20

Multi-site?

No

Additional context

No response

engram-design commented 1 month ago

I've just replicated your field setup and that seems to be working.

CleanShot 2024-08-09 at 12 57 48@2x

Anything else worth noting about your reproduction?

anita-chouhan commented 1 month ago

I've just replicated your field setup and that seems to be working.

Anything else worth noting about your reproduction?

@engram-design I expect the Rich Text editor block to show all the formatting options available in the RichText.json config. Currently, the H4, H5 and Blockquote are missing.

engram-design commented 1 month ago

Oh, my mistake! I missed those due to the JSON formatting.

{
    "buttons":[
        "formatting",
        "bold",
        "italic",
        "link",
        "unordered-list",
        "ordered-list"
    ],
    "toolbarFixed":true,
    "formatting":[
        "h3",
        {
            "title":"Heading 3 Caption",
            "type":"heading",
            "editorStyle":".vizy-h3-caption { font-size: 1.3em; }",
            "attrs":{
                "class":"vizy-h3-caption",
                "level":"6"
            }
        },
        "h4",
        "h5",
        "blockquote",
        "paragraph"
    ]
}

Indeed, h4, h5 and blockquote are missing. Fixed for the next release. To get this early, run composer require verbb/vizy:"dev-craft-4 as 2.1.20".

anita-chouhan commented 1 month ago

Hello @engram-design, thank you for looking into it. I tried the bug-fix release but found that formatting options are not working. The only two options that are working are Heading 3 Caption and Link

https://github.com/user-attachments/assets/0be0fe14-ff61-4314-a8ee-50eff8c23c51

.

engram-design commented 1 month ago

Should be fixed in 2.1.22

verbb / vizy