Debugging JavaScript with Flask and PyCharm - javascript

I just installed the professional version of PyCharm for its Flask features, but I'm having a lot of issues getting anything JavaScript related working.
Firstly, is there any way of getting the browser to open when you run the flask project? There doesn't seem to be a Flask run configuration, which means you have to use the default Python configuration, and that doesn't have the option to run a browser. I tried making a JavaScript Debug project that runs the server as a Before Launch command, but it still doesn't open the browser (either Chrome or Firefox)
Secondly, how do I get PyCharm to hit the JavaScript breakpoints? Even if I manually browse to the flask server (http://localhost:5555/), Intellij doesn't hit breakpoints in my JavaScript, even though the JetBrains plugin is installed (again, in both Firefox and Chrome). I suspect this may be related to the fact that PyCharm doesn't open the browser, which is why I mentioned that as my first point.
Can anyone with experience in PyCharm or IntelliJ help me out?

Just solved this problem.
You need some setup steps.
My prerequisites:
PyCharm on my local laptop
I'm developing on remote virtual machine (droplet DO, Ubuntu)
Setup you web-server. It should be Apache, nginx whatever.
Setup you web-app. You web-app should be runned on web-server.
Setup your debug configuration:
a. Run->Edit configuration
b. Add->JavaScript debug
c. Specify you URL as real url from web-browser like:
http://YOUR_IP:YOUR_PORT/directory/category
d. Specify File/Directory of HTML template and remote URL where your template located.
e. Debug it.
f. Profit ! :)
P.S. So lovely evaluate JavaScript variables from familiar PyCharm tool :)
P.S2: Almost forgot: Need install Chrome extension: https://www.jetbrains.com/help/pycharm/2016.3/debugging-javascript.html#d615717e345

Related

NodeJS and client-side Javascript in Ember application

I am working on developing a client-side application built on EmberJS.
Now, while I test the code in the browser ultimately, I have the following locally for development;
NodeJS & NPM
I have defined bower.json & package.json
I use ember-cli & do ember build & ember server to start the local server
I hit the URL http://localhost:4200 in the browser to access the app
Now my question is I wanted to understand, what exactly is happening here ?
Meaning what exactly happens before code runs in the browser.
I understand when the build happens, it actually pushes code into the 'dist' directory.
Is there any role in NodeJS in all of this (meaning any JS run on server-side in the background) OR we just utilize npm/bower for this case ?
So I just wanted to connect all the dots regarding running in the browser.
browsers don't support the features of modern javascript, so when you end up deploying your ember site, you only need to deploy static files (from the dist directory), and you actually don't need a server at all.
This is how https://emberclear.io works (no server, just a CDN).
The NodeJS things are purely for pre-deployment needs (development, transpiling, testing, etc).
Hope this helps.

How to run and debug an AngularJS application in Eclipse?

I'm trying to get started with Nodeclipse. I would like to run and debug an AngularJS application, e.g. the angular-phonecat example from Eclipse.
In particular, I would like to
use a Debug on Server launcher to start a server with my application and open a web browser (Firefox or Chromium).
set a breakpoint in a JavaScript file in Eclipse
click around in the web browser and have the Eclipse debugger stop at the breakpoint.
(The equivalent of this does work in NetBeans in a very intuitive way.)
From the Nodeclipse help, I don't see how to get started or whether this is possible at all.
I managed to run an debug a Node.js project with the Hello World template, but I don't see how to debug anything running in a web browser.
Does that require a Remote Javascript debug launcher? If so, how to use it?
Finally, I don't see how to actually run an AngularJS application in Nodeclipse. As far as I can tell, the AngularJS Eclipse plugin only implements editing features but does not deal with running and debugging. Do I need to turn the Angular project into a Node.js application? If so, how?
AngularJS runs in browser, Node.js on server,
so you need different approaches.
Nodeclipse is primarily about supporting Node.js and has ChromeDevTools-based debugger. I cannot tell what is best for debugging browser JavaScript, maybe it is Chrome browser.
managed to run an debug a Node.js project with the Hello World template, but I don't see how to debug anything running in a web browser.
Ask on https://github.com/angelozerr/angularjs-eclipse/
Do I need to turn the Angular project into a Node.js application?
For Node.js run/debug it is not needed.

Cloud9 IDE serves old version of html page

I started a simple project with an HTML and a Java Script file. I ran the html file and everything was fine. I continued with the workspace on another machine and found that I could not see any changes I made to the html or js files when I refresh the browser panel in c9 IDE. It seems to keep serving a previous (cached?) version of the files. Restarting the run configuration (apache) did not make any difference.
How can I get the c9 IDE to run the latest files again?
Are you using Chrome? I had the same issue, I looked up and it was Chrome's fault. Started using the extension Cache Killer and that solved my problem.

debug Grails app's JavaScript from IntelliJ

I use IntelliJ to develop Grails apps and when testing locally, I usually launch the app from IntelliJ which runs the app in an embedded Tomcat server. IntelliJ provides JavaScript debugging, but until now I've always used Firebug, but the idea of being able to use IntelliJ for all my debugging is pretty appealing.
I tried setting a breakpoint in IntelliJ and lauching the app in debug mode from inside IntelliJ, but the breakpoint was ignored. I also tried launching the app from outside IntelliJ via grails-debug run-app, then connecting to it with a remote JVM debugger, but the breakpoint was still ignored. Does someone know how I can debug JavaScript of a Grails app launched from IntelliJ?
I'm using IntelliJ Ultimate Edition version 13
Actually you need to do some extra work for debugging JavaScript with IntelliJ. Here are some useful articles about how you can configure your IDE and browser for JS debugging.
http://blog.jetbrains.com/idea/2011/03/intellij-idea-debugging-javascript-in-google-chrome/
http://wiki.jetbrains.net/intellij/Debugging_JavaScript_with_IntelliJ_IDEA
After configuration you need to just run your Grails application in debug mode.

Eclipse config for Java Script

I am new to Eclipse - inherited unfinished project after employee who left. I downloaded war file and by trial and error installed missing components till it actually built app. I can edit java files, but when I try to open java script files, I get error:
Could not open visual page editor
no more handles
could not load SWT library
no swt-xulrunner-gtk-4234 in java.library.path
Linux Fedora 17, Eclipse Juno, SWT is reported as installed by yum. ~/.swt/lib/ is empty
It looks like you do not have the proper library to load browser widgets in your Eclipse, that is what swt-xulrunner refers to. This FAQ should help you.
What it is saying is that you need to start Eclipse with the following system property:
-Dorg.eclipse.swt.browser.XULRunnerPath=<path_to_xulrunner>
There should be a xulrunner already included in your Eclipse, but if not, you will need to download a new one from here.
Also, it could be that you are using the Ubuntu pre-packaged Eclipse. I would avoid doing that. This pre-packaged eclipse often has some missing things in it. I'd instead recommend downloading directly from Eclipse.org

Categories