The following code selects all div elements and changes their class to 'test. ESLint complains about assignment to property of function parameter:
[...document.getElementsByTagName('div')].forEach(div => {
div.className = 'test';
});
However, if I mutate the parameter by running a function or method, then I get no complaints. The following code does the exact same thing as the code that gets complained about, but is less efficient and less readable:
[...document.getElementsByTagName('div')].forEach(div => {
div.classList.remove(...div.classList);
div.classList.add('test');
});
Why is one okay but the other is not?
ESLint's no-param-reassign rule includes prohibiting assignment of function arguments' properties. But it has a props option that you could configure to false if you want to keep the rule more generally but also allow it to mutate function arguments without reassigning them.
As the documentation page explains, the rule exists because reassigning (or mutating) function arguments will also mutate the arguments object, which may be confusing.
There's no way for ESLint to know if an object's method is going to mutate that object, which is why it can't error when you call a method that mutates a function argument.
In my experience, this side effect of mutating arguments is pretty rarely an issue, especially when you're just mutating function arguments instead of reassigning them. What you're doing in this example clearly isn't going to cause the sort of issue this rule is meant to help with.
Personally, this is a rule that I turn off in my projects.