Skip to content

Commit d0dbb53

Browse files
refactor: ♻️ removed add style attrs function and added styleobject to string
1 parent 3d1a9b7 commit d0dbb53

File tree

6 files changed

+158
-44
lines changed

6 files changed

+158
-44
lines changed

__test__/json-to-html.test.ts

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,8 @@ import {
2424
entryJsonRteWithClass,
2525
entryJsonRteWithId,
2626
entryJsonRteWithIdinAttrs,
27-
jsonRteClassAndIdAttrs } from './mock/json-element-mock'
27+
jsonRteClassAndIdAttrs,
28+
styleObj} from './mock/json-element-mock'
2829
import {
2930
blockquoteHtml,
3031
codeHtml,
@@ -46,7 +47,8 @@ import {
4647
plainTextHtmlWithClass,
4748
plainTextHtmlWithId,
4849
htmlTextIdInAttrs,
49-
classAndIdAttrsHtml } from './mock/json-element-mock-result'
50+
classAndIdAttrsHtml,
51+
styleObjHtml } from './mock/json-element-mock-result'
5052
describe('Node parser paragraph content', () => {
5153
it('Should accept proper values', done => {
5254
const entry = { uid: 'uid'}
@@ -534,6 +536,15 @@ describe('Node parse style attribute', () => {
534536
expect(entry.supercharged_rte).toEqual(styleinPHtml)
535537
done()
536538
})
539+
it('Should return style attribute in headings tag content', done => {
540+
const entry = styleObj
541+
const paths = ['json_rte']
542+
543+
jsonToHTML({ entry, paths})
544+
545+
expect(entry.json_rte).toEqual(styleObjHtml)
546+
done()
547+
})
537548
})
538549

539550
describe('Node parse json_rte Content', () => {

__test__/mock/json-element-mock-result.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ const h3Html = "<h3><strong><em><u><sub>Mauris venenatis dui id massa sollicitud
66
const h4Html = "<h4><strong><em><u><sub>MaNullam feugiat turpis quis elit interdum, vitae laoreet quam viverra</sub></u></em></strong></h4>"
77
const h5Html = "<h5>Mauris venenatis dui id massa sollicitudin, non bibendum nunc dictum.</h5>"
88
const h6Html = "<h6>Nunc porta diam vitae purus semper, ut consequat lorem vehicula.</h6>"
9-
const orderListHtml = "<ol><li style=\"text-align:justify;\">Morbi in quam molestie, fermentum diam vitae, bibendum ipsum.</li><li style=\"text-align:justify;\">Pellentesque mattis lacus in quam aliquam congue</li><li style=\"text-align:justify;\">Integer feugiat leo dignissim, lobortis enim vitae, mollis lectus.</li><li style=\"text-align:justify;\">Sed in ante lacinia, molestie metus eu, fringilla sapien.</li></ol>"
10-
const unorderListHtml = "<ul><li>Sed quis metus sed mi hendrerit mollis vel et odio.</li><li>Integer vitae sem dignissim, elementum libero vel, fringilla massa.</li><li>Integer imperdiet arcu sit amet tortor faucibus aliquet.</li><li>Aenean scelerisque velit vitae dui vehicula, at congue massa sagittis.</li></ul>"
9+
const orderListHtml = "<ol class=\"table\" id=\"table_id\"><li style=\"text-align:justify;\">Morbi in quam molestie, fermentum diam vitae, bibendum ipsum.</li><li style=\"text-align:justify;\">Pellentesque mattis lacus in quam aliquam congue</li><li style=\"text-align:justify;\">Integer feugiat leo dignissim, lobortis enim vitae, mollis lectus.</li><li style=\"text-align:justify;\">Sed in ante lacinia, molestie metus eu, fringilla sapien.</li></ol>"
10+
const unorderListHtml = "<ul class=\"table\" id=\"table_id\"><li>Sed quis metus sed mi hendrerit mollis vel et odio.</li><li>Integer vitae sem dignissim, elementum libero vel, fringilla massa.</li><li>Integer imperdiet arcu sit amet tortor faucibus aliquet.</li><li>Aenean scelerisque velit vitae dui vehicula, at congue massa sagittis.</li></ul>"
1111
const imgHtml = "<img src=\"https://image.url/Donald.jog.png\" />"
1212
const tableHtml = "<table><thead><tr><th><p>Header 1</p></th><th><p>Header 2</p></th></tr></thead><tbody><tr><td><p>Body row 1 data 1</p></td><td><p>Body row 1 data 2</p></td></tr><tr><td><p>Body row 2 data 1</p></td><td><p>Body row 2 data 2</p></td></tr></tbody></table>"
1313
const blockquoteHtml = "<blockquote>Praesent eu ex sed nibh venenatis pretium.</blockquote>"
@@ -19,6 +19,7 @@ const plainTextHtmlWithClass = "<p class=\"class_p\"><span class=\"yellow\">abc<
1919
const plainTextHtmlWithId = "<p class=\"class_p\"><em><u><span id=\"blue\">data</span></u></em></p>"
2020
const htmlTextIdInAttrs = "<p id=\"id_p\"><em><u>data</u></em></p>"
2121
const classAndIdAttrsHtml = "<a class=\"class_a\" id=\"id_p\" href=\"LINK.com\">link</a><img class=\"class_img\" id=\"id_img\" src=\"https://dummyImage.url/Donald.jog.png\" /><h1 class=\"class_h1\" id=\"id_h1\">heading1</h1><h2 class=\"class_h2\" id=\"id_h2\">heading2</h2><h3 class=\"class_h3\" id=\"id_h3\">heading3</h3><h4 class=\"class_h4\" id=\"id_h4\">heading4</h4><h5 class=\"class_h5\" id=\"id_h5\">heading5</h5><h6 class=\"class_h6\" id=\"id_h6\">heading6</h6>"
22+
const styleObjHtml = "<h1 style=\"text-align:justify;\">heading1</h1><h2 style=\"text-align:left;\">heading2</h2><h3 style=\"text-align:right;\">heading3</h3><h4 style=\"text-align:justify;\">heading4</h4><h5 style=\"text-align:justify;\">heading5</h5><h6 style=\"text-align:justify;\">heading6</h6>"
2223
export {
2324
h1Html,
2425
h2Html,
@@ -40,5 +41,6 @@ export {
4041
plainTextHtmlWithClass,
4142
plainTextHtmlWithId,
4243
htmlTextIdInAttrs,
43-
classAndIdAttrsHtml
44+
classAndIdAttrsHtml,
45+
styleObjHtml
4446
}

__test__/mock/json-element-mock.ts

Lines changed: 96 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -260,7 +260,7 @@ const orderListJson = {
260260
}
261261
],
262262
"id": "7f413d448a",
263-
"attrs": {}
263+
"attrs": {class: "table", id: "table_id"}
264264
}
265265
],
266266
type: "doc"
@@ -317,7 +317,7 @@ const unorderListJson = {
317317
}
318318
],
319319
"id": "b083fa46ef899420ab19",
320-
"attrs": {}
320+
"attrs": {class: "table", id: "table_id"}
321321
}
322322
],
323323
type: "doc"
@@ -1270,6 +1270,98 @@ const jsonRteClassAndIdAttrs = {
12701270
}
12711271
}
12721272

1273+
const styleObj = {
1274+
"uid": "",
1275+
"_version": 3,
1276+
"locale": "en-us",
1277+
"json_rte": {
1278+
"type": "doc",
1279+
"attrs": {},
1280+
"uid": "",
1281+
"children": [
1282+
{
1283+
"type": "h1",
1284+
"attrs": {
1285+
"style": {
1286+
"text-align": "justify"
1287+
}},
1288+
"uid": "",
1289+
"children": [
1290+
{
1291+
"text": "heading1",
1292+
}
1293+
]
1294+
},
1295+
{
1296+
"type": "h2",
1297+
"attrs": {
1298+
"style": {
1299+
"text-align": "left"
1300+
}},
1301+
"uid": "",
1302+
"children": [
1303+
{
1304+
"text": "heading2",
1305+
}
1306+
]
1307+
},
1308+
{
1309+
"type": "h3",
1310+
"attrs": {
1311+
"style": {
1312+
"text-align": "right"
1313+
}},
1314+
"uid": "",
1315+
"children": [
1316+
{
1317+
"text": "heading3",
1318+
}
1319+
]
1320+
},
1321+
{
1322+
"type": "h4",
1323+
"attrs": {
1324+
"style": {
1325+
"text-align": "justify"
1326+
}},
1327+
"uid": "",
1328+
"children": [
1329+
{
1330+
"text": "heading4",
1331+
}
1332+
]
1333+
},
1334+
{
1335+
"type": "h5",
1336+
"attrs": {
1337+
"style": {
1338+
"text-align": "justify"
1339+
}},
1340+
"uid": "",
1341+
"children": [
1342+
{
1343+
"text": "heading5",
1344+
}
1345+
]
1346+
},
1347+
{
1348+
"type": "h6",
1349+
"attrs": {
1350+
"style": {
1351+
"text-align": "justify"
1352+
}},
1353+
"uid": "",
1354+
"children": [
1355+
{
1356+
"text": "heading6",
1357+
}
1358+
]
1359+
}
1360+
],
1361+
"_version": 3
1362+
}
1363+
}
1364+
12731365
export {
12741366
h1Json,
12751367
h2Json,
@@ -1300,5 +1392,6 @@ export {
13001392
entryJsonRteWithClass,
13011393
entryJsonRteWithId,
13021394
entryJsonRteWithIdinAttrs,
1303-
jsonRteClassAndIdAttrs
1395+
jsonRteClassAndIdAttrs,
1396+
styleObj
13041397
}

src/Models/metadata-model.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,10 @@ export interface Attributes {
1515
class?: string,
1616
id?: string,
1717
[key: string]: any,
18+
style?: styleObj | string,
1819
'sys-style-type'?: string,
1920
}
21+
export type styleObj = { [key: string]: any }
2022

2123
export interface EntryAttributes extends Attributes {
2224
'data-sys-entry-uid': string;

src/helper/enumerate-entries.ts

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { AnyNode } from "../json-to-html";
22
import { EmbeddedItem, EntryEmbedable } from "../Models/embedded-object";
3-
import { Metadata, nodeToMetadata } from "../Models/metadata-model";
3+
import { Metadata, nodeToMetadata, styleObj } from "../Models/metadata-model";
44
import MarkType from "../nodes/mark-type";
55
import TextNode from "../nodes/text-node";
66
import Node from '../nodes/node'
@@ -100,11 +100,29 @@ function nodeChildrenToHTML(nodes: AnyNode[],
100100
return nodes.map<string>((node: AnyNode) => nodeToHTML(node, renderOption, renderEmbed)).join('')
101101
}
102102

103+
function styleObjectToString(styleObj: styleObj): string {
104+
if (!styleObj) return '';
105+
if (typeof styleObj === 'string') {
106+
return styleObj;
107+
}
108+
let styleString: string = '';
109+
for (const key in styleObj) {
110+
if (styleObj.hasOwnProperty(key)) {
111+
const value = styleObj[key];
112+
styleString += `${key}:${value};`;
113+
}
114+
}
115+
return styleString;
116+
}
117+
103118
function nodeToHTML(
104119
node: AnyNode,
105120
renderOption: RenderOption,
106121
renderEmbed?: (metadata: Metadata) => EmbeddedItem | EntryNode,
107-
): string {
122+
): string {
123+
if (node?.attrs?.style){
124+
node.attrs.style = styleObjectToString(node.attrs.style as styleObj)
125+
}
108126
if (!node.type) {
109127
return textNodeToHTML(node as TextNode, renderOption)
110128
}else if ((node.type as string) === 'reference') {

0 commit comments

Comments
 (0)