Fixed mergeAttributes utility for correct merge of inline styles

[lyohaplotinka]

Changes Overview

The style attribute merge does not work correctly in some cases. For example, if the inline style contains a link to a background image, a simple colon split of the string is not suitable for splitting the string into keys and values. This results in invalid styles.

I've updated the test for the mergeAttributes utility, it clearly shows which cases will not work correctly.

Implementation Approach

The styles property key is obtained by the first colon index, anything after it is considered a value. Only non-empty keys and values are included in the result.

Testing Done

Updated the test for the mergeAttributes utility, added several cases to check for corrupted styles, as well as styles with background images and font families.

Verification Steps

The problem is noticeable when adding custom attributes based on styles. In my work, I need to preserve styles from the input HTML as much as possible, since I'm working on a visual email editor.

Checklist

• [x] I have created a changeset for this PR if necessary.
• [x] My changes do not break the library.
• [x] I have added tests where applicable.
• [x] I have followed the project guidelines.
• [x] I have fixed any lint issues.

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 630440003dee4f07e082a578fc8d8c7e5b972b37

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 54 packages

Name	Type
@tiptap/core	Patch
@tiptap/extension-blockquote	Patch
@tiptap/extension-bold	Patch
@tiptap/extension-bubble-menu	Patch
@tiptap/extension-bullet-list	Patch
@tiptap/extension-character-count	Patch
@tiptap/extension-code-block-lowlight	Patch
@tiptap/extension-code-block	Patch
@tiptap/extension-code	Patch
@tiptap/extension-collaboration-cursor	Patch
@tiptap/extension-collaboration	Patch
@tiptap/extension-color	Patch
@tiptap/extension-document	Patch
@tiptap/extension-dropcursor	Patch
@tiptap/extension-floating-menu	Patch
@tiptap/extension-focus	Patch
@tiptap/extension-font-family	Patch
@tiptap/extension-gapcursor	Patch
@tiptap/extension-hard-break	Patch
@tiptap/extension-heading	Patch
@tiptap/extension-highlight	Patch
@tiptap/extension-history	Patch
@tiptap/extension-horizontal-rule	Patch
@tiptap/extension-image	Patch
@tiptap/extension-italic	Patch
@tiptap/extension-link	Patch
@tiptap/extension-list-item	Patch
@tiptap/extension-list-keymap	Patch
@tiptap/extension-mention	Patch
@tiptap/extension-ordered-list	Patch
@tiptap/extension-paragraph	Patch
@tiptap/extension-placeholder	Patch
@tiptap/extension-strike	Patch
@tiptap/extension-subscript	Patch
@tiptap/extension-superscript	Patch
@tiptap/extension-table-cell	Patch
@tiptap/extension-table-header	Patch
@tiptap/extension-table-row	Patch
@tiptap/extension-table	Patch
@tiptap/extension-task-item	Patch
@tiptap/extension-task-list	Patch
@tiptap/extension-text-align	Patch
@tiptap/extension-text-style	Patch
@tiptap/extension-text	Patch
@tiptap/extension-typography	Patch
@tiptap/extension-underline	Patch
@tiptap/extension-youtube	Patch
@tiptap/html	Patch
@tiptap/react	Patch
@tiptap/starter-kit	Patch
@tiptap/suggestion	Patch
@tiptap/vue-2	Patch
@tiptap/vue-3	Patch
@tiptap/pm	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[netlify[bot]]

✅ Deploy Preview for tiptap-embed ready!

Name	Link
🔨 Latest commit	630440003dee4f07e082a578fc8d8c7e5b972b37
🔍 Latest deploy log	https://app.netlify.com/projects/tiptap-embed/deploys/6842e3253451410008c5e3ad
😎 Deploy Preview	https://deploy-preview-6283--tiptap-embed.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[bdbch]

@lyohaplotinka could you rebase this to the current develop branch as we released V3, deprecating the next branch & would need to update most of our PR's anyway? Thanks a lot!

[lyohaplotinka]

@bdbch of course I will. I'd like to see it in 2.x though, as I use it in a project and am unlikely to upgrade anytime soon. Is that possible?

[bdbch]

@lyohaplotinka we could merge it backwards to the v2 branch and make a release if needed

[lyohaplotinka]

@bdbch that would be great, thanks a lot

[bdbch]

Link me the new PR here - I'll take a look and will back-merge it to V2.