Overlapping styles and entities in convertToHTML not working when intersecting no style

I just noticed the release of #43 which is super cool. Unfortunately, it does not work for intersections situations, which is problematic.

Here is my code:

convertToHTML({
    blockToHTML: { // I put this here to have <div> in my output instead of <p>
        unstyled: {
            start: '<div>',
            end: '</div>',
            empty: '<br>',
        }
    },
    entityToHTML: (entity, originalText) => {
        if (entity.type === 'link') {
            return {
                start: `<a href="${entity.data.url}" target="_blank">`,
                end: '</a>',
            }
        }
        return originalText
    }
})(contentState)

Overlapping styles

1. Add link

2. Add bold intersecting link

3. Result

<div>t<strong>e<</strong>a href="http://google.com" target="_blank">st test</a></div>

4. Render

Situation

1. Style strictly inside link ✅

2. Style over link ✅

3. Style outside link ✅

4. Style intersecting link 🔴

Intersect start

Result:

Code:

<div>t<strong>e<</strong>a href="http://google.com" target="_blank">st test te</a>st</div>

Intersect end

Result:

Code:

<div>te<a href="http://google.com" target="_blank">st test t<strong>e<</strong>/a>st</div>

[benbriggs]

Fix is landed in 1.4.6 - thanks so much for your help @liyantang!

[benbriggs]

closed via #57 🎉