search

surveyjs / survey-creator

Scalable open-source survey software to generate dynamic JSON-driven forms within your JavaScript application. The form builder features a drag-and-drop UI, CSS Theme Editor, and GUI for conditional logic and form branching.
https://surveyjs.io/open-source
Other
862 stars 363 forks source link

React / React Router: "Cannot find template with ID choice-action" on route change #1502

Open lcfd opened 2 years ago

lcfd commented 2 years ago

Are you requesting a feature, reporting a bug or ask a question?

Reporting a possible bug

What is the current behavior?

When the user changes the route using react-router before survey-creatore is fully loaded it triggers this error:

Uncaught Error: Unable to process binding "foreach: function(){return actions }"
Message: Unable to process binding "if: function(){return !!$data.template }"
Message: Unable to process binding "template: function(){return template }"
Message: Cannot find template with ID choice-action

at a.ba.a.ca.makeTemplateSource (knockout-latest.js:118)
    at ko.surveyTemplateEngine.makeTemplateSource (kosurvey.ts:383)
    at ko.surveyTemplateEngine.a.ca.renderTemplate (knockout-latest.js:119)
    at e (knockout-latest.js:125)
    at a.$.Sa (knockout-latest.js:127)
    at Function.yd (knockout-latest.js:55)
    at Function.zd (knockout-latest.js:55)
    at Function.ha (knockout-latest.js:54)
    at Object.a.o.a.$ (knockout-latest.js:52)
    at Object.a.dc (knockout-latest.js:127)
    at update (knockout-latest.js:130)
    at a.$.l (knockout-latest.js:79)
    at Function.yd (knockout-latest.js:55)
    at Function.zd (knockout-latest.js:55)
    at Function.ha (knockout-latest.js:54)
    at Object.a.o.a.$ (knockout-latest.js:52)
    at knockout-latest.js:79
    at Object.D (knockout-latest.js:11)
    at p (knockout-latest.js:78)
    at k (knockout-latest.js:76)
    at m (knockout-latest.js:76)
    at Object.a.Oa (knockout-latest.js:84)
    at a.o.l (knockout-latest.js:104)
    at Function.yd (knockout-latest.js:55)
    at Function.zd (knockout-latest.js:55)
    at Function.ha (knockout-latest.js:54)
    at Object.a.o.a.$ (knockout-latest.js:52)
    at init (knockout-latest.js:104)
    at knockout-latest.js:79
    at Object.G (knockout-latest.js:41)
    at knockout-latest.js:79
    at Object.D (knockout-latest.js:11)
    at p (knockout-latest.js:78)
    at k (knockout-latest.js:76)
    at Object.a.vc (knockout-latest.js:85)
    at knockout-latest.js:125
    at b (knockout-latest.js:124)
    at c (knockout-latest.js:125)
    at r (knockout-latest.js:128)
    at a.a.ec (knockout-latest.js:136)
    at Object.G (knockout-latest.js:41)
    at x (knockout-latest.js:127)
    at Object.a.Qd (knockout-latest.js:129)
    at Object.update (knockout-latest.js:130)
    at update (knockout-latest.js:101)
    at a.$.l (knockout-latest.js:79)
    at Function.yd (knockout-latest.js:55)
    at Function.zd (knockout-latest.js:55)
    at Function.ha (knockout-latest.js:54)
    at Object.a.o.a.$ (knockout-latest.js:52)

Freezing the entire application.

What is the expected behavior?

Gracefully fail or manage the error.

How would you reproduce the current behavior (if this is a bug)?

Specify your

tsv2013 commented 2 years ago

Can you provide us with a minimal sample illustrating the issue?

lcfd commented 2 years ago

@tsv2013 I've added the stack trace of the error.

There are 3 of them:

I can't quickly reproduce the error, I'm a little bit busy right now. We are using it in a normal create-react-app.

lcfd commented 2 years ago

Hello @tsv2013

I've made a CS that you can use to reproduce the bug. Just quickly click on the two links alternately.

https://codesandbox.io/s/r9eug?file=/example.js

I hope this can help, let me know 👋🏼