EZP-29328: As an editor I want AE to support formatted text

[dew326]

Question	Answer
Tickets	https://jira.ez.no/browse/EZP-29328
Bug fix?	no
New feature?	yes
BC breaks?	no
Tests pass?	yes
Doc needed?	yes
License	GPL-2.0

Screenshot:

This is a new feature but the target branch is 1.3 as this is needed for the migration.

Checklist:

• Coding standards ($ composer fix-cs)
• Ready for Code Review

[andrerom]

Nice!

Did you figure out what caused the toolbar position to go all over the place @dew326 ?

[dew326]

@andrerom yes, it's because the empty pre tag gets some empty text nodes. Hopefully it's fixed in this line: https://github.com/ezsystems/ezplatform-admin-ui/pull/709/files#diff-71c5e1a664b1342cfae2e62de8b241bbR19

[sunpietro]

Just one minor change.

[katarzynazawada]

• Formatted style is not always passible to choose

1. Click on Rich Text Editor
2. Change style to Formatted.
3. Type same text.
4. Change style to Heading 1.

There is no way to change the style to formatted – there is no Formatted block in the list. When changing style to Paragraph Formatted block appears.

• For more text, scroll appears in edit mode. If clicking Add button in situation when cursor is outside the current view, page and toolbar skips.

• RichText Editor is not styled properly when changing styles

A) Safari

1. Click on Rich Text Editor
2. Change style to Formatted.
3. Type same text.
4. Add new block (Paragraph).
5. Change Paragraph style to Formatted.
6. Change the style back to Paragraph.

B) Chrome

Steps like on Safari and then:

7. Click outside the editor.

8. Go back to Rich Text Editor.

After removing block and clicking in Editor:

Safari:

• Toolbar skips:

1. Click on Rich Text Editor
2. Change style to Formatted.

• Pre use scroll is not added. (on Edge also)

[katarzynazawada]

After fixes:

• Pre use scroll is not added on Firefox

• Cursor is outside the block frame on Safari

1. Click on Rich Text Editor
2. Change style to Formatted.
3. Type same text.
4. Add new block (Paragraph).
5. Change Paragraph style to Formatted.
6. Change the style back to Paragraph.

[dew326]

@katarzynazawada
As discussed in private first issue is because "lorem ipsum" copy paragraph with styles and we cannot do anything with that. If the text is unstyled or typed into the field the scroll is added.

The second issue is not related to our code base. I can reproduce the issue on AlloyEditor demo. I created an issue for AE devs: liferay/alloy-editor#902

[lserwatka]

@dew326 you can merge it up