How to "refresh" a widget's code while editing it

[StephenLead]

I'm playing around with Adam Drackley's excellent Local Layer Widget and am making changes in the Widget.js file

What is the best way refresh a web app when changes have been made to a widget's JS code?

1) re-loading an existing web app (eg http://localhost:3344/webappbuilder/?id=17) doesn't show the updated code

2) creating a new app from the homepage (http://localhost:3344/webappbuilder) doesn't show the updated code (edit: it seems to work now)

3) closing and reopening the Node window (opened by the startup.bat file) sometimes shows the updated code (but not consistently)

Is there a method to load the latest version of a widget's code without restarting the Node server?

Thanks,

Steve

Message was edited by: Stephen Lead

[StephenLead]

Thanks Larry, that's a good workaround.

[BedaKuster]

We are doing the same. If you are using Google Chrome or Opera, you can connect the Developer Tools (F12 / CTRL + SHIFT + I) to your local filesystem. After this point you have full access to all your js/css/html files from Developer Tools. If you make changes with the css property inspector, the changes are saved to the stylesheets instantly and you don't have to copy them everytime.

JS-Debugging works great, you even can edit js code while debugging and you don't have to refresh the page anymore (except you are implementing new object-based functions). The js editor brings some simple kind of code completion.

Since we detected this feature, we are only using this "IDE" to develop widgets.

Workspaces - Persistent authoring in the DevTools - Google Chrome

[AshokVanam1]

Thanks for this info. It helped me to find the quick solution for editing and debugging.

[DouglasGennetten]

What I have found works best is this process:

1) make code changes (directly in stemapp/widgets/mywidget)

2) delete widget in app, save.

3) F5 refresh browser

4) Re-add widget.

On annoyance I've had, when pulling a widget from source control into stemapp, if I don't first shut down the server, that widget gets added to the widget picker a bunch of times, and seems to stay that way.  To remove the extras, I've done a full wab install replacement. There's got to be a much better way, I presume?

[LarryStout]

I have a batch file that checks port 3344 to see if all of the listeners have been released.  Sometimes it takes a minute or two after you stop node.js.  The batch file has one line:

cmd /K "netstat -aon | findstr "3344""

Larry

[DavidWendelken]

Hi,

I use the workflow in this thread:  https://community.esri.com/thread/170066#comment-576497 

I'm using v2.3.

In addition, I go to the \server\apps\{app#}\init.js file   where {app#} is a 1, 2, 3, etc. that matches the application map I'm working in.

In it, there is a line of code like this, but with various fields inside the curly braces:

dojoConfig = {  

};

I added this to the list and haven't had a problem since:

dojoConfig = {

   cacheBust: true

};

Of course, that will probably need to be removed in the deployed version to get the advantages of caching in a production environment.

Hope that helps!

[DavidWendelken]

I no longer recommend setting cacheBust = true.   The v2.3 product has a serious bug that will cause widgets and icons not to display.  (Of course, a future version might fix the problem.)

javascript - CacheBust in dojoConfig breaks paths - Stack Overflow 

[GisGKAuckland]

Larry's suggestion works but has anyone had any luck with the nodemonitor?

Helps me avoid big copy of files for small changes. I found this page nodemon 

and the syntax I believe is 

nodemon ./server.js localhost 8080

Not sure what the parameters should be when it's WAB?

[RebeccaStrauch__GISP]

I have no idea really, but have you tried 3344 instead of 8080?

[GisGKAuckland]

Yes I tried that but DevMon doesn't like it.

What I can infer is that Nodemon is working in the server directory and that's why all changes are reflected. I would like to do the same in the client folder.