refactor(lint/noConsoleLog): add code action (#1497)

CHANGELOG.md

@@ -28,6 +28,10 @@ Read our [guidelines for writing a good changelog entry](https://github.com/biom
 
 ### Linter
 
+#### Enhancements
+
+- Add an unsafe code fix for [noConsoleLog](https://biomejs.dev/linter/rules/no-console-log/).  Contributed by @vasucp1207
+
 #### Bug fixes
 
 - Fix [#1335](https://github.com/biomejs/biome/issues/1335). [noUselessFragments](https://biomejs.dev/linter/rules/no-useless-fragments/) now ignores code action on component props when the fragment is empty. Contributed by @vasucp1207

crates/biome_js_analyze/src/semantic_analyzers/suspicious/no_console_log.rs

@@ -1,8 +1,11 @@
-use crate::semantic_services::Semantic;
-use biome_analyze::{context::RuleContext, declare_rule, Rule, RuleDiagnostic};
+use crate::{semantic_services::Semantic, JsRuleAction};
+use biome_analyze::{
+    context::RuleContext, declare_rule, ActionCategory, FixKind, Rule, RuleDiagnostic,
+};
 use biome_console::markup;
+use biome_diagnostics::Applicability;
 use biome_js_syntax::{global_identifier, AnyJsMemberExpression, JsCallExpression};
-use biome_rowan::AstNode;
+use biome_rowan::{AstNode, BatchMutationExt};
 
 declare_rule! {
     /// Disallow the use of `console.log`
@@ -31,6 +34,7 @@ declare_rule! {
         version: "1.0.0",
         name: "noConsoleLog",
         recommended: false,
+        fix_kind: FixKind::Unsafe,
     }
 }
 
@@ -68,7 +72,24 @@ impl Rule for NoConsoleLog {
             )
             .note(markup! {
                 <Emphasis>"console.log"</Emphasis>" is usually a tool for debugging and you don't want to have that in production."
+            })
+            .note(markup! {
+                "If it is not for debugging purpose then using "<Emphasis>"console.info"</Emphasis>" might be more appropriate."
             }),
         )
     }
+
+    fn action(ctx: &RuleContext<Self>, _: &Self::State) -> Option<JsRuleAction> {
+        let call_expression = ctx.query();
+        let mut mutation = ctx.root().begin();
+
+        mutation.remove_node(call_expression.clone());
+
+        Some(JsRuleAction {
+            category: ActionCategory::QuickFix,
+            applicability: Applicability::MaybeIncorrect,
+            message: markup! { "Remove console.log" }.to_owned(),
+            mutation,
+        })
+    }
 }

crates/biome_js_analyze/tests/specs/suspicious/noConsoleLog/invalid.js.snap

@@ -10,7 +10,7 @@ console.log("something")
 
 # Diagnostics
 ```
-invalid.js:1:1 lint/suspicious/noConsoleLog ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+invalid.js:1:1 lint/suspicious/noConsoleLog  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
   ! Don't use console.log
   
@@ -20,6 +20,12 @@ invalid.js:1:1 lint/suspicious/noConsoleLog ━━━━━━━━━━━━
   
   i console.log is usually a tool for debugging and you don't want to have that in production.
   
+  i If it is not for debugging purpose then using console.info might be more appropriate.
+  
+  i Unsafe fix: Remove console.log
+  
+    1 │ console.log("something")
+      │ ------------------------
 
 ```
 

website/src/content/docs/internals/changelog.mdx

@@ -34,6 +34,10 @@ Read our [guidelines for writing a good changelog entry](https://github.com/biom
 
 ### Linter
 
+#### Enhancements
+
+- Add an unsafe code fix for [noConsoleLog](https://biomejs.dev/linter/rules/no-console-log/).  Contributed by @vasucp1207
+
 #### Bug fixes
 
 - Fix [#1335](https://github.com/biomejs/biome/issues/1335). [noUselessFragments](https://biomejs.dev/linter/rules/no-useless-fragments/) now ignores code action on component props when the fragment is empty. Contributed by @vasucp1207

website/src/content/docs/linter/rules/index.mdx

@@ -184,7 +184,7 @@ Rules that detect code that is likely to be incorrect or useless.
 | [noCompareNegZero](/linter/rules/no-compare-neg-zero) | Disallow comparing against <code>-0</code> | <span aria-label="Recommended" role="img" title="Recommended">✅ </span><span aria-label="The rule has a safe fix" role="img" title="The rule has a safe fix">🔧 </span> |
 | [noConfusingLabels](/linter/rules/no-confusing-labels) | Disallow labeled statements that are not loops. | <span aria-label="Recommended" role="img" title="Recommended">✅ </span> |
 | [noConfusingVoidType](/linter/rules/no-confusing-void-type) | Disallow <code>void</code> type outside of generic or return types. | <span aria-label="Recommended" role="img" title="Recommended">✅ </span> |
-| [noConsoleLog](/linter/rules/no-console-log) | Disallow the use of <code>console.log</code> |  |
+| [noConsoleLog](/linter/rules/no-console-log) | Disallow the use of <code>console.log</code> | <span aria-label="The rule has an unsafe fix" role="img" title="The rule has an unsafe fix">⚠️ </span> |
 | [noConstEnum](/linter/rules/no-const-enum) | Disallow TypeScript <code>const enum</code> | <span aria-label="Recommended" role="img" title="Recommended">✅ </span><span aria-label="The rule has a safe fix" role="img" title="The rule has a safe fix">🔧 </span> |
 | [noControlCharactersInRegex](/linter/rules/no-control-characters-in-regex) | Prevents from having control characters and some escape sequences that match control characters in regular expressions. | <span aria-label="Recommended" role="img" title="Recommended">✅ </span> |
 | [noDebugger](/linter/rules/no-debugger) | Disallow the use of <code>debugger</code> | <span aria-label="Recommended" role="img" title="Recommended">✅ </span><span aria-label="The rule has an unsafe fix" role="img" title="The rule has an unsafe fix">⚠️ </span> |

website/src/content/docs/linter/rules/no-console-log.md

@@ -14,7 +14,7 @@ Disallow the use of `console.log`
 console.log()
 ```
 
-<pre class="language-text"><code class="language-text">suspicious/noConsoleLog.js:1:1 <a href="https://biomejs.dev/linter/rules/no-console-log">lint/suspicious/noConsoleLog</a> ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+<pre class="language-text"><code class="language-text">suspicious/noConsoleLog.js:1:1 <a href="https://biomejs.dev/linter/rules/no-console-log">lint/suspicious/noConsoleLog</a> <span style="color: #000; background-color: #ddd;"> FIXABLE </span> ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 
 <strong><span style="color: Orange;">  </span></strong><strong><span style="color: Orange;">⚠</span></strong> <span style="color: Orange;">Don't use </span><span style="color: Orange;"><strong>console.log</strong></span>
 
@@ -24,6 +24,12 @@ console.log()
 
 <strong><span style="color: lightgreen;">  </span></strong><strong><span style="color: lightgreen;">ℹ</span></strong> <span style="color: lightgreen;"><strong>console.log</strong></span><span style="color: lightgreen;"> is usually a tool for debugging and you don't want to have that in production.</span>
 
+<strong><span style="color: lightgreen;">  </span></strong><strong><span style="color: lightgreen;">ℹ</span></strong> <span style="color: lightgreen;">If it is not for debugging purpose then using </span><span style="color: lightgreen;"><strong>console.info</strong></span><span style="color: lightgreen;"> might be more appropriate.</span>
+
+<strong><span style="color: lightgreen;">  </span></strong><strong><span style="color: lightgreen;">ℹ</span></strong> <span style="color: lightgreen;">Unsafe fix</span><span style="color: lightgreen;">: </span><span style="color: lightgreen;">Remove console.log</span>
+
+<strong>  </strong><strong>  1 │ </strong><span style="color: Tomato;">c</span><span style="color: Tomato;">o</span><span style="color: Tomato;">n</span><span style="color: Tomato;">s</span><span style="color: Tomato;">o</span><span style="color: Tomato;">l</span><span style="color: Tomato;">e</span><span style="color: Tomato;">.</span><span style="color: Tomato;">l</span><span style="color: Tomato;">o</span><span style="color: Tomato;">g</span><span style="color: Tomato;">(</span><span style="color: Tomato;">)</span>
+<strong>  </strong><strong>    │ </strong><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span><span style="color: Tomato;">-</span>
 </code></pre>
 
 ## Valid