How to force the current script to be used? - javascript

I have an asp.net mvc 3 project that I am developing in Visual Studio 2010. In the scripts section I have a library that I wrote. I made a change to the library. However, I notice that the change does not show up when the program is run in the browser. When I look in the debugger of firefox it shows the old version loading. I have tried cleaning the project, rebuilding, building, closing firefox, ctrl f5 on the page. How can I get the current version of the script to load?

There are two commonly accepted ways of doing this:
Option 1
Best option, in my opinion. Give the script a version number. Must remember to change the version number with every release
<script src="mylib_v4.3.js"></script>.
Option 2
The other is nowhere near as good because it can kill caching. Some browsers will re-request the script each invocation. (I really don't know the which browsers have which behavior.)
<script src="mylib.js?version=4.3"></script>
Option 3
The other option is to keep your scripts in a version directory.
Actually, in my PHP code I have
<script src="/js/ver##VERSION##/mylib.js"></script>
and my php code does a replace of ##VERSION## with the release version. This way my build scripts create a directory tree to upload and set paths right. If you have server side support, this method works very well.

Add a "version parameter" to the script reference :
<script src="/scripts/myscript.js?version=0.2"></script>
That method has the advantage of also doing the job when the your application is being used by clients, and you want to force their browsers to get the newest version when you update your app.

Clear your browser cache and disable it.

Related

Netbeans 7 - jquery code completion [duplicate]

I'm using NetBeans for PHP.
When I edit a .js file, it gives me javascript code completion.
How can I get it to also give me jQuery code completion?
First go to Tools -> Options -> Miscellaneous and click on the Javascript tab,
make sure the targeted browsers are configured properly, code completion changes by the minimal version of the targeted browsers to make sure that the functionality is supported.
You also need to add the jquery js file to your project so netbeans would be able to parse it and to properly add code completion.
These answers are misleading because jQuery no longer self-documents using "scriptdoc." Version 1.1.4 was the last to have this. Anything newer than that (>=1.2 ~mid-2007) is gutted.
amending that: VSdocs actually work:
http://code.jquery.com/jquery-1.4.1-vsdoc.js
or http://www.asp.net/ajaxlibrary/cdn.ashx for version after 1.4.1
i suspect using a non-minified version of jquery would help.
For Netbeans 6.7 / 6.8 / 6.9, just follow the guide here:
Using jQuery to Enhance the Appearance and Usability of a Web Page
There's a section about half way down called "NetBeans Code Completion and API Support".
Worked no problem for me.
Note: "Choose the uncompressed version, i.e., 'Development', before downloading the jQuery library. Using the uncompressed version will allow you to examine the JavaScript code in the editor, and aid in any debugging processes."
Tip: Tools / Options / Miscellaneous / JavaScript. In the "Targeted Browsers" section, ensure IE is "6 or later". Otherwise, you'll get "Not supported" errors in the code completion pop-up and a lot of the commands will be struck out.
I use netbians 7.x for development on drupal 6.x. Autocomplete works after adding non-minified version jquery-1.2.6.js file to the root folder of the project (so it will be with any version).
It is important to specify the version of the file name, without -1.2.6 will not work!
The basic rule is that your jQuery (or for that matter any js lib) should be found in the same project you need auto complete to work. So just place jquery-1.x.y.js somewhere in your project (that can be reached by NetBeans as it reaches your js file) and you should be good to go.
To test you can put the jQuery file in the same folder as your js file being edited.
Make sure your Internet connection is working, because NetBeans downloads documentation when is needed. I think that NetBeans downloads it from there, but this is only my assumption. This is parsing friendly XML document with whole and recent jQuery documentation.

What's a simple way in Google Chrome to insert Javascript into sites?

I would like to be able to add custom snippets of javascript to any site that matches a regex. This is mostly because of sites that I use daily because of specialized content, but which have a poor design. I want to be able to do something like:
Visit site See that sidebar overwrites content
Whip out developer tools, find div id for sidebar
Edit a snippet of javascript which is executed on document.ready for this domain:
$('#sidebar-right').remove();
A bit of searching for user scripts tells me that I need to be writing a Chrome extension, which seems unfortunate and overkill. Is there not an easier way, or an extension which is nothing but a javascript editor that assigns snippets to domains? I'd really like to be able to edit in Chrome itself, or at least have a file that I can just leave open in MacVim all the time. An extension requires unloading/installing to update as far as I can tell.
If I just had one big javascript file, that would be fine. I'd just wrap my customizations in domain checks.
Bonus love if I can write in CoffeeScript.
The answer is to use the Tampermonkey chrome extension.
https://chrome.google.com/webstore/detail/dhdgffkkebhmkfjojejmpbldmpobfkfo
Why not dotjs http://defunkt.io/dotjs/ ? It's local, you can version it with git, you can easily take it to another computer...
Another alternative that neatly solves the problem is Custom JavaScript for websites. You just need to install the extension, which takes around 2 seconds, and then you can immediately start typing your custom JavaScript for the specified website.
The extension automatically recognizes the current website, so all you need to do is write your code and click on Save. You can also easily import jQuery or your external scripts for convenience.
Custom JavaScript for Websites 2 is an alternative to Custom JavaScript for Websites, with some bug fixes and sync scripts across devices feature.
Snippets are available directly in Chrome Devtools
https://developers.google.com/web/tools/chrome-devtools/javascript/snippets
Witchcraft is another Google Chrome extension for loading custom Javascript and CSS, and it is supposedly for more avanced users. The older dotjs project repository lists Witchcraft as its successor.
What you're looking for is Greasemonkey. But wait, Greasemonkey is for Firefox only, right? Turns out, you can install Greasemonkey user-scripts as native Chrome add-ons. Just go to userscripts.org and hit the Install button on one of them, and Chrome will automatically convert it into a native add-on. Then, write your own and install it using Chrome.
Note: This only works in Chrome 4.0.

ie8 Javascript Cache Issue with YUI framework

I have an application running that is using the YUI js framwork (v3.0). The user can click a button within my app which will upgrade them to the latest version of the framework (3.4). The problem is that on ie8 I'm getting some strange javascript errors. After debugging it seems that an old version (3.0) of the loader-min.js file is retrieved from the browser cache as it still being used by the YUI object when it's instantiated. So during my upgrade I create a script node, add the location to the new loader file (3.4), and then insert it into the head section. Think we're all familiar with this technique. However, when the user navigates to the next page, the file that is loaded is lost and the old version (3.0) still remains in the cache. Have verified this by using developer tools and looking at all the javascript files the app has loaded.
I've tried lots of different things to get the new version (3.4) I'm loading to override the version currently in cache, which will fix the javascript issues. I've tried adding a unique string to the end of the file name that is being loaded which is typically how js files can be 'versioned'. I've made sure the Etag and Cache-Control headers for the new version I'm trying to load have been set. Nothing works and I'm banging my head against the wall.
One small restriction, I have to use javascript to try and load this new version of the loader-min file. I cannot add a simple script tag to my html because of how the upgrade process works. Any thoughts, ideas, pointers as to why IE8 will not cache the version I am loading dynamically?
Caching problems like this are normally solved by giving the new version of the script a different filename (often containing the version number) and changing the HTML that includes it to reference the new filename so that it can never be confused with the old version by a caching system.
In fact, this version system should probably be used on all external script files so when you upgrade them, you can make sure that viewers get the new version immediately and old/new versions of the scripts are never accidentally mixed by a caching system.

How to substitute a content of certain javascript reference with local script for debugging?

I need to debug jasvascript loaded by page. Loaded page are not locally placed.
Loaded js is packed. I want to substitute it with unpacked version.
Is there any tricks or browser options to make it?
It looks like Fiddler's AutoResponder tab will do this for you.
You say you want to replace the JS with the "unpacked" version--if you just want to insert line breaks so you can step through in a debugger, the Venkman debugger has a "Pretty Print" button which does that.
It sounds like you are asking for after the application is already deployed somewhere so this might not be as helpful.
If your application already goes through a regular build script or process for debug or at least for release then you could do it there. You could leave the Javascript files as the un-minified/optimized scripts and when building for debug it just copies them over, but for release it runs them through your minifier/optimizer first before copying them over.
I know that jQuery uses a Google Compiler to package the framework up, but there are other tools that just minify the code. Also it gives you a chance to run any kind of quality checking tools (such as JSLint) on your Javascript when you already have it as part of your build process.
Other then that the AutoResponder idea from above sounds promising.
You could use Charles Web Debugging Proxy to map the requested JS file to a local unpacked JS file (or any other location). It costs money, but you can use the trial for 30 minute periods.
Firebug is a really good Firefox extension that lets you manipulate the DOM and you can see the changes as they happen. This will let you insert <script> tags to the page.
Just Edit the <head> piece of html through Firebug and insert the <script src="http://site.com/unpacked.js"></script> somewhere in the page.

Using Firebug Lite (1.2) would you use it in production sites?

I tried to use Firebug Lite (via the bookmarklet and also adding it to one of my web sites).
I seem to get the alert:
Unable to detect the following script "firebug-lite.js" ... if the
script has been renamed then please set the value of
firebug.env.liteFilename to reflect this change
Alot. Especially when I try to close the tab. This happens in Firefox, Camino and Safari.
What I'm wondering is, is this ready for use?, or do I need to copy the code, post it locally and hack it? I already checked the documentation, and it was pretty limited.
I was also looking at the mod dates and the site appears to have been relatively idle since mid-2008.
The javascript file rounds out at 77,305 bytes, so I would think you would not want to use it on a production site unless you were using a dynamic language and could output the script conditionally when you need to do debugging.
(i.e. http://www.somefakesite.com/page?debug=true)
As long as you're only including the file in the page when you are actually debugging, it probably doesn't matter where you pull the script from unless it doesn't work correctly, in which case you would have to modify and serve it yourself.

Categories