Files
Umbraco-CMS/tests/Umbraco.Tests.Integration/Umbraco.Infrastructure/PropertyEditors/RichTextPropertyEditorTests.cs

180 lines
9.4 KiB
C#
Raw Normal View History

using NUnit.Framework;
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
using Umbraco.Cms.Core;
using Umbraco.Cms.Core.Models;
using Umbraco.Cms.Core.Models.Blocks;
using Umbraco.Cms.Core.PropertyEditors;
using Umbraco.Cms.Core.Serialization;
using Umbraco.Cms.Core.Services;
using Umbraco.Cms.Tests.Common.Builders;
using Umbraco.Cms.Tests.Common.Testing;
using Umbraco.Cms.Tests.Integration.Testing;
namespace Umbraco.Cms.Tests.Integration.Umbraco.Infrastructure.PropertyEditors;
[TestFixture]
[UmbracoTest(Database = UmbracoTestOptions.Database.NewSchemaPerTest)]
public class RichTextPropertyEditorTests : UmbracoIntegrationTest
{
private IContentTypeService ContentTypeService => GetRequiredService<IContentTypeService>();
private IContentService ContentService => GetRequiredService<IContentService>();
private IDataTypeService DataTypeService => GetRequiredService<IDataTypeService>();
private IJsonSerializer JsonSerializer => GetRequiredService<IJsonSerializer>();
[Test]
public void Can_Use_Markup_String_As_Value()
{
var contentType = ContentTypeBuilder.CreateTextPageContentType("myContentType");
contentType.AllowedTemplates = Enumerable.Empty<ITemplate>();
ContentTypeService.Save(contentType);
var dataType = DataTypeService.GetDataType(contentType.PropertyTypes.First(propertyType => propertyType.Alias == "bodyText").DataTypeId)!;
var editor = dataType.Editor!;
var valueEditor = editor.GetValueEditor();
const string markup = "<p>This is some markup</p>";
var content = ContentBuilder.CreateTextpageContent(contentType, "My Content", -1);
content.Properties["bodyText"]!.SetValue(markup);
ContentService.Save(content);
var toEditor = valueEditor.ToEditor(content.Properties["bodyText"]);
var richTextEditorValue = toEditor as RichTextEditorValue;
Assert.IsNotNull(richTextEditorValue);
Assert.AreEqual(markup, richTextEditorValue.Markup);
}
[Test]
public void Can_Use_RichTextEditorValue_As_Value()
{
var contentType = ContentTypeBuilder.CreateTextPageContentType("myContentType");
contentType.AllowedTemplates = Enumerable.Empty<ITemplate>();
ContentTypeService.Save(contentType);
var dataType = DataTypeService.GetDataType(contentType.PropertyTypes.First(propertyType => propertyType.Alias == "bodyText").DataTypeId)!;
var editor = dataType.Editor!;
var valueEditor = editor.GetValueEditor();
const string markup = "<p>This is some markup</p>";
var propertyValue = RichTextPropertyEditorHelper.SerializeRichTextEditorValue(new RichTextEditorValue { Markup = markup, Blocks = null }, JsonSerializer);
var content = ContentBuilder.CreateTextpageContent(contentType, "My Content", -1);
content.Properties["bodyText"]!.SetValue(propertyValue);
ContentService.Save(content);
var toEditor = valueEditor.ToEditor(content.Properties["bodyText"]);
var richTextEditorValue = toEditor as RichTextEditorValue;
Assert.IsNotNull(richTextEditorValue);
Assert.AreEqual(markup, richTextEditorValue.Markup);
}
[Test]
public void Can_Track_Block_References()
{
var elementType = ContentTypeBuilder.CreateAllTypesContentType("myElementType", "My Element Type");
elementType.IsElement = true;
ContentTypeService.Save(elementType);
var contentType = ContentTypeBuilder.CreateTextPageContentType("myContentType");
contentType.AllowedTemplates = Enumerable.Empty<ITemplate>();
ContentTypeService.Save(contentType);
var pickedContent = ContentBuilder.CreateTextpageContent(contentType, "My Content", -1);
ContentService.Save(pickedContent);
var dataType = DataTypeService.GetDataType(contentType.PropertyTypes.First(propertyType => propertyType.Alias == "bodyText").DataTypeId)!;
var editor = dataType.Editor!;
var valueEditor = (BlockValuePropertyValueEditorBase<RichTextBlockValue, RichTextBlockLayoutItem>)editor.GetValueEditor();
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
var elementId = Guid.NewGuid();
var propertyValue = RichTextPropertyEditorHelper.SerializeRichTextEditorValue(
new RichTextEditorValue
{
Markup = @$"<p>This is some markup</p><umb-rte-block data-content-udi=""umb://element/{elementId:N}""><!--Umbraco-Block--></umb-rte-block>",
Blocks = JsonSerializer.Deserialize<RichTextBlockValue>($$"""
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
{
"layout": {
"Umbraco.TinyMCE": [{
"contentUdi": "umb://element/{{elementId:N}}"
}
]
},
"contentData": [{
"contentTypeKey": "{{elementType.Key:D}}",
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
"udi": "umb://element/{{elementId:N}}",
"contentPicker": "umb://document/{{pickedContent.Key:N}}"
}
],
"settingsData": []
}
""")
},
JsonSerializer);
var content = ContentBuilder.CreateTextpageContent(contentType, "My Content", -1);
content.Properties["bodyText"]!.SetValue(propertyValue);
ContentService.Save(content);
var references = valueEditor.GetReferences(content.GetValue("bodyText")).ToArray();
Assert.AreEqual(1, references.Length);
var reference = references.First();
Assert.AreEqual(Constants.Conventions.RelationTypes.RelatedDocumentAlias, reference.RelationTypeAlias);
Assert.AreEqual(pickedContent.GetUdi(), reference.Udi);
}
[Test]
public void Can_Track_Block_Tags()
{
var elementType = ContentTypeBuilder.CreateAllTypesContentType("myElementType", "My Element Type");
elementType.IsElement = true;
ContentTypeService.Save(elementType);
var contentType = ContentTypeBuilder.CreateTextPageContentType("myContentType");
contentType.AllowedTemplates = Enumerable.Empty<ITemplate>();
ContentTypeService.Save(contentType);
var dataType = DataTypeService.GetDataType(contentType.PropertyTypes.First(propertyType => propertyType.Alias == "bodyText").DataTypeId)!;
var editor = dataType.Editor!;
var valueEditor = (BlockValuePropertyValueEditorBase<RichTextBlockValue, RichTextBlockLayoutItem>)editor.GetValueEditor();
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
var elementId = Guid.NewGuid();
var propertyValue = RichTextPropertyEditorHelper.SerializeRichTextEditorValue(
new RichTextEditorValue
{
Markup = @$"<p>This is some markup</p><umb-rte-block data-content-udi=""umb://element/{elementId:N}""><!--Umbraco-Block--></umb-rte-block>",
Blocks = JsonSerializer.Deserialize<RichTextBlockValue>($$"""
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
{
"layout": {
"Umbraco.TinyMCE": [{
"contentUdi": "umb://element/{{elementId:N}}"
}
]
},
"contentData": [{
"contentTypeKey": "{{elementType.Key:D}}",
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
"udi": "umb://element/{{elementId:N}}",
"tags": "[\"Tag One\", \"Tag Two\", \"Tag Three\"]"
V13/feature/blocks in rte (#15029) * insert umb rte block web component in rte * First stab at moving the RTE markup to a nested "markup" property in the property value. * initial work * only rewrite markup * transform RTE into component * parse scope in grid.rte * revert use a fallback instead * block insertion and sync in place * block picker partly impl * remove test of old controller * remove test of old controller * block with block data * proper block with api connection * remove log * styling * Persist blocks data (still a temporary solution) * styling allows for interaction * block actions * tinyMCE styling * paste feature * prevalue display Inline toggle * inline mode in RTE * todo note * fixes wording * preparation for editor communication * remove val-server-match for now * clean up blocks that does not belong in markup * remove blocks not used in the markup * liveEditing * displayAsBlock formatting * clean up * TODO note * Serverside handling for RTE blocks (incl. refactor of Block List and Block Grid) * ensure rich text loads after block editor * trigger resize on block init * Handle RTE blocks output in Delivery API * sanitize ng classes * simplify calls to init blocks * move sanitisation * make validation work * only warn when missing one * clean up * remove validation border as it does not work * more clean up * add unsupported block entry editor * Revert breaking functionality for Block List and Grid * prevent re-inits of blocks * make sure delete blocks triggers an update * Refactor RichTextPropertyIndexValueFactory to index values from blocks + clean up RichTextPropertyEditor dependencies * first working cursor solution * inline element approach * Handle both inline and block level blocks * Fix the RTE block parser regex so it handles multiple inline blocks. * Fix reference and tags tracking, add tests, make the editor backwards compatible and make deploy happy * Use RichTextPropertyEditorHelper serialization in tests * Ensure correct model in Block Grid value converter (incl unit test to prove it) * do not include umbblockpicker in grid * make blocks the new default, instead of macros * only send value of body from DOMParser * Blocks of deleted ElementTypes shows unsupported * do not edit a unsupported block * remove trying to be smart on the init * fix missing culture issue * set dirty * alert when no blocks * Revert "make blocks the new default, instead of macros" This reverts commit 283e8aa473fdfde075197d34aa47e35dfc64a8ae. --------- Co-authored-by: kjac <kja@umbraco.dk>
2023-10-31 12:52:35 +01:00
}
],
"settingsData": []
}
""")
},
JsonSerializer);
var content = ContentBuilder.CreateTextpageContent(contentType, "My Content", -1);
content.Properties["bodyText"]!.SetValue(propertyValue);
ContentService.Save(content);
var tags = valueEditor.GetTags(content.GetValue("bodyText"), null, null).ToArray();
Assert.AreEqual(3, tags.Length);
Assert.IsNotNull(tags.Single(tag => tag.Text == "Tag One"));
Assert.IsNotNull(tags.Single(tag => tag.Text == "Tag Two"));
Assert.IsNotNull(tags.Single(tag => tag.Text == "Tag Three"));
}
}