@gitlab/eslint-plugin 9.4.0 → 10.0.0

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+# [10.0.0](https://gitlab.com/gitlab-org/frontend/eslint-plugin/compare/v9.4.0...v10.0.0) (2021-11-03)
+
+
+### Features
+
+* lint against missing translation namespaces ([db00d87](https://gitlab.com/gitlab-org/frontend/eslint-plugin/commit/db00d87e3877fa0fe538775280a54fd820c89572))
+
+
+### BREAKING CHANGES
+
+* require-string-literal-i18n-helpers and
+vue-require-string-literal-i18n-helpers rules have been renamed to
+require-valid-i18n-helpers and vue-require-valid-i18n-helpers
+respectively.
+
 # [9.4.0](https://gitlab.com/gitlab-org/frontend/eslint-plugin/compare/v9.3.0...v9.4.0) (2021-09-21)
 
 

package/docs/rules/require-valid-i18n-helpers.md

@@ -0,0 +1,41 @@
+# @gitlab/require-valid-i18n-helpers
+
+This rule enforces valid usages of the translation helpers (`__`, `s__` and `n__`). It requires the
+following:
+
+- All helpers should be called with string-literal arguments to ensure the strings are properly
+  collected by the `gettext:regenerate` script.
+- `s__` requires a translation namespace to be provided.
+
+## Rule Details
+
+### Examples of **incorrect** code for this rule
+
+```js
+// Invalid argument types
+const label = __(LABEL);
+const description = __(getDescription());
+
+// Missing translation namespace
+const namespacedTranslation = s__('NamespacedTranslation');
+```
+
+### Examples of **correct** code for this rule
+
+```js
+// Valid argument type
+const label = __('Some label');
+
+// Valid translation namespace
+const namespacedTranslation = s__('Namespace|Translation');
+// or
+const otherNamespacedTranslation = s__('Namespace', 'Other translation');
+```
+
+## Options
+
+Nothing
+
+## Related rules
+
+- TBA

package/docs/rules/vue-require-valid-i18n-helpers.md

@@ -0,0 +1,42 @@
+# @gitlab/vue-require-valid-i18n-helpers
+
+This rule is like [require-valid-i18n-helpers](./require-valid-i18n-helpers.md) for Vue templates.
+
+## Rule Details
+
+### Examples of **incorrect** code for this rule
+
+```html
+<template>
+  <div>
+    <!-- Invalid argument types -->
+    {{ __(LABEL) }}
+    {{ __(getDescription()) }}
+
+    <!-- Missing translation namespace -->
+    {{ s__('NamespacedTranslation') }}
+  </div>
+</template>
+```
+
+### Examples of **correct** code for this rule
+
+```html
+<template>
+  <div>
+    <!-- Valid argument type -->
+    {{ __('Some label') }}
+
+    <!-- Valid translation namespace -->
+    {{ s__('Namespace|Translation') }}
+  </div>
+</template>
+```
+
+## Options
+
+Nothing
+
+## Related rules
+
+- TBA

package/docs/rules.md

@@ -7,12 +7,12 @@ Available rules:
 - [no-global-event-off](./rules/no-global-event-off.md): Throw an error when globally deregistering all event listeners.
 - [no-runtime-template-compiler](./rules/no-runtime-template-compiler.md): Disallow components which rely on a runtime template compiler.
 - [require-i18n-strings](./rules/require-i18n-strings.md): Detect a string which has been hard coded and requires externalization.
-- [require-string-literal-i18n-helpers](./rules/require-string-literal-i18n-helpers.md): Prevents translation helpers from being called with non-string-literal arguments.
+- [require-valid-i18n-helpers](./rules/require-valid-i18n-helpers.md): Enforces valid usage of translation helpers in JavaScript.
 - [vue-emit-events-with-two-args](./rules/vue-emit-events-with-two-args.md): Throw an error when emit is called with more than two arguments.
 - [vue-no-data-toggle](./rules/vue-no-data-toggle.md): Restrict the use of `data-toggle` bootstrap behaviors within Vue templates
 - [vue-no-new-non-primitive-in-template](./rules/vue-no-new-non-primitive-in-template.md): Prevents non-primitive values from being declared in templates
 - [vue-require-i18n-attribute-strings](./rules/vue-require-i18n-attribute-strings.md): Detect non externalized strings in vue `<template>` attributes
 - [vue-require-i18n-strings](./rules/vue-require-i18n-strings.md): enforce no bare strings in vue `<template>`
 - [vue-require-required-key](./rules/vue-require-required-key.md): Require the required key to be set
-- [vue-require-string-literal-i18n-helpers](./rules/vue-require-string-literal-i18n-helpers.md): Prevents translation helpers from being called with non-string-literal arguments in Vue templates.
+- [vue-require-valid-i18n-helpers](./rules/vue-require-valid-i18n-helpers.md): Enforces valid usage of translation helpers in Vue templates.
 - [vue-slot-name-casing](./rules/vue-slot-name-casing.md): enforce specific casing for slot naming style in template

package/lib/configs/i18n.js

@@ -4,7 +4,7 @@ module.exports = {
     '@gitlab/require-i18n-strings': 'error',
     '@gitlab/vue-require-i18n-attribute-strings': 'error',
     '@gitlab/vue-require-i18n-strings': 'error',
-    '@gitlab/require-string-literal-i18n-helpers': 'error',
-    '@gitlab/vue-require-string-literal-i18n-helpers': 'error',
+    '@gitlab/require-valid-i18n-helpers': 'error',
+    '@gitlab/vue-require-valid-i18n-helpers': 'error',
   },
 };

package/lib/index.js

@@ -6,14 +6,14 @@ module.exports = {
     'no-global-event-off': require('./rules/no-global-event-off.js'),
     'no-runtime-template-compiler': require('./rules/no-runtime-template-compiler.js'),
     'require-i18n-strings': require('./rules/require-i18n-strings.js'),
-    'require-string-literal-i18n-helpers': require('./rules/require-string-literal-i18n-helpers.js'),
+    'require-valid-i18n-helpers': require('./rules/require-valid-i18n-helpers.js'),
     'vue-emit-events-with-two-args': require('./rules/vue-emit-events-with-two-args.js'),
     'vue-no-data-toggle': require('./rules/vue-no-data-toggle.js'),
     'vue-no-new-non-primitive-in-template': require('./rules/vue-no-new-non-primitive-in-template.js'),
     'vue-require-i18n-attribute-strings': require('./rules/vue-require-i18n-attribute-strings.js'),
     'vue-require-i18n-strings': require('./rules/vue-require-i18n-strings.js'),
     'vue-require-required-key': require('./rules/vue-require-required-key.js'),
-    'vue-require-string-literal-i18n-helpers': require('./rules/vue-require-string-literal-i18n-helpers.js'),
+    'vue-require-valid-i18n-helpers': require('./rules/vue-require-valid-i18n-helpers.js'),
     'vue-slot-name-casing': require('./rules/vue-slot-name-casing.js'),
   },
   configs: {

package/lib/rules/require-i18n-strings.js

@@ -4,6 +4,11 @@
  */
 'use strict';
 
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+const { isTemplateLiteral, getTemplateLiteralString } = require('../utils/rule-utils');
+
 //------------------------------------------------------------------------------
 // Rule Definition
 //------------------------------------------------------------------------------
@@ -269,21 +274,10 @@ module.exports = {
       return node.type === 'Literal';
     }
 
-    function isTemplateLiteral(node) {
-      return node.type === 'TemplateLiteral';
-    }
-
     function stripVariables(value) {
       return value ? value.replace(/(\%{[\w-]+})/g, '') : '';
     }
 
-    function getTemplateLiteralString(node) {
-      return node.quasis
-        .filter((quasi) => quasi.type === 'TemplateElement')
-        .map((quasi) => quasi.value.raw)
-        .join('');
-    }
-
     function getCallExpressionString(node, callee) {
       if (callee.name === 'sprintf') {
         return stripVariables(node.value);

package/lib/rules/{require-string-literal-i18n-helpers.js → require-valid-i18n-helpers.js}

@@ -2,7 +2,6 @@
 // Requirements
 // ------------------------------------------------------------------------------
 const { DOCS_BASE_URL } = require('../constants');
-const { getFunctionName, isString } = require('../utils/rule-utils');
 const { validateI18nHelperCallFactory } = require('../utils/i18n-utils');
 
 // ------------------------------------------------------------------------------
@@ -13,9 +12,9 @@ module.exports = {
   meta: {
     type: 'error',
     docs: {
-      description: 'Prevents translation helpers from being called with non-string-literal arguments.',
+      description: 'Enforces valid usage of translation helpers in JavaScript.',
       category: 'i18n',
-      url: DOCS_BASE_URL + '/require-string-literal-i18n-helpers.md',
+      url: DOCS_BASE_URL + '/require-valid-i18n-helpers.md',
     },
   },
   create(context) {

package/lib/rules/{vue-require-string-literal-i18n-helpers.js → vue-require-valid-i18n-helpers.js}

@@ -13,10 +13,9 @@ module.exports = {
   meta: {
     type: 'error',
     docs: {
-      description:
-        'Prevents translation helpers from being called with non-string-literal arguments in Vue templates.',
+      description: 'Enforces valid usage of translation helpers in Vue templates.',
       category: 'i18n',
-      url: DOCS_BASE_URL + '/vue-require-string-literal-i18n-helpers.md',
+      url: DOCS_BASE_URL + '/vue-require-valid-i18n-helpers.md',
     },
   },
   create(context) {

package/lib/utils/i18n-utils.js

@@ -1,21 +1,22 @@
-const { getFunctionName, isString } = require('../utils/rule-utils');
+const {
+  getFunctionName,
+  isString,
+  isTemplateLiteral,
+  getTemplateLiteralString,
+} = require('../utils/rule-utils');
 
-const I18N_HELPERS = new Set(['__', 's__', 'n__']);
-const ERROR_MESSAGE = 'Translation helpers must be called with a string literal.';
+const GETTEXT = '__';
+const P_GETTEXT = 's__';
+const N_GETTEXT = 'n__';
 
-const isI18nCall = (node) => {
-  const functionName = getFunctionName(node);
-  return functionName && I18N_HELPERS.has(functionName);
-};
+const ERROR_MESSAGE_STRING_LITERAL = 'Translation helpers must be called with a string literal.';
+const ERROR_MESSAGE_MISSING_NAMESPACE = 's__ requires a translation namespace to be provided.';
 
-const validateI18nHelperCallFactory = (context) => (node) => {
-  if (!isI18nCall(node)) {
-    return;
-  }
+const mustBeCalledWithStringLiteralArguments = (context, node) => {
   const report = (node) => {
     context.report({
       node,
-      message: ERROR_MESSAGE,
+      message: ERROR_MESSAGE_STRING_LITERAL,
     });
   };
 
@@ -28,6 +29,40 @@ const validateI18nHelperCallFactory = (context) => (node) => {
   }
 };
 
+const mustHaveNamespace = (context, node) => {
+  if (node.arguments.length === 2) {
+    return;
+  }
+
+  const [arg] = node.arguments;
+  const value = isTemplateLiteral(arg) ? getTemplateLiteralString(arg).trim() : arg.value;
+  if (!/^\w.+\|/.test(value)) {
+    context.report({
+      node,
+      message: ERROR_MESSAGE_MISSING_NAMESPACE,
+    });
+  }
+};
+
+const VALIDATORS = {
+  [GETTEXT]: [mustBeCalledWithStringLiteralArguments],
+  [P_GETTEXT]: [mustBeCalledWithStringLiteralArguments, mustHaveNamespace],
+  [N_GETTEXT]: [mustBeCalledWithStringLiteralArguments],
+};
+
+const validateI18nHelperCallFactory = (context) => (node) => {
+  const functionName = getFunctionName(node);
+  if (!Object.keys(VALIDATORS).includes(functionName)) {
+    return;
+  }
+
+  VALIDATORS[functionName].forEach((validator) => {
+    validator(context, node);
+  });
+};
+
 module.exports = {
   validateI18nHelperCallFactory,
-}
+  ERROR_MESSAGE_STRING_LITERAL,
+  ERROR_MESSAGE_MISSING_NAMESPACE,
+};

package/lib/utils/rule-utils.js

@@ -41,6 +41,29 @@ function isString(node) {
   return [LITERAL, TEMPLATE_LITERAL].includes(node.type);
 }
 
+/**
+ * Checks whether a node is a template literal.
+ *
+ * @param {ASTNode} node The node to type check
+ * @returns {boolean} `true` if node is a template literal.
+ */
+function isTemplateLiteral(node) {
+  return node.type === TEMPLATE_LITERAL;
+}
+
+/**
+ * Extracts the string out of a template literal node.
+ *
+ * @param {ASTNode} node The template literal node
+ * @returns {string} The extracted string.
+ */
+function getTemplateLiteralString(node) {
+  return node.quasis
+    .filter((quasi) => quasi.type === 'TemplateElement')
+    .map((quasi) => quasi.value.raw)
+    .join('');
+}
+
 /**
  * Check that a node is a `VLiteral type`
  * @param {ASTNode} node The node to type check
@@ -172,6 +195,8 @@ module.exports = {
   clearSplitLines,
   closest,
   isString,
+  isTemplateLiteral,
+  getTemplateLiteralString,
   isVLiteral,
   removeNewLines,
   selectFixFunction,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/eslint-plugin",
-  "version": "9.4.0",
+  "version": "10.0.0",
   "description": "GitLab package for our custom eslint rules",
   "main": "lib/index.js",
   "scripts": {

package/docs/rules/require-string-literal-i18n-helpers.md

@@ -1,26 +0,0 @@
-# @gitlab/require-string-literal-i18n-helpers
-
-Prevents translation helpers from being called with non-string-literal arguments.
-
-## Rule Details
-
-### Examples of **incorrect** code for this rule
-
-```js
-const label = __(LABEL);
-const description = __(getDescription());
-```
-
-### Examples of **correct** code for this rule
-
-```js
-const label = __('Some label');
-```
-
-## Options
-
-Nothing
-
-## Related rules
-
-- TBA

package/docs/rules/vue-require-string-literal-i18n-helpers.md

@@ -1,34 +0,0 @@
-# @gitlab/vue-require-string-literal-i18n-helpers
-
-Prevents translation helpers from being called with non-string-literal arguments in Vue templates.
-
-## Rule Details
-
-### Examples of **incorrect** code for this rule
-
-```html
-<template>
-  <div>
-    {{ __(LABEL) }}
-    {{ __(getDescription()) }}
-  </div>
-</template>
-```
-
-### Examples of **correct** code for this rule
-
-```html
-<template>
-  <div>
-    {{ __('Some label') }}
-  </div>
-</template>
-```
-
-## Options
-
-Nothing
-
-## Related rules
-
-- TBA