• Success Criterion 1.4.12
  • Conformance level AA

JavaScript Truncation That Deletes Content on Text-Spacing Change

1.4.12 — Text Spacing

Scenario

Setting

A car-rental site's checkout flow

What’s wrong

JS truncation re-running and deleting content when spacing changes metrics.

Example

function fitDescription() {
  var el = document.querySelector('.vehicle-desc');
  while (el.scrollHeight > el.clientHeight) {
    el.textContent = el.textContent.slice(0, -1);
  }
}

Why it matters

This script re-runs whenever the layout reflows, so wider line spacing triggers it to keep deleting characters from the description until it fits the old box height.

How to test

Apply the text-spacing override where JS auto-truncation runs (character counters, ellipsis logic): if it deletes content when the spacing metrics change, it fails.

How to fix

Never delete DOM text to force a fit; let content reflow, or use a reversible visual clamp with a full-text disclosure.

.vehicle-desc { max-height: none; overflow: visible; }
<!-- remove the JS truncation entirely; use CSS line-clamp with a "read more" toggle if truncation is genuinely needed -->

Outcome

A renter with wider line spacing reads the entire vehicle description instead of a sentence chopped short by a script.

Who is affected

Users who apply custom text spacing can permanently lose parts of the vehicle description, since the script deletes rather than wraps the overflow.

Learn more