Move authoring UI inline JS handlers to data attributes - #168
Conversation
The editor screens built handler arguments by interpolating template values directly into inline onclick/onchange attributes. Those values now travel in data-* attributes and are read back through delegated listeners, which matches how the rest of the UI binds behaviour and keeps markup and data separate. Writes that placed those values into the DOM now use text APIs rather than html(), and ThemeDataServlet escapes its JSON output so theme metadata cannot produce a malformed document. Adds AuthoringUiSinkAuditTest to keep the editor templates on this pattern.
The media gallery rendered the media file name into single-quoted HTML attributes; those attributes are now double-quoted so the value stays data. The sink-audit test description now states the rule it enforces, and the repeated per-page comment is collapsed to one line. Claude-Session: https://claude.ai/code/session_01A1fhY1E2PCFU6UAPXu2WtV
| $('#category-name').html(name); | ||
| $('#category-name').text(name); | ||
| if ( inUse ) { | ||
| $('#category-in-use').css('display','block'); |
There was a problem hiding this comment.
Pre-existing, but since this function is being reworked: lines 294/297 toggle #category-emtpy while the element is #category-empty (line 266), so the "no entries in this category" message never shows.
| url: "<s:url value='themedata'/>", | ||
| data: {theme: themeId}, success: function (data) { | ||
| $('#themeDescription').html(data.description); | ||
| $('#themeDescription').text(data.description); |
There was a problem hiding this comment.
Behaviour change worth a line in the description: a shared theme whose theme.xml <description> carries markup now renders it as literal text. The bundled themes are plain text, so I think that's fine, just disclose it.
|
|
||
| <%-- Source data for the "move entries to" select, carried as escaped | ||
| attributes rather than generated JavaScript literals. --%> | ||
| <div id="category-option-data" style="display:none"> |
There was a problem hiding this comment.
Nit: the .category-edit-link anchors above already carry data-category-id / data-category-name for every category, so populateCategorySelect could read those instead of maintaining a second serialised copy.
| } | ||
| } | ||
|
|
||
| private static String flatten(String source) { |
There was a problem hiding this comment.
Nit: HANDLER_LITERAL uses \s* and [^"]*, both of which already span newlines, so flatten() / flattenSource don't change any match and can go.
2 participants
Several authoring pages embed values in inline JavaScript string literals and
then write them into the page with jQuery
.html(). This refactor moves thosevalues into data attributes and writes them through text APIs, so JSPs stop
hand-concatenating markup and data.
What changed
into double-quoted, HTML-escaped
data-*attributes.textContent,.text(),.val(), or DOM constructors..html()writes with a text API.entry lists, and entry editing, including the category iterator and
delete-modal cases.
ThemeDataServletreturn validJSON.
Tests
and
</script>remain text through each path.author or administrator session.
single-quoted attribute, or a
.html()sink.