[BUG] Wizard endless looping to first page on certain devices on long forms

[Alexa-Green]

Environment

Please provide as many details as you can:

• Hosting type
  • [x] Form.io
  • [x] Local deployment
    • Version:
• Formio.js version: 4.14.8
• Frontend framework: React
• Browser: Chrome
• Browser version: Tested on:
  • Mac / Chrome Version 103.0.5060.114 (Official Build) (x86_64) - bug is happening
  • Mac / Chrome Version 103.0.5060.134 (Official Build) (arm64) - bug is not happening
  • PC / Version 103.0.5060.134 (Official Build) (64-bit) - bug is happening on one machine and not on another, both PCs
  • PC / Version 103.0.5060.134 (Official Build) (32-bit) - bug is not happening

Steps to Reproduce

1. Create a really long wizard form - e.g. 20+ pages with components, data grids, and anything to bulk up the components JSON.
2. Click Continue on the first page of the form. It will move on to the next page (expected)
3. Keep moving through the form, and on some devices clicking next on later pages (it varies which one) will loop it back to the first page, then you'll be stuck there and clicking "Continue" does not do anything

Expected behavior

Wizard works normally, going through all pages and not looping back to first page and getting stuck there

Observed behavior

On random devices (no pattern found yet, see tested browser versions above) clicking "Next" on certain wizard pages will loop it back to the first page, then clicking Next on that page will not allow continue or increase the page. No errors show in the console.

The fact that the logic is working on some devices is suspicious, as well as the fact that it has only been observed with a really long form.

[travist]

Thanks @Alexa-Green for bringing this to our attention. We are going to look at this issue in our next planning session to see if we can allocate a developer to investigate. Upon first glance, it seems that we are allowing the page index to increment before the page is rendered and the index is allowed to update before the previous page has rendered, thereby getting them out of sync. I am pretty sure the code that would be doing this is here.

https://github.com/formio/formio.js/blob/master/src/Wizard.js#L642

This is in the formio.js repo, so we may need to move it over there to track it in the repo it is occurring. Regardless, thanks for reporting.

[Alexa-Green]

@travist Thanks!

[daneformio]

Closing this thread as it is outdated. Please re-open if it is still relevant. Thank you for your contribution!