grapesjs icon indicating copy to clipboard operation
grapesjs copied to clipboard

Updated Selector escapeName to accommodate special characters used in tailwind class names

Open bernesto opened this issue 11 months ago • 3 comments

Tailwind class names use the special characters [, ], (, ), ., %, @, :, /, and +. Several of these were missing from the regex that escapes class names, thereby breaking Taliwind support.

bernesto avatar Mar 04 '24 22:03 bernesto

Added checks for comment processing that cause errors outlined in https://github.com/GrapesJS/grapesjs/issues/5720

bernesto avatar Mar 06 '24 02:03 bernesto

Are there any updates on this? Currently running into the same problem where my Tailwind classes are being escaped incorrectly.

Yorgv avatar May 14 '24 11:05 Yorgv

Also, I noticed this fix doesn't account for classes with a hex color. For example, the class border-[#E9DECC] will still be converted to border-[-E9DECC] after this fix. So I think # also needs to be added to the regex.

Yorgv avatar May 14 '24 13:05 Yorgv

I haven't had time to write the tests to commit this pull. On another project right now. Probably won't until the week after next.

bernesto avatar May 16 '24 20:05 bernesto

I haven't had time to write the tests to commit this pull. On another project right now. Probably won't until the week after next.

Totally understandable, thanks for your efforts!

Yorgv avatar May 17 '24 18:05 Yorgv

Added the missing # + tests

artf avatar May 23 '24 16:05 artf

Thank you!

bernesto avatar May 23 '24 16:05 bernesto