Wrong replacement - overflow-clip -> text-clip

[davidwebca]

Describe the bug According to this rule, the overflow-clip class existed before to provide text-clip functionality, but overflow-clip also exists properly in its own right now, so replacing it leads to errors.

https://github.com/francoismassart/eslint-plugin-tailwindcss/blob/master/docs/rules/migration-from-tailwind-2.md https://tailwindcss.com/docs/overflow

To Reproduce Steps to reproduce the behavior:

1. Add some HTML with fixing automatically on save enabled
2. Add overflow-clip
3. See how eslint replaces it to text-clip which is wrong

Expected behavior Don't replace overflow-clip anymore

Screenshots If applicable, add screenshots to help explain your problem.

Environment (please complete the following information):

• plugin version 3.13.0
• eslint version 8.54.0

[kachkaev]

Duplicate of https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/224

[DasOhmoff]

Hello. When will this issue be fixed?

[kachkaev]

@DasOhmoff feel free to create a PR with a fix. Issue https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/224 contains some additional details for you to get started.

[Esensats]

Hello. When will this issue be fixed?

For now I used patch-package to patch eslint-plugin-tailwindcss@3.17.0 for the project I'm working on. Currently I don't have enough time to open a full on PR.

Here is the diff that solved my problem:

diff --git a/node_modules/eslint-plugin-tailwindcss/lib/rules/migration-from-tailwind-2.js b/node_modules/eslint-plugin-tailwindcss/lib/rules/migration-from-tailwind-2.js
index 5de0f0f..01d3a2e 100644
--- a/node_modules/eslint-plugin-tailwindcss/lib/rules/migration-from-tailwind-2.js
+++ b/node_modules/eslint-plugin-tailwindcss/lib/rules/migration-from-tailwind-2.js
@@ -168,9 +168,9 @@ module.exports = {
           notNeeded.push(cls);
           return false;
         }
-        let overflowRes = /^overflow\-(?<value>clip|ellipsis)$/i.exec(suffix);
+        let overflowRes = /^overflow\-(?<value>ellipsis)$/i.exec(suffix);
         if (overflowRes && overflowRes.groups && overflowRes.groups.value) {
-          outdated.push([cls, cls.replace(/overflow\-(clip|ellipsis)$/i, `text-${overflowRes.groups.value}`)]);
+          outdated.push([cls, cls.replace(/overflow\-(ellipsis)$/i, `text-${overflowRes.groups.value}`)]);
         }
         let growShrinkRes = /flex\-(?<prop>grow|shrink)(\-(?<value>${flexVal}))?/i.exec(suffix);
         if (growShrinkRes && growShrinkRes.groups && growShrinkRes.groups.prop) {

It no longer complains about overflow-clip, while still complaining about overflow-ellipsis.