Rheinparkcenter Neuss captcha integration fix: missing token in POST due to fragile click handler flow

rheinparkcenter-neuss-captcha-fix-README.md

Rheinparkcenter Newsletter – Captcha Token Missing Fix

Context

On https://www.rheinparkcenter-neuss.de/newsletter-registration/, the current integration sometimes logs a generated captcha solution but the final POST request does not include it.

Root cause is the custom click-based orchestration around KROT.getSolution() plus KROT.interceptForm(form, true).

Existing problem points

Current code:

• intercepts button click instead of stable form submit semantics
• adds/removes click handlers recursively
• uses e.intercepted on a transient event object
• passes true to KROT.interceptForm(form, true) which disables SDK-native interception

This makes submission race-prone and can skip token propagation in certain submit paths (Enter key, alternate submit triggers, timing races).

Fix strategy

Use SDK-native interception only:

• call KROT.interceptForm(form) (without second argument)
• remove custom click/re-click flow
• let SDK populate .captcha_at_hidden_field and submit

Drop-in file

Use: docs/rheinparkcenter-neuss-captcha-fix.js

Replace section (what/where)

In the page template where this block currently exists:

KROT.interceptForm(form, true);
function btnClickHandler(e) { ... }
btn.addEventListener('click', btnClickHandler);

replace it with the content from rheinparkcenter-neuss-captcha-fix.js.

Why this is correct

The SDK already implements robust form interception:

• blocks submit
• computes solution
• writes hidden field
• re-submits via form submit

Duplicating this logic in custom click handlers introduces intermittent failures.

Validation checklist

After deployment, verify:

1. click submit with mouse → POST contains captcha_at_solution
2. press Enter in form field → POST contains captcha_at_solution
3. repeated submits do not duplicate handlers
4. no endless "Validation Running..." state

Optional temporary debug

Use ?cpt_debug=true and inspect:

• challenge response received
• solution generated
• hidden field .captcha_at_hidden_field non-empty before submit

---

If external sharing is needed as a gist, copy both this README and JS file into a GitHub gist.

rheinparkcenter-neuss-captcha-fix.js

/**
 * Rheinparkcenter Neuss newsletter captcha integration fix
 *
 * Drop-in replacement for the current custom click-based integration.
 *
 * Why this works:
 * - Uses KROT's native form interception (handles hidden field + submit flow reliably)
 * - Hooks on form submit semantics instead of button click recursion
 * - Works for click, Enter key, and other submit triggers
 */

document.addEventListener('DOMContentLoaded', function () {
  // Keep existing loader contract from customer page
  ensureKROTLoaded(function () {
    if (!window.KROT || typeof KROT.setup !== 'function') {
      console.warn('[captcha-fix] KROT not available');
      return;
    }

    KROT.setup('JgAZNlJMXyBMYABtNtgs-x-048b83c468b3c067945ddabaf5b93704a2faf036');
    KROT.KROT_HOST = 'https://www.captcha.eu';

    const input = document.getElementById('newsletter-registration-default-du-365972-captchaeu-1');
    if (!input) {
      console.warn('[captcha-fix] captcha input not found');
      return;
    }

    const form = input.closest('form');
    if (!form) {
      console.warn('[captcha-fix] form not found');
      return;
    }

    // IMPORTANT: do not pass 2nd argument true
    // true disables native interception and causes fragile custom flows.
    KROT.interceptForm(form);

    // Optional observability
    form.addEventListener('submit', function () {
      const val = form.querySelector('.captcha_at_hidden_field')?.value;
      if (!val) {
        console.warn('[captcha-fix] submit triggered without captcha_at_hidden_field value (SDK should fill this)');
      }
    }, { passive: true });
  });
});