Why a page shows &: diagnose an extra HTML escaping layer

Write down three different representations

The label Tea & Toast is ordinary text. In HTML source used for a text node, Tea & Toast represents that label. If the ampersand in the entity is escaped again, the source becomes Tea & Toast and the page can display the unwanted literal text &.

Use this harmless label to trace the path through your export, template and final page. Record what each boundary expects. A plain-text API and an HTML template may need different inputs; calling both values simply content hides the conversion that caused the extra layer.

Raw label: Tea & Toast
HTML text source: Tea & Toast
Escaped twice: Tea & Toast
Visible result after parsing twice-escaped source once: Tea & Toast

Compare the saved value with the destination’s expectation

If a component accepts ordinary text and escapes it when rendering, pass the raw label. If you pre-escape it first, the component may correctly escape the ampersand you introduced, creating the visible entity spelling. Inspect the data just before that boundary rather than replacing every occurrence of & across the entire site.

For a DOM text node, assigning the raw value with textContent creates text instead of parsing markup. Do not switch to an HTML insertion API merely to hide the symptom; that changes what the browser is allowed to interpret. The surrounding framework may already provide a suitable text-rendering path.

MDN: textContent and plain text ↗

Use the tools to identify one layer at a time

KitForma HTML Escape converts five sensitive characters, including ampersands. Applying it to Tea & Toast therefore produces Tea & Toast. HTML Unescape decodes one supported entity layer and returns plain text. The output should be inspected as text, not automatically injected into a page.

For the fixture, unescaping Tea & Toast once yields Tea & Toast; a second deliberate pass yields Tea & Toast. This demonstrates the layers. It is not a recommendation to repeatedly decode an unknown string until it looks pleasant, because some entity text may be intentional content.

1. Record the raw sample and expected visible text.
2. Find the boundary that first changes & into &.
3. Check whether another layer already escapes output.
4. Change that one documented boundary.
5. Recheck ampersands, quotes and literal angle brackets in a harmless fixture.

HTML Unescape input: Tea & Toast
After one pass: Tea & Toast
After a second deliberate pass: Tea & Toast

Respect the output context

HTML text escaping is not a universal security transformation. JavaScript, CSS, URL values and rich HTML have different requirements. KitForma HTML Escape is not a sanitizer. This guide’s label belongs in ordinary text content; it does not demonstrate safe insertion into a script or style element.

After fixing the data path, test a fresh record and a previously stored record. Old values may already contain an extra layer. Handle a historical repair with a documented migration rule and a preserved original, rather than adding another global decode step that also changes future clean data.

OWASP: context-specific output encoding ↗

Q: What if the label intentionally contains the characters &?

Preserve that literal text. In a teaching page, & may be exactly what the author wants readers to see. The intended visible value, not visual tidiness, decides whether a layer is wrong.

Q: Why does HTML Unescape leave some names unchanged?

The current tool supports a documented subset of named entities and valid numeric references with semicolons. Unknown or invalid forms remain unchanged. It is not a complete HTML parser, and an unchanged entity is not permission to insert the result as markup.