Superform Home

Debug

Detailed console output for debugging.

Setup

Attribute: sf-debug

Values: none , true or steps

Default: false

Where: Apply to the script tag of Superform within the <head> or just before </body>.

Enables detailed console output for debugging purposes during form interaction. It logs form data, step count, progress percentage, and scores at each step change, providing a collapsible and organized view of form state changes.

Enables also step expansion for total control of all steps at the same time inside a debug view.

1. sf-debug or sf-debug = true

Console logging of data.

index.html
<!-- Superform by Delta Clan -->
<script defer sf-debug src="https://cdn.jsdelivr.net/npm/@deltaclan/superform@2/dist/superform.js" >
</script>
Setting sf-debug inside the script tag.
Console output of sf-debug and/or sf-debug=true
Console output legend.

2. sf-debug = steps

Activates console logging alongside step expansion specifically designed to enhance debugging in multi-step forms. By enabling sf-debug="steps", you can ensure thorough oversight and easier management of form dynamics.

index.html
<!-- Superform by Delta Clan -->
<script defer sf-debug="steps" src="https://cdn.jsdelivr.net/npm/@deltaclan/superform@2/dist/superform.js" >
</script>
Example. Expanded steps inside Wized to control all elements at the same time inside a multistep-form.

Last updated

Was this helpful?