feat(buttonMoveIconsIconProp rule): transform to self closing tag

patternfly · Jul 31, 2024 · aa5d7e3 · aa5d7e3
1 parent 578475a
commit aa5d7e3
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 8 deletions.
diff --git a/...lugin-pf-codemods/src/rules/v6/buttonMoveIconsIconProp/button-moveIcons-icon-prop.test.ts b/...lugin-pf-codemods/src/rules/v6/buttonMoveIconsIconProp/button-moveIcons-icon-prop.test.ts
@@ -13,7 +13,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
   invalid: [
     {
       code: `import { Button } from '@patternfly/react-core'; const icon = <span>Some icon</span>; <Button variant="plain">{icon}</Button>`,
-      output: `import { Button } from '@patternfly/react-core'; const icon = <span>Some icon</span>; <Button icon={icon} variant="plain"></Button>`,
+      output: `import { Button } from '@patternfly/react-core'; const icon = <span>Some icon</span>; <Button icon={icon} variant="plain" />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,
@@ -23,7 +23,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
     },
     {
       code: `import { Button } from '@patternfly/react-core'; <Button variant="plain"><span>Some icon</span></Button>`,
-      output: `import { Button } from '@patternfly/react-core'; <Button icon={<span>Some icon</span>} variant="plain"></Button>`,
+      output: `import { Button } from '@patternfly/react-core'; <Button icon={<span>Some icon</span>} variant="plain" />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,
@@ -33,7 +33,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
     },
     {
       code: `import { Button, ButtonVariant } from '@patternfly/react-core'; <Button variant={ButtonVariant.plain}><span>Some icon</span></Button>`,
-      output: `import { Button, ButtonVariant } from '@patternfly/react-core'; <Button icon={<span>Some icon</span>} variant={ButtonVariant.plain}></Button>`,
+      output: `import { Button, ButtonVariant } from '@patternfly/react-core'; <Button icon={<span>Some icon</span>} variant={ButtonVariant.plain} />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,
@@ -43,7 +43,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
     },
     {
       code: `import { Button as CustomThing } from '@patternfly/react-core'; <CustomThing variant="plain"><span>Some icon</span></CustomThing>`,
-      output: `import { Button as CustomThing } from '@patternfly/react-core'; <CustomThing icon={<span>Some icon</span>} variant="plain"></CustomThing>`,
+      output: `import { Button as CustomThing } from '@patternfly/react-core'; <CustomThing icon={<span>Some icon</span>} variant="plain" />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,
@@ -53,7 +53,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
     },
     {
       code: `import { Button } from '@patternfly/react-core/dist/esm/components/Button/index.js'; <Button variant="plain"><span>Some icon</span></Button>`,
-      output: `import { Button } from '@patternfly/react-core/dist/esm/components/Button/index.js'; <Button icon={<span>Some icon</span>} variant="plain"></Button>`,
+      output: `import { Button } from '@patternfly/react-core/dist/esm/components/Button/index.js'; <Button icon={<span>Some icon</span>} variant="plain" />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,
@@ -63,7 +63,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
     },
     {
       code: `import { Button } from '@patternfly/react-core/dist/js/components/Button/index.js'; <Button variant="plain"><span>Some icon</span></Button>`,
-      output: `import { Button } from '@patternfly/react-core/dist/js/components/Button/index.js'; <Button icon={<span>Some icon</span>} variant="plain"></Button>`,
+      output: `import { Button } from '@patternfly/react-core/dist/js/components/Button/index.js'; <Button icon={<span>Some icon</span>} variant="plain" />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,
@@ -73,7 +73,7 @@ ruleTester.run("button-moveIcons-icon-prop", rule, {
     },
     {
       code: `import { Button } from '@patternfly/react-core/dist/dynamic/components/Button/index.js'; <Button variant="plain"><span>Some icon</span></Button>`,
-      output: `import { Button } from '@patternfly/react-core/dist/dynamic/components/Button/index.js'; <Button icon={<span>Some icon</span>} variant="plain"></Button>`,
+      output: `import { Button } from '@patternfly/react-core/dist/dynamic/components/Button/index.js'; <Button icon={<span>Some icon</span>} variant="plain" />`,
       errors: [
         {
           message: `Icons must now be passed to the \`icon\` prop of Button instead of as children. If you are passing anything other than an icon as children, ignore this rule when running fixes.`,

diff --git a/...int-plugin-pf-codemods/src/rules/v6/buttonMoveIconsIconProp/button-moveIcons-icon-prop.ts b/...int-plugin-pf-codemods/src/rules/v6/buttonMoveIconsIconProp/button-moveIcons-icon-prop.ts
@@ -87,6 +87,18 @@ module.exports = {
                         fixes.push(fixer.replaceText(child, ""))
                     );
                   }
+
+                  if (node.closingElement) {
+                    const closingSymbol = context
+                      .getSourceCode()
+                      .getLastToken(node.openingElement)!;
+
+                    fixes.push(
+                      fixer.replaceText(closingSymbol, " />"),
+                      fixer.remove(node.closingElement)
+                    );
+                  }
+
                   return fixes;
                 },
               });

diff --git a/...plugin-pf-codemods/src/rules/v6/buttonMoveIconsIconProp/buttonMoveIconsIconPropOutput.tsx b/...plugin-pf-codemods/src/rules/v6/buttonMoveIconsIconProp/buttonMoveIconsIconPropOutput.tsx
@@ -1,5 +1,5 @@
 import { Button } from "@patternfly/react-core";
 
 export const ButtonMoveIconsIconPropInput = () => (
-  <Button icon={<span>Icon</span>} variant='plain'></Button>
+  <Button icon={<span>Icon</span>} variant="plain" />
 );