Merge pull request #44 from contentstack/next

Next to Master

Author: harshithad0703

CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## [1.3.1](https://github.com/contentstack/contentstack-utils-javascript/tree/v1.3.1) (2023-12-13)
+ - Text level rendering suppport
+ - Dependencies update
+ - Multiple array support
+
 ## [1.1.0](https://github.com/contentstack/contentstack-utils-javascript/tree/v1.1.0) (2021-10-19)
  - Live preview edit tags support added
 

README.md

@@ -1,8 +1,3 @@
-![Coverage statements](./badges/badge-statements.svg?raw=true)
-![Coverage branches](./badges/badge-branches.svg)
-![Coverage functions](./badges/badge-functions.svg)
-![Coverage lines](./badges/badge-lines.svg)
-
 # Contentstack JavaScript Utils SDK:
 
 Contentstack is a headless CMS with an API-first approach. It is a CMS that developers can use to build powerful cross-platform applications in their favorite languages. Build your application frontend, and Contentstack will take care of the rest. Read More.

__test__/attributes-to-string.test.ts

@@ -27,7 +27,7 @@ describe('Attributes to String', () => {
 
         const resultString = attributeToString(attr)
 
-        expect(resultString).toEqual(' display-type="display" asset-uid="asset_uid_1" content-type-uid="sys_assets" asset-link="https://image.url/11.jpg" asset-name="11.jpg" asset-type="image/jpeg" type="asset" class-name="embedded-asset" width="25.16914749661705" className="dsd" id="sdf"')
+        expect(resultString).toEqual(' display-type="display" asset-uid="asset_uid_1" content-type-uid="sys_assets" asset-link="https://image.url/11.jpg" asset-name="11.jpg" asset-type="image/jpeg" type="asset" class-name="embedded-asset" width="25.16914749661705" className="classname" id="img_id"')
         done()
     })
 

__test__/default-options.test.ts

@@ -4,6 +4,7 @@ import { entryContentBlank, entryContentURL, entryContentTitle, entryContentTitl
 import { RenderItem } from '../src/options/index';
 import { assetContentBlank, 
     assetContentUrl,
+    assetContentWithoutTitleAndUID,
     assetContentonlyFileName, 
     assetContentonlyFileNameAndURL, 
     assetContentonlyTitle, 
@@ -93,6 +94,11 @@ describe('Default Option test', () => {
         done()
     })
 
+    it('Default options Asset with uid, url and filename test', done => {
+        expect(assetDownloadFunction(assetContentWithoutTitleAndUID, embedAttributes)).toEqual(`<a href="${assetContentWithoutTitleAndUID.url}">${assetContentWithoutTitleAndUID.system.content_type_uid}</a>`)
+        done()
+    })
+
     it('Default options Link text test', done => {
         expect(entryLinkFunction(entryContentURL, embedAttributesText)).toEqual(`<a href="${entryContentURL.url}">${linkText}</a>`)
         expect(entryLinkFunction(entryContentTitle, embedAttributesText)).toEqual(`<a href="undefined">${linkText}</a>`)

__test__/json-to-html.test.ts

@@ -20,7 +20,12 @@ import {
     plainTextJson,
     styleinPJson,
     tableJson,
-    unorderListJson} from './mock/json-element-mock'
+    unorderListJson,
+    entryJsonRteWithClass,
+    entryJsonRteWithId,
+    entryJsonRteWithIdinAttrs, 
+    jsonRteClassAndIdAttrs, 
+    styleObj} from './mock/json-element-mock'
 import {
     blockquoteHtml,
     codeHtml,
@@ -38,7 +43,12 @@ import {
     plainTextHtml, 
     styleinPHtml, 
     tableHtml, 
-    unorderListHtml} from './mock/json-element-mock-result'
+    unorderListHtml,
+    plainTextHtmlWithClass,
+    plainTextHtmlWithId,
+    htmlTextIdInAttrs,
+    classAndIdAttrsHtml,
+    styleObjHtml } from './mock/json-element-mock-result'
 describe('Node parser paragraph content', () => {
     it('Should accept proper values', done => {
         const entry = { uid: 'uid'}
@@ -167,10 +177,23 @@ describe('Node parse text Content', () => {
         const paths = ['supercharged_rte']
 
         jsonToHTML({ entry, paths})
-
         expect(entry.supercharged_rte).toEqual([plainTextHtml])
         done()
     })
+    it('Should return html text with classname', done => {
+        const entry = entryJsonRteWithClass
+        const paths = ['json_rte']
+        jsonToHTML({ entry: entry, paths })
+        expect(entry.json_rte).toEqual(plainTextHtmlWithClass)
+        done()
+    })
+    it('Should return html text with id', done => {
+        const entry = entryJsonRteWithId
+        const paths = ['json_rte']
+        jsonToHTML({ entry: entry, paths })
+        expect(entry.json_rte).toEqual(plainTextHtmlWithId)
+        done()
+    })
 })
 
 describe('Node parse headers content', () => {
@@ -513,4 +536,44 @@ describe('Node parse style attribute', () => {
         expect(entry.supercharged_rte).toEqual(styleinPHtml)
         done()
     })
+    it('Should return style attribute in headings tag content', done => {
+        const entry = styleObj
+        const paths = ['json_rte']
+
+        jsonToHTML({ entry, paths})
+
+        expect(entry.json_rte).toEqual(styleObjHtml)
+        done()
+    })
 })
+
+describe('Node parse json_rte Content', () => {
+    it('Should return html text with classname', done => {
+        const entry = entryJsonRteWithClass
+        const paths = ['json_rte']
+        jsonToHTML({ entry: entry, paths })
+        expect(entry.json_rte).toEqual(plainTextHtmlWithClass)
+        done()
+    })
+    it('Should return html text with id', done => {
+        const entry = entryJsonRteWithId
+        const paths = ['json_rte']
+        jsonToHTML({ entry: entry, paths })
+        expect(entry.json_rte).toEqual(plainTextHtmlWithId)
+        done()
+    })
+    it('Should return html text with id in parent tag', done => {
+        const entry = entryJsonRteWithIdinAttrs
+        const paths = ['json_rte']
+        jsonToHTML({ entry: entry, paths })
+        expect(entry.json_rte).toEqual(htmlTextIdInAttrs)
+        done()
+    })
+    it('Should return html text with class and id in parent tag', done => {
+        const entry = jsonRteClassAndIdAttrs
+        const paths = ['json_rte']
+        jsonToHTML({ entry: entry, paths })
+        expect(entry.json_rte).toEqual(classAndIdAttrsHtml)
+        done()
+    })
+})

__test__/mock/asset-mock.ts

@@ -33,4 +33,13 @@ export const assetContentonlyTitleAndUrl = {
     title: "title",
     url: "url",
     _content_type_uid: 'sys_assets'
+}
+
+export const assetContentWithoutTitleAndUID = {
+    url: "url",
+    _content_type_uid: 'sys_assets',
+    system: {
+        uid: 'sys_uid',
+        content_type_uid: 'ct_uid'
+    }
 }

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

@@ -6,16 +6,20 @@ const h3Html = "<h3><strong><em><u><sub>Mauris venenatis dui id massa sollicitud
 const h4Html = "<h4><strong><em><u><sub>MaNullam feugiat turpis quis elit interdum, vitae laoreet quam viverra</sub></u></em></strong></h4>"
 const h5Html = "<h5>Mauris venenatis dui id massa sollicitudin, non bibendum nunc dictum.</h5>"
 const h6Html = "<h6>Nunc porta diam vitae purus semper, ut consequat lorem vehicula.</h6>"
-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>"
-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>"
+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>"
+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>"
 const imgHtml = "<img src=\"https://image.url/Donald.jog.png\" />"
 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>"
 const blockquoteHtml = "<blockquote>Praesent eu ex sed nibh venenatis pretium.</blockquote>"
 const codeHtml = "<code>Code template.</code>"
 const linkInPHtml = "<strong><em><u><sub></sub></u></em></strong><a href=\"LINK.com\">LINK</a>"
 const linkInPURLHtml = "<strong><em><u><sub></sub></u></em></strong><a href=\"LINK.com\" target=\"_blank\">LINK</a>"
 const styleinPHtml = "<p style=\"text-align:right;\">This is <span>second</span> <u>JSON</u> entry</p><p style=\"text-align:left;\"><a href=\"example.com\" target=\"_blank\">Example</a></p>"
-
+const plainTextHtmlWithClass = "<p class=\"class_p\"><span class=\"yellow\">abc</span><u><span class=\"blue\">ghi</span></u><strong><em><u><span class=\"orange\" id=\"blue\">Basic</span></u></em></strong><h1><span class=\"purple\">abc</span></h1></p>"
+const plainTextHtmlWithId = "<p class=\"class_p\"><em><u><span id=\"blue\">data</span></u></em></p>"
+const htmlTextIdInAttrs = "<p id=\"id_p\"><em><u>data</u></em></p>"
+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>"
+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>"
 export {
     h1Html,
     h2Html,
@@ -34,4 +38,9 @@ export {
     blockquoteHtml,
     unorderListHtml,
     styleinPHtml,
+    plainTextHtmlWithClass,
+    plainTextHtmlWithId,
+    htmlTextIdInAttrs,
+    classAndIdAttrsHtml,
+    styleObjHtml
 }