eslint-plugin-no-hardcoding

To prevent hardcoding content and to enforce usage of appropriate i18n keys

Installation

You'll first need to install ESLint:

$ npm i eslint --save-dev 

Next, install eslint-plugin-no-hardcoding:

$ npm install eslint-plugin-no-hardcoding --save-dev

Note: If you installed ESLint globally (using the -g flag) then you must also install eslint-plugin-no-hardcoding globally.

Usage

Add @zohodesk/no-hardcoding to the plugins section of your .eslintrc configuration file.

{
  "plugins": ["@zohodesk/no-hardcoding"]
}

Then configure the rules you want to use under the rules section.

{
  "rules": {
    "@zohodesk/no-hardcoding/no-hardcoding": [errror,{props:[],objectKeys:[],methods:[],allowedTags:[]}],
    "@zohodesk/no-hardcoding/use-getI18NValue-method-appropriately": [errror,{i18nKeys:[],comments:[]}]
  }
}

Note: When configuring the severity of the no-hardcoding rule @zohodesk/no-hardcoding/no-hardcoding as a second argument in the array, an object with the properties 'methods','props','objectKeys','allowedTags','keys','commentsToIgnoreHardcodingCheck','stringsAllowedAsBlockCommentStart','stringsAllowedAsBlockCommentEnd','dateFormatPatterns' must be mandatorily given. The value of these properties should be an array and entries into the array can be added if required

Note: When configuring the severity of the no-hardcoding rule @zohodesk/no-hardcoding/use-getI18NValue-method-appropriately as a second argument in the array an object with the properties 'i18nKeys','commentsToIgnoreCheck' must be mandatorily given. The value of these properties should be an array and entries into the array can be added if required

List of supported rules

• @zohodesk/no-hardcoding/no-hardcoding,
• @zohodesk/no-hardcoding/use-getI18NValue-method-appropriately

Cases where the @zohodesk/no-hardcoding/no-hardcoding rule will report error:

<Container displayLabel='hardcoded string' /> 

let obj = {
        key: 'hardcoded string'
    }

let test = "test variable"

let i18nText = getI18NValue('Incorrect key')

When an incorrect key is used inside the i18n method 'getI18NValue' error will be reported

<Container displayLabel='singlewordhardcoding' /> 

Cases where the @zohodesk/no-hardcoding/no-hardcoding rule will not report error

1. Hardcoding string in certain props like className, dataId etc are by default not reported as errors. Such props where error should not be thrown can be configured using the "props" key in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

<Container className="test string" dataId='any string' />

2. Hardcoding string in certain object properties/keys like className, dataId,iconSize,boxSize etc are by default not reported as errors. Such object keys/properties where error should not be thrown can be configured using the "objectKeys" key in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let obj = { dataId: 'any string'}

3. Hardcoding string in certain methods like findIndex,includes, addEventListener etc are by default not reported as errors. Such methods where error should not be thrown can be configured using the "methods" key in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let index = findIndex('hardcoded string')

4. Hardcoding strings in certain tags like svg are by default excluded from being reported as error. Such tags can be configured using the "allowedTags" key in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

<svg title='hardcoded string' d='test'> </svg>

5. Here the string 'Product Information' is actually an i18n key and passed to appropriate method getI18NValue. Hence it won't be reported as error. Such hardcoded strings which are correct i18n keys need to be configured using the "keys" key in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let i18nedValue = getI18NValue('Product Information')

6. Sequence of numbers given as string separated by space will not be reported as error.

let seqOfNums = "0 0 12 20"

7. Here the word "spaced key" is actully a property name in the object 'obj' and hence won't be reported as error

let num = obj["spaced key"] 

8. Date formats like below won't be reported as hardcoding errors. Such date format patterns can be configured in the configuration object using the "dateFormatPatterns" key given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let dateFormat = 'DD MMM YYYY hh:mm A'

9. CSS properties won't be reported as hardcoding errors

let cssProp = '10px #34rfe3' 

10. Strings given as argument to throw expressions won't be reported as hardcoding errors

throw 'any string' 

11. Strings passed as arguments to "Error" won't be reported as hardcoding errors

return new Error('any string') 

12. Strings used for comparison in if conditions won't be reported as hardcoding errors

if(someVar === 'any string'){}

13. Strings used for comparison in ternary operators won't be reported as hardcoding errors

let someVar = "any string" === "another string" ? true : false

14. Single word strings passed as argument to any fucntion will not be reported as error

let test = getContent('singleword')

15. Strings used for file paths in import and export statements won't be reported as error

import WizardTab from '../../common/WizardTab/WizardTab';

16. Strings in the camelCase pattern and PascalCase pattern will not be reported as error

<Container layout="camelCase" agent='PascalCase' />

17. Single word strings initialised either to a variable or an object key or added as an array element will not be reported as error

let test = 'init'
let obj = {
  prop1: 'singleword'
}
let arr = ['test','singleword']

18. Numbers, symbols, regex patterns, strings that contain underscore and empty strings which are given within single or double quotes will not be reported as errors

let test = '7'
let variable = '#'
let someregex = /[0-9]/
let empty = ''
let str = 'single_word'

19. Strings starting with a certain words will not be reported as error.Such starting words can be configured using the "allowedStringStartWords" key in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let class = 'ZD-Agent'

20. Strings initialised to prop names starting with certain words and prop names ending in certain words will not be reported as error. Such prop name starting words and prop name ending words should be configured using the "allowedPropStartingWords" key and "allowedPropEndingWords" respectively in the configuration object given in the configuration file while configuring the rule(as explained above on how to configure the rules)

<Container isEnabled="camelCase" agentId='PascalCase' />

21. When the comment 'no i18n' is added hardcoding error will not be reported in the particular line. Other than 'no i18n' the comments that can be used to ignore this check can be configured in the configuration object using the "commentsToIgnoreHardcodingCheck" key given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let someVar = 'hardcoded string' //no i18n

22. If the block comment 'ignore i18n start' and 'ignore i18n end' is added hardcoding error will not be reported in the lines between the comment. Other than 'ignore i18n start' and 'ignore i18n end' pair the pair of comments that can be used to ignore this check within the comment added block can be configured in the configuration object using the "stringsAllowedAsBlockCommentStart" key and "stringsAllowedAsBlockCommentEnd" key given in the configuration file while configuring the rule(as explained above on how to configure the rules)

let obj = { //ignore i18n start
    title: 'hardcoded string',
    displayLabel: 'Show tickets',
    text: 'In Progress',
    buttonText: 'Leave now'
} //ignore i18n end