fix(key-value): display null values as 'null' string after CSV import

[adrianjm-dotCMS]

Problem

When importing content via CSV with key/value fields containing null values (e.g. {"my-value": null}), the keys were silently dropped from both the Old and New Edit Content UIs.

Fixes #32823

Root Causes & Fixes

Old Edit Content (JSP — edit_field.jsp)

The Java code had if(null != object) which skipped null-valued entries entirely before they reached the Stencil web component. Now null values are included as the string "null".

New Edit Content (Angular — key-value-field.component.ts)

parseToDotKeyValue used data[key] ?? '' which converted null to empty string, making it indistinguishable from an intentionally empty value. Now null maps to the string "null".

Stencil dot-key-value (safety net — dot-key-value.tsx)

Added a regex to handle the ":null pattern in case the component receives raw HTML-encoded JSON with an unquoted null value from any other source.

Behavior After Fix

Input	Old Edit Content	New Edit Content
{"key": null}	Shows key → null	Shows key → null
{"key": ""}	Shows key → (empty)	Shows key → (empty)
{"key": "value"}	Shows key → value	Shows key → value

Test plan

• Import CSV with {"my-value": null} and open in Old Edit Content — key and value null should be visible
• Import CSV with {"my-value": null} and open in New Edit Content — key and value null should be visible
• Verify empty string {"key": ""} still shows as empty (not null)
• Verify normal values are unaffected
• Unit tests pass: yarn nx test edit-content and yarn nx test ui

🤖 Generated with Claude Code

This PR fixes: #32823

[claude]

Claude finished @adrianjm-dotCMS's task in 3m 7s —— View job

---

Code Review

• Gather context and understand the request
• Read changed files and analyze the diff
• Review JSP changes (edit_field.jsp)
• Review Angular component changes (key-value-field.component.ts)
• Review Stencil component changes (dot-key-value.tsx)
• Review test changes

---

The fix is correct for the stated goal. Two things worth calling out, one of which is a design decision that should be explicitly acknowledged:

Round-trip semantic change (intentional but undocumented)

When a user saves a contentlet that was imported with null values, those values will be permanently written back as the string "null", not JSON null. This happens at two levels:

1. JSP hidden input (edit_field.jsp:1580): formatToJsonData transforms {key:null} → {"key":"null"} (string), so the form submission sends the string.
2. Angular updateField (key-value-field.component.ts:47-54): On save, item.value is already the string "null" — there's no reverse mapping back to JSON null.

This means: import with {"key": null} → edit and save → stored as {"key": "null"}. The original null type is permanently lost on first edit. If any downstream template or API consumer distinguishes between null and the string "null", this is a breaking change. The PR description doesn't acknowledge this trade-off.

If preserving the distinction matters, the save path would need a reverse conversion ("null" → null). If it doesn't matter (likely for this field type), add a sentence to the PR description saying so explicitly.

Stencil regex is a safety net that the JSP path never triggers

The new regex in dot-key-value.tsx:169:

.replace(/":null/gi, '":"null"')

handles unquoted null in HTML-encoded JSON, e.g. {"key":null}. But the JSP fix already wraps null in quotes (""" + encodedValue + """), so the JSP path will always produce {"key":"null"} — the Stencil regex will never fire from that source. It's only triggered by other callers that set the value attribute with raw unquoted null.

This is fine as a safety net, but the silent ordering dependency is fragile: this line must precede the ":" → | replacement that follows it. If someone inserts another .replace() between them in the future, the chain breaks. Worth a one-line comment.

Minor

dot-key-value-table-row.component.spec.ts: the added test (value: 'null' renders as "null") doesn't exercise any new behavior — the row component renders any string value. The actual transformation test is correctly in dot-edit-content-key-value.component.spec.ts. Not a bug, but the new row test doesn't add meaningful coverage.

---

Overall: clean fix. The round-trip concern is the only substantive question — worth a conscious decision either way.

[Copilot]

Pull request overview

Fixes a regression where key/value entries with null values imported via CSV were not displayed in either the legacy JSP edit screen or the new Angular edit experience, by consistently surfacing null as the literal string "null" and adding a defensive parsing step in the dot-key-value web component.

Changes:

• Legacy Edit Content (JSP): include null-valued entries during key/value serialization instead of skipping them.
• New Edit Content (Angular): map imported null values to the string "null" in parseToDotKeyValue.
• Web component + tests: add a parsing “safety net” for HTML-encoded JSON with unquoted null, plus new unit/e2e test coverage.

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
dotCMS/src/main/webapp/html/portlet/ext/contentlet/field/edit_field.jsp	Stops dropping null values when building key/value payloads for the legacy UI.
core-web/libs/ui/src/lib/components/dot-key-value-ng/dot-key-value-table-row/dot-key-value-table-row.component.spec.ts	Adds a unit test ensuring "null" renders in the value input.
core-web/libs/edit-content/src/lib/fields/dot-edit-content-key-value/dot-edit-content-key-value.component.spec.ts	Updates the import-related expectation from '' to 'null'.
core-web/libs/edit-content/src/lib/fields/dot-edit-content-key-value/components/key-value-field/key-value-field.component.ts	Changes null-coalescing logic to preserve null as 'null' instead of empty string.
core-web/libs/dotcms-webcomponents/src/components/contenttypes-fields/dot-key-value/dot-key-value.tsx	Adds parsing normalization for HTML-encoded JSON where values may be unquoted null.
core-web/libs/dotcms-webcomponents/src/components/contenttypes-fields/dot-key-value/dot-key-value.e2e.ts	Adds e2e coverage for unquoted null values in HTML-encoded JSON.