Adding textinput component to HTML5 Canvas file causes error

[mcarlson]

I have an HTML5 Canvas file that I am working on and I'm trying to add a TextInput component. When I add this to the stage and publish the document, about 20% of the time it works fine, but the other 80% of the time I get the following error:

Uncaught TypeError: $.anwidget is not a function
at textinput.js?1592851832585:3
at textinput.js?1592851832585:25

Any idea what's going on here?

[PrashantGupta]

@mcarlson-VUb8WC Could you please share sample canvas file to help us see this issue?

[mcarlson]

Sure, here you go: https://www.dropbox.com/s/k6m0br9w8qvhf7m/test.fla?dl=0

Since the error only happens on publish sometimes, I'm assuming it has something to do with needing to initialize things first. I haven't used Animate since it was Flash, so it's been a while, and the HTML Canvas option is obviously new to me. I'm finding it hard to find good documentation on best practices for publishing to HTML Canvas, so any help is greatly appreciated.

[PrashantGupta]

Tried with multiple test movie (ctrl+ enter) output and no error so far for me. I will try with some more textInput components. 

Are you facing this error with test movie output or you published output files and put files on some server for testing?

On test movie/publish, components folder generates in output which contains component defintion files (anwidget, textinput in this case). Just check if components folder is coming in your output or not.

Also it might be possible if browser is not loading on first time , try just refreshing/reloading the page if it helps.

[mcarlson]

This happens about half the time when testing the movie (ctrl + enter), and once published, if the error is there, refreshing the page does not clear the error. This is happening when testing on my local machine. I haven't published the files to a server for testing.

The components folder is generating when I test.

[mcarlson]

And actually, it seems like something in the test/publish process. If it publishes successfully, I can reload it multiple times and it always works, but if it publishes with the error, I can reload it multiple times and it never works.

[PrashantGupta]

Thanks for the update. If you see this error again, keep a copy of generated output folder with all files (html,js, images, components etc) and share with us to look into it.

[mcarlson]

Sure. Here you go: https://www.dropbox.com/sh/gdv43hw3m28d6r3/AADqwiVSLe_pKrV6h-yLMdn5a?dl=0

If I look at components > sdk > anwidget.js, it is zero bytes and trying to open it results in "Item is used by macOS and can't be opened." It's like this file doesn't complete being generated sometimes.

[PrashantGupta]

Hmm thats why its giving the error in TextInput in output. But i didnt get this issue on my mac even after multiple test movie output. Are you doing some specfic steps (like editing text , movieclip) in between test movie ? 

[mcarlson]

No, even if I just open the existing FLA and test it without making any changes, I get the error 30-50% of the time. I thought there might have been something wrong with my Animate install, as the timeline keyframes were really large and gave no indication of actions or labels on them. I uninstalled it and reinstalled it, which solved the keyframe issue, but did not fix this textInput component issue. Not sure what else to try. It's very frustrating when you have to publish several times to get a working test.

[PrashantGupta]

and you are using latest Animate 2020 (20.5 update) ?

what's the macOS version?

Meanwhile as its most likely happening due to anwidget.js file (which doesnot change), could you please try following: once you get successful working output , go to components > sdk location and make the anwidget.js file Read Only , then on subsequent test movie this file should not overwrite and hence no TextInput error. Please try and see if it helps.

[mcarlson · Accepted solution]

Ah, I believe I figured it out! I was trying your suggestion of locking the anwidgest.js file, but for some reason it wouldn't stay locked. I would lock it and it would immediately unlock again. I thought maybe this was happening because the files are in a directory that syncs to Dropbox, so I moved the file out of Dropbox and was able to successfully lock the file. This made me think the entire issue may be because the files are syncing to Dropbox, so I moved the files to my desktop and tried testing the file from there. I tested it multiple times and could not replicate the error, so I'm assuming that must be the issue. I guess I need to move the folder out of Dropbox while working on it, and then move it back when I'm done.