@@ -4,6 +4,7 @@ import { JSDOM } from "jsdom"
44import isEqual from "lodash.isequal"
55import omitdeep from "omit-deep-lodash"
66import expectedValue from "./expectedJson"
7+ import { IHtmlToJsonOptions } from "../src/types"
78
89const docWrapper = ( children : any ) => {
910 return {
@@ -241,7 +242,7 @@ describe("Testing html to json conversion", () => {
241242
242243 test ( "should not convert stringify attrs when `allowNonStandardTags` is not true" , ( ) => {
243244 const html = `<p><span from="Paul, Addy" to="[object Object]">Hi There!</span></p>` ;
244- const json = { "attrs" : { } , "children" : [ { "attrs" : { } , "children" : [ { "attrs" : { "redactor-attributes" : { "from" : "Paul, Addy" , "to" : "[object Object]" } , "style" : { } } , "children" : [ { "attrs" : { "style" : { } } , " text""Hi There!" } ] , "type" : "span" , "uid" : "uid" } ] , "type" : "p" , "uid" : "uid" } ] , "type" : "doc" , "uid" : "uid" } ;
245+ const json = { "attrs" : { } , "children" : [ { "attrs" : { } , "children" : [ { "attrs" : { "redactor-attributes" : { "from" : "Paul, Addy" , "to" : "[object Object]" } , "style" : { } } , "children" : [ { "text" : "Hi There!" } ] , "type" : "span" , "uid" : "uid" } ] , "type" : "p" , "uid" : "uid" } ] , "type" : "doc" , "uid" : "uid" } ;
245246
246247 const dom = new JSDOM ( html ) ;
247248 let htmlDoc = dom . window . document . querySelector ( "body" ) ;
@@ -250,6 +251,50 @@ describe("Testing html to json conversion", () => {
250251 } ) ;
251252 } )
252253
254+ describe ( "SPAN" , ( ) => {
255+
256+ test ( "should properly convert inline properties id and class to json" , ( ) => {
257+ let html = `<p dir="ltr">Hello <span class="class" id="id">World</span></p>`
258+ const json = htmlToJson ( html )
259+ expect ( json ) . toStrictEqual ( { "type" :"doc" , "uid" :"uid" , "attrs" :{ } , "children" :[ { "type" :"p" , "attrs" :{ "style" :{ } , "redactor-attributes" :{ "dir" :"ltr" } } , "uid" :"uid" , "children" :[ { "text" :"Hello " } , { "text" :"World" , "id" :"id" , "classname" :"class" } ] } ] } )
260+ } )
261+
262+ test ( "should skip span if other element are inline and it does not have any attributes" , ( ) => {
263+ let html = `<p dir="ltr">Hello <span>World</span></p>`
264+ const json = htmlToJson ( html )
265+ expect ( json ) . toStrictEqual ( { "type" :"doc" , "uid" :"uid" , "attrs" :{ } , "children" :[ { "type" :"p" , "attrs" :{ "style" :{ } , "redactor-attributes" :{ "dir" :"ltr" } } , "uid" :"uid" , "children" :[ { "text" :"Hello " } , { "text" :"World" } ] } ] } )
266+ } )
267+
268+ test ( "should not skip span if other element are inline and it does have any attribute" , ( ) => {
269+ let html = `<p dir="ltr">Hello <span data-test="test">World</span></p>`
270+ const json = htmlToJson ( html )
271+ expect ( json ) . toStrictEqual ( { "type" :"doc" , "uid" :"uid" , "attrs" :{ } , "children" :[ { "type" :"p" , "attrs" :{ "style" :{ } , "redactor-attributes" :{ "dir" :"ltr" } } , "uid" :"uid" , "children" :[ { "text" :"Hello " } , { "type" :"span" , "attrs" :{ "style" :{ } , "redactor-attributes" :{ "data-test" :"test" } } , "uid" :"uid" , "children" :[ { "text" :"World" } ] } ] } ] } )
272+ } )
273+
274+ test ( "should consider the non standard elements as inline if it has attribute of inline with the span tag" , ( ) => {
275+ let html = `<p><unknown inline="true"></unknown>Being an absolute <span>tropical</span> stunner</p>`
276+ let jsonValue = htmlToJson ( html , { allowNonStandardTags : true } )
277+ expect ( jsonValue ) . toStrictEqual ( { "type" :"doc" , "uid" :"uid" , "attrs" :{ } , "children" :[ { "type" :"p" , "attrs" :{ } , "uid" :"uid" , "children" :[ { "type" :"unknown" , "attrs" :{ "inline" :"true" } , "children" :[ { "text" :"" } ] } , { "text" :"Being an absolute " } , { "text" :"tropical" } , { "text" :" stunner" } ] } ] } )
278+ } )
279+ } )
280+
281+ test ( "should consider the non standard elements as inline if it has attribute of inline" , ( ) => {
282+ let html = `<p><unknown inline="true"></unknown>Being an absolute <a href="https://chess.com">tropical</a> stunner</p>`
283+ let jsonValue = htmlToJson ( html , { allowNonStandardTags : true } )
284+ expect ( jsonValue ) . toStrictEqual ( { "type" :"doc" , "uid" :"uid" , "attrs" :{ } , "children" :[ { "type" :"p" , "attrs" :{ } , "uid" :"uid" , "children" :[ { "type" :"unknown" , "attrs" :{ "inline" :"true" } , "children" :[ { "text" :"" } ] } , { "text" :"Being an absolute " } , { "type" :"a" , "attrs" :{ "url" :"https://chess.com" , "style" :{ } , "redactor-attributes" :{ "href" :"https://chess.com" } } , "uid" :"uid" , "children" :[ { "text" :"tropical" } ] } , { "text" :" stunner" } ] } ] } )
285+ } )
286+
287+
288+ test ( "should convert asset to reference" , ( ) => {
289+ const html = `<figure style="margin: 0; text-align: right">
290+ <div style="display: inline-block"><a href="ss.com" target="_blank"><img src="***REMOVED***200" height="141" alt="image_(9).png" caption="ss" anchorLink="ss.com" class="embedded-asset" content-type-uid="sys_assets" type="asset" asset-alt="image_(9).png" width="148" max-height="141" max-width="148" style="max-height: 141px; height: 141px; text-align: right; max-width: 148px; width: auto" data-sys-asset-filelink="***REMOVED***200" data-sys-asset-uid="blt137d845621ef8168" data-sys-asset-filename="image_(9).png" data-sys-asset-contenttype="image/png" data-sys-asset-caption="ss" data-sys-asset-alt="image_(9).png" data-sys-asset-link="ss.com" data-sys-asset-position="right" data-sys-asset-isnewtab="true" sys-style-type="display" /></a>
291+ <figcaption style="text-align:center">ss</figcaption>
292+ </div>
293+ </figure>
294+ <p></p>`
295+ const json = htmlToJson ( html )
296+ expect ( json ) . toStrictEqual ( { "type" :"doc" , "uid" :"uid" , "attrs" :{ } , "children" :[ { "type" :"reference" , "attrs" :{ "style" :{ "text-align" :"right" } , "redactor-attributes" :{ "src" :"***REMOVED***200" , "height" :"141" , "alt" :"image_(9).png" , "caption" :"ss" , "type" :"asset" , "asset-alt" :"image_(9).png" , "max-height" :"141" , "max-width" :"148" , "sys-style-type" :"display" , "position" :"right" , "captionAttrs" :{ "style" :"text-align:center" } , "anchorLink" :"ss.com" , "target" :true , "asset-caption" :"ss" } , "class-name" :"embedded-asset" , "width" :148 , "type" :"asset" , "asset-caption" :"ss" , "link" :"ss.com" , "asset-alt" :"image_(9).png" , "target" :"_blank" , "position" :"right" , "asset-link" :"***REMOVED***200" , "asset-uid" :"blt137d845621ef8168" , "display-type" :"display" , "asset-name" :"image_(9).png" , "asset-type" :"image/png" , "content-type-uid" :"sys_assets" } , "uid" :"uid" , "children" :[ { "text" :"" } ] } , { "type" :"p" , "attrs" :{ } , "uid" :"uid" , "children" :[ { "text" :"" } ] } ] } )
297+ } )
253298} )
254299
255300
@@ -327,9 +372,14 @@ describe("CS-41001", () =>{
327372 } )
328373} )
329374
330- function htmlToJson ( html , options ) {
375+
376+
377+
378+
379+ function htmlToJson ( html : string , options : IHtmlToJsonOptions ) {
331380 const dom = new JSDOM ( html ) ;
332381 let htmlDoc = dom . window . document . querySelector ( "body" ) ;
333382 return fromRedactor ( htmlDoc , options ) ;
334383
335- }
384+ }
385+
0 commit comments