How to avoid no-param-reassign when setting a property on a DOM object

Lukas picture Lukas · Feb 25, 2016 · Viewed 89k times · Source

I have a method which's main purpose is to set a property on a DOM object

function (el) {
  el.expando = {};
}

I use AirBnB's code style which makes ESLint throw a no-param-reassign error:

error Assignment to function parameter 'el' no-param-reassign

How can I manipulate a DOM object passed as an argument while conforming AirBnB's code style?

Somebody suggested to use /* eslint react/prop-types: 0 */ referring to another issue but if I am not mistaken this applies well for react, but not for native DOM manipulation.

Also I do not think changing the code style is an answer. I believe one of the benefits of using a standard style is having consistent code across projects and changing the rules at will feels like a misuse of a major code style like AirBnB's.

For the record, I asked AirBnB on GitHub, what they think is the way to go in these cases in issue #766.

Answer

sfletche picture sfletche · Feb 25, 2016

As @Mathletics suggests, you can disable the rule entirely by adding this to your .eslintrc.json file:

"rules": {
  "no-param-reassign": 0
}

Or you could disable the rule specifically for param properties

"rules": {
  "no-param-reassign": [2, { "props": false }]
}

Alternatively, you could disable the rule for that function

/* eslint-disable no-param-reassign */
function (el) {
  el.expando = {};
}
/* eslint-enable no-param-reassign */

Or for that line only

function (el) {
  el.expando = {}; // eslint-disable-line no-param-reassign
}

You might also check out this blog post on disabling ESLint rules specifically to accommodate AirBnB's style guide.