fix: html encoder not adding multiple text decorations (#424)

* fix: html encoder not adding multiple text decorations

* fix: html encoder with multiple attributes more test added
This commit is contained in:
Ali Hassan 2023-08-29 12:02:01 +05:00 • committed by GitHub
commit 72d6c52f25
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 143 additions and 4 deletions

View file

@ -203,7 +203,7 @@
isa = PBXProject; isa = PBXProject;
attributes = { attributes = {
LastSwiftUpdateCheck = 0920; LastSwiftUpdateCheck = 0920;
LastUpgradeCheck = 1300; LastUpgradeCheck = 1430;
ORGANIZATIONNAME = ""; ORGANIZATIONNAME = "";
TargetAttributes = { TargetAttributes = {
33CC10EC2044A3C60003C045 = { 33CC10EC2044A3C60003C045 = {

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<Scheme <Scheme
LastUpgradeVersion = "1300" LastUpgradeVersion = "1430"
version = "1.3"> version = "1.3">
<BuildAction <BuildAction
parallelizeBuildables = "YES" parallelizeBuildables = "YES"

View file

@ -48,6 +48,10 @@ class DeltaHTMLEncoder extends Converter<Delta, List<dom.Node>> {
..attributes['href'] = href ..attributes['href'] = href
..append(domText); ..append(domText);
} }
//backgroud color and attribute color is added than that was ignoring now all attributes handled according to attributes
if (attributes.backgroundColor != null || attributes.color != null) {
return convertMultipleAttributeTextInsertToDomNode(text, attributes);
}
final keyToTag = { final keyToTag = {
AppFlowyRichTextKeys.bold: HTMLTags.strong, AppFlowyRichTextKeys.bold: HTMLTags.strong,
@ -126,8 +130,9 @@ class DeltaHTMLEncoder extends Converter<Delta, List<dom.Node>> {
if (attributes.bold) { if (attributes.bold) {
cssMap['font-weight'] = 'bold'; cssMap['font-weight'] = 'bold';
} }
if (attributes.underline && attributes.strikethrough) {
if (attributes.underline) { cssMap['text-decoration'] = 'underline line-through';
} else if (attributes.underline) {
cssMap['text-decoration'] = 'underline'; cssMap['text-decoration'] = 'underline';
} else if (attributes.strikethrough) { } else if (attributes.strikethrough) {
cssMap['text-decoration'] = 'line-through'; cssMap['text-decoration'] = 'line-through';

View file

@ -113,5 +113,139 @@ void main() async {
"<p><strong>Welcome to AppFlowy</strong></p>", "<p><strong>Welcome to AppFlowy</strong></p>",
); );
}); });
test('underline', () {
final node = paragraphNode(
attributes: {
'delta': (Delta()
..insert(
text,
attributes: {
'underline': true,
},
))
.toJson(),
},
);
expect(
const HTMLTextNodeParser()
.transformNodeToHTMLString(node, encodeParsers: parser),
"<p><u>Welcome to AppFlowy</u></p>",
);
});
test('strikethrough', () {
final node = paragraphNode(
attributes: {
'delta': (Delta()
..insert(
text,
attributes: {
'strikethrough': true,
},
))
.toJson(),
},
);
expect(
const HTMLTextNodeParser()
.transformNodeToHTMLString(node, encodeParsers: parser),
"<p><del>Welcome to AppFlowy</del></p>",
);
});
test('underline and strikethrough', () {
final node = paragraphNode(
attributes: {
'delta': (Delta()
..insert(
text,
attributes: {
'strikethrough': true,
'underline': true,
},
))
.toJson(),
},
);
expect(
const HTMLTextNodeParser()
.transformNodeToHTMLString(node, encodeParsers: parser),
'''<p><span style="text-decoration: underline line-through">Welcome to AppFlowy</span></p>''',
);
});
test('multiple attributes Test with background and text color', () {
final node = paragraphNode(
attributes: {
'delta': (Delta()
..insert(
text,
attributes: {
'bold': true,
'italic': true,
"underline": true,
"strikethrough": true,
"bg_color": "0x6000bcf0",
"font_color": "0xff2196f3",
},
))
.toJson(),
},
);
expect(
const HTMLTextNodeParser()
.transformNodeToHTMLString(node, encodeParsers: parser),
'''<p><span style="font-weight: bold; text-decoration: underline line-through; font-style: italic; background-color: rgba(0, 188, 240, 96); color: rgba(33, 150, 243, 255)">Welcome to AppFlowy</span></p>''',
);
});
test('multiple attributes Test with background', () {
final node = paragraphNode(
attributes: {
'delta': (Delta()
..insert(
text,
attributes: {
'bold': true,
'italic': true,
"underline": true,
"strikethrough": true,
"bg_color": "0x6000bcf0",
},
))
.toJson(),
},
);
expect(
const HTMLTextNodeParser()
.transformNodeToHTMLString(node, encodeParsers: parser),
'''<p><span style="font-weight: bold; text-decoration: underline line-through; font-style: italic; background-color: rgba(0, 188, 240, 96)">Welcome to AppFlowy</span></p>''',
);
});
test('multiple attributes Test with text color', () {
final node = paragraphNode(
attributes: {
'delta': (Delta()
..insert(
text,
attributes: {
'bold': true,
'italic': true,
"underline": true,
"strikethrough": true,
"font_color": "0xff2196f3",
},
))
.toJson(),
},
);
expect(
const HTMLTextNodeParser()
.transformNodeToHTMLString(node, encodeParsers: parser),
'''<p><span style="font-weight: bold; text-decoration: underline line-through; font-style: italic; color: rgba(33, 150, 243, 255)">Welcome to AppFlowy</span></p>''',
);
});
}); });
} }