mc/mcias
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix CSP-blocked inline handlers on SSO clients page

Browse Source 
script-src 'self' blocks onclick handlers and style-src blocks inline
style attributes. Replace onclick with data-toggle-form attributes
wired by mcias.js on DOMContentLoaded, and move inline styles to CSS
utility classes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Kyle Isom
2026-04-01 08:22:17 -07:00
parent ef28805042
commit e082671f53
3 changed files with 39 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
web/static/mcias.js
View File

@@ -15,6 +15,31 @@ document.body.addEventListener('htmx:responseError', function (evt) {
banner.scrollIntoView({ behavior: 'instant', block: 'nearest' });
});
// Toggle visibility of a create-form panel. The button text alternates
// between the given labels. Used by admin pages (accounts, policies,
// pgcreds, SSO clients) to show/hide the inline create form.
//
// Usage: <button data-toggle-form="create-form"
// data-label-show="Add Item" data-label-hide="Cancel">
function toggleForm(btn) {
var id = btn.getAttribute('data-toggle-form');
var el = document.getElementById(id);
if (!el) { return; }
var show = el.hidden || el.style.display === 'none';
el.hidden = false;
el.style.display = show ? '' : 'none';
var labelShow = btn.getAttribute('data-label-show') || 'Create';
var labelHide = btn.getAttribute('data-label-hide') || 'Cancel';
btn.textContent = show ? labelHide : labelShow;
}
// Auto-wire all toggle-form buttons on page load.
document.addEventListener('DOMContentLoaded', function () {
document.querySelectorAll('[data-toggle-form]').forEach(function (btn) {
btn.addEventListener('click', function () { toggleForm(btn); });
});
});
// Clear the error banner whenever a successful HTMX swap completes so
// stale errors do not persist after the user corrects their input.
document.body.addEventListener('htmx:afterSwap', function () {