Form Preview May Not be able to Test Step/Stage Specific Javascript

posted on March 25 • Show version history

Forms Version 12.0.2509.20409 Layout Designer.

After an hour or so trying to figure out why my Javascript was not working as expected, it finally dawned on me the issue is based on the way that the Preview works.

On the Preview, you can select which step/task you want to use for previewing the form, and this is great. But what isn't apparent with this is that your Javascript isn't re-run when you change which step/task you are viewing.

So if you have some Javascript that is step/task dependent (using properties like LFForm.step.name) that Javascript is loaded when the Preview first loads, prior to selecting the step/task from the drop-down. And it isn't reloaded when you change the step/task. You can't use the browser to refresh the page as that just starts the preview all over. As far as I can see, you can't tell it to re-run your Javascript on the new step/task.

This means that your code that is step/task dependent isn't going to work like you expect (unless you have it triggered by user action, like a button - or some other event).

I don't know if there is any workaround for this, and it's probably only an issue for 0.001% of situations, so this post is mostly about saying:

Did you realize it worked this way? Maybe now that you know you can avoid that frustration of spending way too long trying to find a bug in your code that isn't actually a bug, but just a difference in how the Preview works versus an actual run of the step/task.

4 0

replied on March 25

Well well well, I was wondering when someone would run into this issue and report it. We discussed this at length when we added the feature way back when. It really is a catch 22, we could give you the ability to rerun JS but it would then cause other adverse affects like rerunning business logic that has already run. You'd end up trying to fix edge cases that would never show up in a live process.

Another option was using url parameters to set the step/stage, but this would conflict with filling form fields and had potential breaking changes to the millions of ways people use forms.

The final option was preserving step/stage on refresh, but we were afraid people would get confused that the form looks different when loading a new preview.

There really isn't a workaround outside of testing in the actual process (not preview). Although you could bundle each page's business logic into functions and rerun those manually either through the dev console or through a window function.

I am open to ideas though. What was the exact issue you had? Was it code just not running when the step wasn't defined? You could add the isPreview flag to your condition so the code always runs.

2 0

replied on March 25

This specific instance is behavior I am trying to trigger at the time of the form loading. It looks at every field on the form that has a specific class and checks for a specific value in the field (populated from a prior step/task or from workflow). Based on that field value, it'll do one of a couple different things to that field, which is dependent upon both the field value and the current step/task. So with the Preview, I was loading the form, selecting the first step/task to populate the field values, and then selecting the second step/task to check that things worked, and they never did. It took me an embarrassing amount of time to realize that it wasn't working because the code had all been run prior to anything I did on the form.

I don't really think there is a good solution for it. This was just something that I hadn't considered and it tripped me up.

Maybe just having some text on the Preview page would have saved me some confusion. Something like "Please note that any custom Javascript is not re-run after changing the step/task; unless it is triggered by a specific event such as a field change or button click".

0 0

replied on March 26

I'll think about it, thats a lot of text to show every time you load the preview pane haha.

For your use case though, if you have the step logic contained in a single function you could have

if (LFForm.isPreview) {
  window.step2Function = step2Function;
}

And then you could call it manually from devtools as you progress the step/stage. Its a little wonky, but you'd be testing the exact same code that would run otherwise so it should be true to form.

1 0

replied on March 26

I'll play around with that.

I was able to confirm my code is working by actually running the process in Test Mode, so I did verify my code.

This post was mostly just about the fact that this caught me off guard, and I wanted to spread the word a little bit.

As always, thank you for your help and guidance @████████!

1 0

Discussion

Discussion

Form Preview May Not be able to Test Step/Stage Specific Javascript

Comments 4

Follow-Ups 0

Sign in to reply to this post.