Rendering in Aptana Different than in a Static Browser - javascript

I am experimenting with developing a primitive web interface using Aptana Studio 3, and when I run the site from Aptana as an internal server in either IE or Firefox, the page renders as I expect. In contrast, when I open the same HTML page in a browser (i.e. not running it through Aptana), it displays incorrectly (e.g. modal dialog appears at the bottom of the page rather than as modal when I click a button).
I tried different "meta" compatibility commands at the top of the HTML code to see if I could duplicate how Aptana opens the site. I am not sure if JS and JQuery need to be run as a server or if this is an indication of a bug in my code. If it is a requirement to run JS, JQuery, and bootstrap in a server as Aptana does, any guidance on how to duplicate what Aptana is doing in a standalone offline fashion would be sincerely appreciated.
Note: This is a for a class assignment. The assignment is unrelated to JQuery and Javascript; rather it is on UI design patterns and software engineering. The reason I am using JS and JQuery is I thought this assignment would be a good opportunity to become more familiar with those tools.

For most standard browsers, many jQuery features do not render/appear correctly if they are not run inside a web server. When entering debug or run mode in Aptana, it is in the background starting a local web server. If you want a free web based server, I recommended using the "rawgit" feature bundled with Github; this is what I ended up using. For more information, see here:
https://rawgit.com/

Related

Chrome silently embedded in desktop application, and that can save files locally via Javascript

Is it possible to have a Python application with a GUI (such as TkInter or WxPython) with :
a Chrome browser as a widget using the main part of the GUI, displaying a certain .html page
be able to save files locally thanks to Javascript that is run in the embedded Chrome (that is normally impossible with any browser for security reasons)
If it's not possible in Python, I'm open to use another language (C++, etc.).
You mention that you're open to trying platforms other than Python. Have you seen Electron? It's a framework and runtime for building desktop applications in JavaScript with full access to the file system made by GitHub. It's based on Chromium, the same open source project that Chrome is based on.
http://electron.atom.io
http://electron.atom.io/docs/api/file-object/
Yes, it should be doable. In current versions of wxPython there is the wx.html2 module, which provides classes for embedding a fully featured browser in a wx window. It's not Chrome itself, but probably close enough. See https://wxpython.org/Phoenix/docs/html/wx.html2.WebView.html
For your task you can probably have the javascript trigger an action which is caught by event handlers in the application GUI code, which will then save the files or do whatever you need.

Debugging Visual Studio web application in Release Mode

I have a Visual Studio 2013 Web Application project that breaks when in Release mode. No console errors are thrown and I think that it must have something to do with script minifying/concatenating. Everything's fine when I build in Debug Mode.
So I'm trying to figure out how to debug when in Release mode and having no luck.
Most articles, like this one, suggest modifying C/C++, Linker and other properties... but I don't have see those options, I assume because I'm working on a web app project.
Are there other ways I can enable debugging, break points, console.logs, etc in Release Mode?
If you're trying to debug a web application then no you're not going to see those options, as they're only available for C++ solutions. To debug a C# or VB web application you need shouldn't need to do any special configuration.
If it's not working however there are some simple things you can check, firstly that the PDB files are generated. These are essentially debug symbols that match the original source code up to the compiled output, allowing visual studio to step through the code and they should be placed in the same directory as your DLLs.
Once you've got your PDB in place all you need to do is attach the debugger. Now for a web application this can be a little confusing at first (if you're using IIS). IIS has several application pools:
The IIS process that you want to attatch to is called w3wp which is a little confusing at first. And potentially there are several of them (one for each AppPool that is active and running). Make sure you've got the Show processes from all users checked to see the processes listed:
To make this whole process easier, if you're running a version of Visual Studio that allows extensions take a look at AttatchTo. It adds a menu option you can click (and convert to a toolbar button/shortcut) that will automatically attach to all the IIS instances to debug your code.

The breakpoint will not currently be hit. No symbols have been loaded

I am struggling with breakPoint issue in VS 2012 for more than hours. I am from eclipse background, there I never heard about such issues.
Problem :
The breakpoint will not currently be hit. No symbols have been loaded
for this document.
I have placed the break point in click action of Jquery.
I found the issue using the IE script debugging., The file loaded was old file., i.e I have modified a lot, but I can see no changes in the one which is loaded in IE. How to fix the bug
What I have Tried :
I know this question is duplicate, but being a newbie to VS and C#., I could not understand the older answers. For example, in this answer, he told to choose Debug -> Windows -> Modules. But I doesn't have Modules under windows in VS 2012. Also even though I read, I could not understand the explanation.
Also I am quite new to term Assemblies and PDB. Though, I located PDB files as he said. But how to open the .pdb file?
Need :
Could anyone explain me the same answer in easier term (with more explanation).
I found this out by accident with my VS2012 and ASP.NET MVC, maybe it can help somebody. I noticed that breakpoints in javascript that's inline in the *.cshtml file like this won't get hit (note that this file is a cshtml file):
But breakpoints in external *.js files will get hit:
Try to add debugger; key word before $.getJSON
Also make sure if you use IE to un-check the disable script debugging
Internet Options> Advanced tab> Under Browsing.
As I think this issue is related to Javascript debugging not C#
This results for me:
In your web application make sure Silverlight and ASP.NET debugger are enabled.
How to get there?
=> Right click on the Web Application => Properties => Web tab. Under Debuggers section make sure Silverlight and ASP.NET are enabled.
Running Visual Studio 2013 or Visual Studio 2015 RC, I've found that to get a breakpoint to work in a .js file I need two things to be true:
I need to start Visual Studio by right-clicking the VS shortcut and select "Run as administrator". (If right-clicking on the Taskbar icon, select the application shortcut icon from the pop-up menu and right-click on that to get a context menu that includes "Run as administrator".)
I need to set Internet Explorer as the default browser that will be opened for the web debugging session. If I choose Chrome or Firefox, the breakpoint doesn't work for me.
After opening and closing VS, rebooting the PC with all with no chance, this workaround worked for me in VS 2012 ( Ver 11.0.50727.1 RTMREL ):
In Project Property Pages, under Start Options, in Debugger section, only ASP.NET was enabled. As soon as I enabled Native Code and SQL Server, that red circle with plus sign inside, enabled again.
No idea why this worked! No active connection in Server Explorer nor using any native code in the project!
I had the same problem. You can use VS2017 to debug JS code this way.
When you set VS to launch the browser (Chrome in my case), it opens a new Chrome window. I was trying to debug the specific code (different URL from the window that opened) in a new tab. So I had the 'The breakpoint will not currently be hit. Breakpoint set but not yet bound' in VS.
I found out that if I opened the new URL in the original tab it suddenly worked. Seems that VS is tied to that particular tab.
Hope this helps.
These are the particulars of my situation: VS 2017 - Mainly C# code with some embedded HTML/JS which I needed to debug, Chrome (Version 68.0.3440), Windows 10
As this is Javascript code, so you need to use a javascript debugger. Generally internet browsers come with a debugger/inspector menu, which allows you to inspect/debug your javascript easily. Such debuggers come with a lot of useful features such as HTTP request/response inspection, browser session/local storage, etc.
Actually there is "Modules" option, but it's enabled only when you are in debug mode.
You can just press Ctrl+D,M combination when you're in debug.
In few words, PDB is a file that contains all debug information about your assebmly, you can not debug an assembly without this file. Assembly is a file that contains precompiled code for exetuion via CLR.
Could you provide a bit more information about your problem. What kind of application you are trying to debug for example?
Also, if you have located you pdb files made EXACTLY for your assembly, you can load it by right-clicking your assembly in modules window and selecting Load Symbols From > Symbol Path
Try deleting all breakpoints and restarting debugging in Visual Studio.

Javascript, Firebug: How do I have multiple views or what is the right of way of doing development?

Most of my javascript work is done with Firebug and I feel annoying most of the times having to switch between the HTML mode and console mode (which again I split into output mode and input mode). When I switch to a different page to see the HTML and come back, I lose the code that I write. What is the best way to go about developing javascript applications using firebug?
Something like a mini IDE would be awesome: It just has to let me insert some code, examine the current page and then let me execute it. Any suggestions?
I use a simple text editor (vim) to write Javascript and HTML, and I check the result every now and then in Firefox. I have always two windows open: one for my text editor, and one with the current page open in Firefox. After saving a change in the Javascript, I switch to the browser and refresh the page to observe results. That was my workflow until recently.
A couple of weeks ago, I discovered the Combiner tool by Nicholas C. Zakas. To release my Javascript code, I am now using a complete build process based on Apache Ant, similar to what I was using while doing Java development previously.
The first step is to check the Javascript code with the JSLint tool by Douglas Crockford. I used to painfully copy and paste my Javascript code in the online version of the tool, once in a while; being able to run it on all my Javascript files at once with this Ant script is a huge convenience.
The second step is to combine all my Javascript files into a single file using the Combiner tool. The third step is to minify the Javascript code using YUI Compressor by Yahoo!. These last two steps allow to optimize the delivery of Javascript code to reduce page loading.
You can find an example Ant build file that you may adapt to your own needs. I am currently using this file to build my own Javascript library, bezen.org.
The other answers so far have been correct: I've never heard of anyone actually developing inside Firefox/Firebug, because it's a tool designed for debugging, not coding. To do your coding, you should use a tool designed for it (either a text editor or a full-fledged IDE).
But that being said, you might want to check out FireEclipse (Link). It will allow you to integrate Firebug with the Eclipse IDE (which itself has at least three different JS plug-ins to choose from). Alternatively I think the main (aka Web Standard Toolkit, aka WST) JS editor for Eclipse has some functionality which is similar to Firebug, but I've never used it so I don't know the details.
Hope that helps.
Write your HTML in an editor/IDE
Save your changes
Preview it in your browser
Debug using Firebug
Make your code edits in your SOURCE CODE
Repeat
Firebug is for debugging and allows you to do some "what if" fiddling while the page is live. This is not a replacement for an IDE.

Loading IIS website in Eclipse

I am not sure if there's a way to load an IIS website into Eclipse. Similar to the way we can load in Visual Studio through File > Open Website
Thanks
Short answer: no.
Slightly longer answer: with an open source web application server such as Tomcat you can run it inside Eclipse. You can set breakpoints, check variable values at runtime, etc. However, Microsoft is about as far from open source as you can get; if you want to run IIS through a debugger, you're going to have to use Visual Studio or some similar MS-only tool, because that's how MS designs things.
Of course, as Kekoa pointed out, you can always load the individual files in Eclipse, but then you're just using it as a glorified text editor; to get the full power of all of it's "IDE" capabilities, you really need to use a non-MS (and non-proprietary in general) stack.

Categories