docs(no-octal): add doc (#768)

Author: magurotuna

src/rules/no_octal.rs

@@ -9,7 +9,8 @@ use swc_ecmascript::visit::Visit;
 pub struct NoOctal;
 
 const CODE: &str = "no-octal";
-const MESSAGE: &str = "`Octal number` is not allowed";
+const MESSAGE: &str = "Numeric literals beginning with `0` are not allowed";
+const HINT: &str = "To express octal numbers, use `0o` as a prefix instead";
 
 impl LintRule for NoOctal {
   fn new() -> Box<Self> {
@@ -35,6 +36,33 @@ impl LintRule for NoOctal {
       ProgramRef::Script(ref s) => visitor.visit_script(s, &DUMMY_NODE),
     }
   }
+
+  fn docs(&self) -> &'static str {
+    r#"Disallows expressing octal numbers via numeric literals beginning with `0`
+
+Octal numbers can be expressed via numeric literals with leading `0` like `042`,
+but this expression often confuses programmers. That's why ECMAScript's strict
+mode throws `SyntaxError` for the expression.
+
+Since ES2015, the other prefix `0o` has been introduced as an alternative. This
+new one is always encouraged to use in today's code.
+
+### Invalid:
+
+```typescript
+const a = 042;
+const b = 7 + 042;
+```
+
+### Valid:
+
+```typescript
+const a = 0o42;
+const b = 7 + 0o42;
+const c = "042";
+```
+"#
+  }
 }
 
 struct NoOctalVisitor<'c, 'view> {
@@ -58,7 +86,12 @@ impl<'c, 'view> Visit for NoOctalVisitor<'c, 'view> {
       .expect("error in loading snippet");
 
     if OCTAL.is_match(&raw_number) {
-      self.context.add_diagnostic(literal_num.span, CODE, MESSAGE);
+      self.context.add_diagnostic_with_hint(
+        literal_num.span,
+        CODE,
+        MESSAGE,
+        HINT,
+      );
     }
   }
 }
@@ -82,12 +115,12 @@ mod tests {
   fn no_octal_invalid() {
     assert_lint_err! {
       NoOctal,
-      "07": [{col: 0, message: MESSAGE}],
-      "let x = 7 + 07": [{col: 12, message: MESSAGE}],
+      "07": [{col: 0, message: MESSAGE, hint: HINT}],
+      "let x = 7 + 07": [{col: 12, message: MESSAGE, hint: HINT}],
 
       // https://github.com/denoland/deno/issues/10954
       // Make sure it doesn't panic
-      "020000000000000000000;": [{col: 0, message: MESSAGE}],
+      "020000000000000000000;": [{col: 0, message: MESSAGE, hint: HINT}],
     }
   }
 }