Categories
Mozilla Open Source Web Development

Browser VM

One of the great things about virtual machines is you can test on a virtual machine, destroy it, and recreate it in pristine condition in a matter of seconds. You can do this with browsers as well. Before I mentioned PortableApps is a great thing to have on your USB drive. Well, you can also just unzip a copy to your desktop each time you want a clean version of Firefox. So keep your good install for yourself, and perhaps create another with extensions you want to test, or if you just want to test your site against an older version of Firefox. I believe it will still use plugins installed on your computer, but extensions, prefs, etc are totally separate. So each install is pristine. I keep a copy around of 1.0.x and 1.5.x as well as 2.0. So each time I want to test on an older version I can just run those. The prefs won’t mess anything up since it’s a fresh copy. You can keep your latest and greatest Firefox install with all your extensions and settings alone. This allows me to ensure everything works good in different versions without having to risk my preferences to older versions, or have to go through install/uninstall.

You can get various versions of Firefox here. Just download and extract to your desktop or some other easy to access place. I keep a copy of all the major versions around. Very handy.

I should note you can only run 1 version at a time, even though they use different preferences. Not sure if this is a fixable bug, something with serious work that just isn’t worth the effort, or something that XULRunner will take care of. Update: apparently you can, see comments below.

Unfortunately I don’t think there is a version of PortableApps for Mac/Linux users. So it may be Windows only for now.

In case you missed it, you can test IE7 via VirtualPC thanks to Microsoft.

Categories
Programming Software Web Development

xmlHttpReq.overrideMimeType() in IE7

This is just a little note for anyone doing xmlHttp work. I just encountered this situation this morning. As most web developers know IE7 introduces support for the native scriptable XMLHttpRequest object. The big advantage here is that ActiveX is no longer necessary to use ajax applications on IE. One thing I did note is that there is a slight difference in their support for the XMLHttpRequest object. Take the following code:

// Mozilla/Safari/IE7+
if (window.XMLHttpRequest) {
    xmlHttpReq = new XMLHttpRequest();
    xmlHttpReq.overrideMimeType(‘text/xml’);
}
// IE6-
else if (window.ActiveXObject) {
    xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttpReq.open(‘POST’, strURL, true);

That seems to break for me on IE7. A little experimentation shows that it doesn’t support the overrideMimeType() method. A simple fix for this is to simply check before invoking it as follows:

// Mozilla/Safari/IE7+
if (window.XMLHttpRequest) {
    xmlHttpReq = new XMLHttpRequest();
    if(xmlHttpReq.overrideMimeType){       
        xmlHttpReq.overrideMimeType(‘text/xml’);
    }
}
// IE6-
else if (window.ActiveXObject) {
    xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttpReq.open(‘POST’, strURL, true);

This is just FYI for anyone who happens to encounter this error. It’s a simple fix. This somewhat goes without saying, but make sure your request returns from the server as text/xml or you’ll likely still encounter issues.

Categories
Mozilla Web Development

IE7 Testing

I complained a while back about how unlike Firefox or Opera, it’s hard it is to support multiple versions of IE. Microsoft apparently did listen to developer complaints, and came out with a solution.

You can now download a time crippled VirtualPC Image and running IE6 in VirtualPC. It’s available free of charge. The catch is it’s time crippled (though it seems like they will release a new image before that time).

This vastly improves the situation, but I wish they also offered IE7 virtualized, for those who can’t/won’t upgrade at this time (corporate IT policy, etc.). I also think there would be significant benefit to developers to see IE 5.x as available (since we still often have to support it). A VMware version for Linux (and eventually Mac) developers would also be great to see, though I won’t hold my breath on that one.

But regardless, it’s a great move. I just hope they keep coming out with updates to keep the program going. Hooray for solutions!

Categories
SafePasswd.com

SafePasswd.com Update 11/19

I updated SafePasswd.com tonight. Updates include better generation of memorable passwords, easier to handle length selector, and better quality bar. Most of the changes were to algorithms, rather than major features. Hopefully the quality of passwords generated is now slightly improved. It’s not always about the big things, sometimes it’s the smaller refinements that need to be done.

Categories
Blog

Some Changes

I just made some changes around here, cleaning up some of the older code. Most notable changes:

  • Comments – New lighter ajax comment script in place, this should make the pages load a little faster (actually quite a bit if your on 56k). Could use a little help testing so feel free to leave a comment. If it doesn’t work contact me.
  • Menu Bar – Some CSS changes to make it look more consistent across browsers, and it now highlights the current section.

Some other, more obscure changes were also made. Let me know if there is trouble.

Categories
Google Web Development

Optimizing Page Load

An awesome article on Optimizing Page Load Time from Aaron Hopkins (who works for Google). While his suggestions aren’t quite revolutionary he’s got a lot of data and experience to back up his statements, which is really great when your looking to improve performance. To summarize the best point: high object counts hurt performance regardless of size and broadband connectivity.

Categories
Mozilla Software

raccettura’s Picks

I use a few extensions on a routine basis, so I thought I’d spend a moment just listing what I use, briefly explain them for anyone curious. I do quite a bit of web related work (hence the developer slant) as well as some Firefox/Thunderbird and extension hacking. For now I’ll just stick with Firefox extensions, and save Thunderbird Extensions for another post.

These are taken from my Addon Manager (formerly Extension Manager) window and ordered in a way I thought made most sense. No bribes were taken (though welcome ;-)). This is literally the stuff I personally use and recommend.

Web Development

Web Developer

If you don’t know this one yet and do web development, you should be ashamed of yourself. I’ve yet to see a developer not go crazy over this. The Web Developer extension doesn’t do anything, it does everything. By that I mean it has a whole bunch of small tools to make a web developers life easier. From fine control over cookies, to outlining block level elements, to submitting a page (even local) to the W3C validator to disabling JavaScript. No function on it’s own is truly groundbreaking but the extension as a whole is. If you do web development you need it. I couldn’t imagine developing without it. [Get it]

Firebug

Imagine viewing behind the scenes of a webpage. No, not the source code, but how javascript really executes. Debug, view XMLHttpRequests, add breakpoints, and view more DOM info. Again an absolute must have. This extension also has saved me hours of debugging time. One thing noteworthy is the design of the tool is really fantastic, it’s well organized and implemented to make it rather easy to use, despite the overwhelming amount of info it can provide. [Get it]

LiveHTTPHeaders

Viewing HTTP Headers is insanely useful when debugging web applications. Of course you can use telnet on port 80 and be a geek, but that’s way to much effort. WebDeveloper has similar functionality, but I like how this is integrated into the Page Info window, rather than opening into a new tab. I just find it easier to read, hence more usable. It’s been a staple for me for a few years now. [Get it]

Dom Inspector

As it says on the homepage: “DOM Inspector is a tool that can be used to inspect and edit the live DOM of any web document or XUL application.” This little gem is must have for any JavaScript, Firefox, or Firefox Extension development. It’s saved my butt a few times. It’s interface isn’t the best, but it does have it’s perks. [Get it]

IE Tab

This extension lets you view pages in IE’s rendering engine, but in a Firefox tab. I use this for checking how a page loads in IE (much quicker to right click then to open IE and copy/paste the URL). Again simplicity rules! [Get it]

Small Screen Renderer

Glazou thou art my hero for this one. Simply put it takes your webpage and smushes it up so you can see what it would look like on a small screen device like a handheld. With things like MiniMo, this is very worthwhile. He’s done to many cool things (Composer, CaScadeS) to mention here. [Get it]

ColorZilla

Being that I’m not graphically inclined I don’t need this much, but every so often it’s very useful. This extension lets you see exactly what the color is, pretty much anywhere on the site your viewing. Yea, that is awesome. A big timesaver, and pretty clever design.[Get it]

Everyday Browsing

downTHEMall

Every so often you run across something where you want to download everything in site. Either a series of zip files, images, or something else. You can click on each one… or you can use this awesome extension which will find them and download them all for you. [Get it]

ReloadEvery

This is just a cool way to reload a page on an interval. Great for monitoring a page. When not working on my computer I sometimes use this to just keep refreshing a page so I can glance at my display and see what’s going on. Simple and helpful. [Reload Every]

Resizeable Textarea

Asa pointed this one out. Resizing textareas is a must. If it were up to me, this would be included in Firefox 3.0. It’s awesome and infinitely useful. I personally think it qualifies as a killer feature. [Get it]

Screen Grab

I don’t use this one every day, but sometimes you don’t want to print a webpage, but want to save it. This is especially true because printing, or making a PDF sometimes distorts the page from it’s original appearance. Well the solution is to save a screenshot (another thing IMHO should be an option in Firefox as an alternative “type” in the “Save Page As” option. [Get it

GeoLocateFox

Yes, I eat my own dogfood. Seeing where websites are located is fun. Nuff said. [Get it]

User Agent Switcher

Sometimes sites kick you out because you don’t use IE. That’s not cool (go to the help menu and select “Report Broken Website” if you encounter that). A workaround is to fake being IE. This extension allows you to do just that. Though if you do that, remember to change it back to Firefox. Partially for compatibility reasons on sites that serve specific code, and so that webmasters realize how many Firefox users actually visit their site. [Get it]

Mozilla Development

TinderStatus

Tinderstatus is simple but cool. Just lets me know if the tree is one fire. [Tinderstatus]

Obviously DOM Inspector is some help here as well.

I was debating if I should throw some screenshots in here, but I decided against it since most screenshots of extensions stink (at best) since they don’t capture the value of it.

So there you have it, the extensions I use the most. Check them out.

Categories
Blog Spam Web Development

Hardened Defenses

This weekend my Contact page got spammed. It’s now rewritten and using a few blacklists (including Akismet) among other techniques to eliminate spam. Should be much better now. I also think the handling of attachments should be better.

The spam appeared to be from a botnet, based on the fact that no 2 seemed to have the same IP address. So just blocking IP’s wasn’t an option.

Now things should be even better.

Categories
Accettura Media SafePasswd.com

SafePasswd.com Update

So it’s been about 10 days since I launched SafePasswd.com, and so far the response has been extremely positive. I made a few small changes to the system to improve the quality of “memorable” passwords, and I have now made the default length of passwords a minimum of 10, up from 8 (it’s actually is random between 10 and 14). A few slight UI fixes were also made.

Overall, very good first week. Thanks to those who gave feedback.

Categories
Apple Mozilla SafePasswd.com Web Development

The Need For Browser Testing

Ok, I’ve done a fair amount of work over the years in browser compatibility. From web development work, to writing the reporter tool. I’m well acquainted with the stress of testing your beautiful site against a dozen different browsers/versions/platforms. I just recently did so with SafePasswd.com which I launched the other day. IE5,5.5,6, Firefox 1.0, 1.5, and soon 3.0 (2.0 is pretty similar to 1.5, so likely not much trouble), Safari, Opera! It’s a drag.

What drives me nuts is I can’t keep parallel versions of IE on 1 system to test against. I want to test against IE 5.5, 6, and 7 (RC1 as of this post). This hack lets you have IE 7 as a standalone, but the broken stuff is rather critical.

So what does a web developer do?

  • Keep several computers lying around with different browser versions? This seems costly?
  • VMWare (or Parallels) with different configurations? This too is rather expensive, as Windows licenses aren’t just given out like Linux.
  • Install/uninstall each and every time? That’s excessively time consuming to test between just IE6 and IE 7.

I know there are some services out there that will give you screenshots of your page, but that doesn’t work for things like JavaScript functionality testing, and debugging. So those are effectively worthless for most purposes.

So what is the recommended approach to testing between IE versions? I haven’t been able to find any recommendation from Microsoft on the topic (if anyone knows of one, please point it out). Perhaps it’s a topic for the guys over at the IE Blog?

The same question goes for Safari? How can I a Mac OS X Tiger guy, test how my apps ran with whatever version of Safari someone with Mac OS X 10.3.6 would have? Or 10.2 (though to be honest, I have a 10.2 machine around)? Perhaps it’s a topic for their blog as well?

For the record, all Firefox releases can be found here, Opera can be found here.

So what’s the “best practice”? So far it seems the jury is out on IE and Safari. Firefox and Opera are a pain, but easily done. So what do you do?