SL-374/SL-375 Card flow rework: inline Fields, Payment Page routing, remove Transaction Interface

[justelis22]

Part of SL-350 settings redesign. Phase 4 — card flow rework. Verified live on a TEST account (Business + Fields) incl. 3-D Secure.

Tickets

• SL-374 — route cards to the Saferpay Payment Page when Custom Form is OFF; remove the legacy Transaction Interface entirely.
• SL-375 — render Saferpay Fields inline in the default checkout; grouped single "Cards" form; remove the "Inline Layout with Card" hosted-field style; retire the hosted Fields page.

What changed

• Routing: Custom Form ON -> inline Fields; Custom Form OFF / non-Business -> Payment Page. Transaction Interface no longer selectable.
• Inline Fields: a single shared Saferpay Fields form (the SDK binds to fixed element IDs, has no re-init) placed once and shown under the selected card. Submit is intercepted and routed through the existing submitHostedFields AJAX flow. No-JS fallback is the Payment Page.
• Grouped cards: the "Cards" option renders one inline Fields form accepting all brands.
• Admin: removed hosted-field style option 3; clamped stored value to 1-2 (legacy 3 degrades to default); repositioned + reworded the info box.
• Removals: iframe/successIFrame/failIFrame/hostedIframe controllers, saferpay_iframe + hosted-template tpl/js/css, example-card assets, and the dead PaymentType::IFRAME / ControllerName IFRAME branches. Kept the checkout hosted_fields.js (saved-card handling).

Live verification (test store)

• Ungrouped Visa, new card + 3DS -> order confirmed.
• Regression after the file removals -> order confirmed.
• Grouped "Cards", Mastercard + 3DS -> order confirmed.
• Switching between card options keeps the fields working (no iframe reload).

Known follow-ups

• The "Hosted field style" (Classic/Labeled) selector no longer affects the inline form (inline uses theme styling); consider wiring or removing it.
• Saved-card inline recharge uses the unchanged hosted_fields.js path — recommend a smoke test.
• Compiled bundle (views/js/admin/dist) is gitignored / built in CI.

[gemini-code-assist]

Code Review

This pull request removes the legacy iframe and hosted iframe payment flows, deleting several obsolete controllers, templates, and assets, and introduces inline rendering of the Saferpay Fields card form directly in the default PrestaShop checkout. Feedback on the new inline-fields.js file highlights a critical bug where calling JSON.parse on an already-parsed AJAX response will throw a SyntaxError, and an issue where the inline form is not displayed on page load if a card option is pre-selected. Additionally, it is recommended to add a safe fallback for the global holder_name variable to prevent potential ReferenceError exceptions.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

[gemini-code-assist]

Critical Bug: Since the server response is rendered with ajaxRender (which sets the application/json header), jQuery automatically parses the response into a JavaScript object. Calling JSON.parse() on an already-parsed object will convert it to the string "[object Object]" and throw a SyntaxError, causing the checkout to always fail with an internal error.

We should check if the response is a string before parsing it, or directly access the url property if it is already an object.

                    success: function (response) {
                        try {
                            var data = typeof response === 'string' ? JSON.parse(response) : response;
                            if (data && data.url) {
                                window.location = data.url;
                            } else {
                                $('#' + SLOT_ID + ' .internal-error').show();
                            }
                        } catch (e) {
                            $('#' + SLOT_ID + ' .internal-error').show();
                        }
                    }

[gemini-code-assist]

Issue: If a Saferpay card option is pre-selected on page load (which is common in PrestaShop checkout or custom themes), the inline fields form will not be displayed because the change event listener has not been triggered yet.

To fix this, we should trigger the change event on the currently checked payment option immediately after registering the event listener.

        // Reveal / hide the shared form as payment options are selected.
        $('body').on('change', 'input[name="payment-option"]', function () {
            var $option = $('#pay-with-' + $(this).attr('id') + '-form');
            var $form = $option.find('form').first();

            if ($form.length && isInlineFieldsOption($form) && selectedCardValue($form) <= 0) {
                revealUnder();
            } else {
                hide();
            }
        });

        // Trigger the change event on load to handle pre-selected payment options.
        $('input[name="payment-option"]:checked').trigger('change');

[gemini-code-assist]

Improvement: If holder_name is not defined globally (e.g., if the asset loader fails or under certain checkout configurations), referencing it directly will throw a ReferenceError and halt script execution.

It is safer to define a local fallback variable at the top of the IIFE, similar to how saferpay_internal_error is handled.

Suggested change

	(function () {
	if (typeof saferpay_field_access_token === 'undefined' || !saferpay_field_access_token) {
	return;
	}
	var SLOT_ID = 'saferpay-inline-fields';
	var initialised = false;
	(function () {
	if (typeof saferpay_field_access_token === 'undefined' || !saferpay_field_access_token) {
	return;
	}
	var SLOT_ID = 'saferpay-inline-fields';
	var initialised = false;
	var safeHolderName = typeof holder_name !== 'undefined' ? holder_name : 'Holder name';

[gemini-code-assist]

Use the safe fallback variable safeHolderName to prevent potential ReferenceError exceptions if holder_name is not defined globally.

Suggested change

	' <label for="fields-holder-name" class="sr-only">' + holder_name + '</label>' +
	' <input class="form-control" id="fields-holder-name" readonly placeholder="' + holder_name + '" aria-label="' + holder_name + '">' +
	' <label for="fields-holder-name" class="sr-only">' + safeHolderName + '</label>' +
	' <input class="form-control" id="fields-holder-name" readonly placeholder="' + safeHolderName + '" aria-label="' + safeHolderName + '">' +

[gemini-code-assist]

Use the safe fallback variable safeHolderName to prevent potential ReferenceError exceptions if holder_name is not defined globally.

Suggested change

	holdername: holder_name,
	holdername: safeHolderName,