unicorn/prefer-dom-node-text-content

Require .textContent instead of .innerText

fixable

innerText returns the text as it's rendered. The browser needs to compute styles and layout to answer, and it leaves out text hidden by CSS. textContent returns the text of every node under the element without any of that work.

The rule doesn't know types. It reports .innerText on any object, and innerText in destructuring.

--fix renames the property access. You need to fix destructuring yourself.

Configure#

Off by default. To turn it on:

bunfig.toml
[lint.rules]
"unicorn/prefer-dom-node-text-content" = "error" # or "warn"

Examples#

example.js3 problems
const title = heading.innerText;
status.innerText = "Saved";
const { innerText } = heading;
example.jsNo problems
const title = heading.textContent;
status.textContent = "Saved";
const { textContent } = heading;

When not to use it#

If you want what the user sees, with hidden elements left out and line breaks where <br> and blocks are, innerText is the right property.