I have a bookmarklet that allows me to wrap any function and insert a debugger statement before it is called.
It works fine, but since the bookmarklet is a single line debugger stops somewhere in the middle of a long string of code and I need to scroll to find the breakpoint.
How can I insert a new line character after the debugger statement so that when it's encountered the code in the console is split into two lines?
The \n and literal newline character copied from a textarea into the bookmarklet don't split lines in the debugger.
Generally, it is best to URL-encode a bookmarklet before storing in a bookmark. So you can have a multiline bookmarklet simply by encoding the newlines, as demonstrated by this: encodeURIComponent("alert('line1');\nalert('line2');")
That answers the question as you asked it, but I'm not sure if this is your real problem. If you provide example code I might be able to give further advice.
No, bookmarklets are always one-liners.
You can use the chrome debugger which has a "prettify code" option.
Another option would be not running it as a normal bookmarklet during debugging but injecting a script tag pointing to a properly formatted version of your script.
Related
I am trying to deploy my bookmarklet in public, but I am not sure what is the best way to do it. Suppose I have,
javascript:(function(){console.log("hello");}())
And I make it draggable to the bookmarklet by enclosing it within a href tag. The trouble is that HTML special characters are encoded like %07d for the above snippet. What's the conventional way to solve this problem?
Thank you!
It should work fine, till it is in the following format.
Bookmarklet
Note: I changed console.log() to alert() to make the result view able immediately.
Live Demo: http://jsfiddle.net/qyL4L/
When I upload to dreamhost my page, I can't debug it because javascript appears with no end of line, like this for example:
function fun(){ alert("1");alert("3");if($("#tbTitulo").val()==""){alert("1");return;}}
so it is practically impossible to debug. I tried on firefox and chrome with the same results. I don't know why this is happening. If you could give me some clue I'd really appreciate it.
You can prettify the code in Chrome Developer Tools. The button is the last one on the bottom row on the sources tab (it looks like a pair of curly brackets):
https://stackoverflow.com/a/6318092/1669279
First you have to Beautify, unpack or deobfuscate JavaScript and HTML, make JSON/JSONP readable, etc.
check here
http://jsbeautifier.org/
after that you can insert breakpoint to debug.
Consider the following Javascript:
var previewImg = 'http://example.com/preview_img/hey.jpg';
var fullImg = previewImg.replace('preview','full');
I would expect the value of fullImg to be:
http://example.com/full_img/hey.jpg
In fact, it is... sort of. Running alert(fullImg); shows the expected url string. But when I deliver that variable to jQuery Fancybox, like this:
jQuery.fancybox.open(fullImg);
Something adds characters into the string, like this:
http://example.com/%EF%BF%BCfull_img/hey.jpg
Where is this %EF%BF%BC coming from? What is it? And most importantly, how do I get rid of it?
Some other clues: This is a Drupal 7 site, running jQuery 1.5.1. I'm using that same Fancybox script elsewhere on the site with no issues.
%EF%BF%BC is a sequence of three URL-encoded characters.
You clearly can't see any unexpected characters in the string. That's because the character sequence %EF%BF%BC is invisible.
It's actually a UTF-8 byte-order mark sequence. This sequence typically comes at the start of a UTF-8 encoded text file. They probably got into your code when you did a copy+paste from another file.
The quickest way to get rid of them is to find the bit of code that was copied+pasted, delete the characters on either side of the problem, and retype them. Depending on your editor, you may find the delete behaves strangely as it deletes the hidden characters.
Some text editors and IDEs will have an option to show hidden characters. If your editor has this, it may help you see where the mystery characters are so you can delete them.
Hope that helps.
I created the below JavaScript Code Template in Netbeans 7.1.1
This is to generate code automatically in the editor, instead of typing it.
do_this('${selection}${cursor}',13)
which will result in the below code, with the cursor between quotes
do_this('',13)
The template automatically places the text I have highlighted, between quotes.
Now, the problem: I would like to replace any spaces within the selected/highlighted piece of code, with underscores. I think this may be possible with Regular Expressions (regex), however I am not sure how to go about it.
Thanks
Not sure about the Netbeans specific stuff, but once you have the selection you could do something like this:
selection = selection.split(" ").join("_");
This is not possible in NetBeans Code Templates, as they do not have any functions to manipulate the data in variables. If I have a work around for it, I will post it here.
Thanks.
I have been looking around for a HTML formatter to incorporate with a project I am doing. I need it to be written in Javascript since I want the formatting done on the client side.
The problem is, the few that I have tried don't work very well... For example:
http://www.davidpirek.com/blog/html-beautifier-jquery-plugin : Has a problem with one of the For loops (in the cleanAsync function). Chrome says "unexpected token ILLEGAL"
JS Beautifier on GitHub : When I have links in the HTML it will put a newline character after it. The problem is, I have a period directly after the link in some cases and it will add a space between the link text and the period in the sentence. I tried poking around to fix it but I could not.
Are there any others, or does anyone have recommendations to fix the above two?
EDIT:
This is for editing code, so I just need something to tab in the lines, etc. The code output will go in a textarea.
A few to look at, all have working demos:
http://alexgorbatchev.com/SyntaxHighlighter/
http://shjs.sourceforge.net/
http://jush.sourceforge.net/
http://dojotoolkit.org/reference-guide/dojox/highlight.html
use https://github.com/beautify-web/js-beautify and pass your code to html_beautify() method.