Christopher
Stoll

Firefox Beats Chrome in an Enterprise Environment

I recently wrote an article explaining how I made Google Chrome portable so that I could use it for web development testing at work. But, I have come to the conclusion that I cannot really use it in our corporate environment, it just causes frustration.

The first problem that I had was when accessing our IIS based intranet servers. Our intranet servers require domain authentication, which Internet Explorer handles seamlessly. None of the other popular browsers perform integrated authentication, which is not a problem since they will simply prompt for a username and password. This works very nicely in Firefox. However, Chrome gives the error message "Bad Request (Request Header Too Long)". This message is generated by the server and not by Chrome, but Firefox does not trigger a response like this.

When I inspect the http traffic I can see where the problem is. When the browser makes the first request, the server sends a HTTP 401 Unauthorized response. After that the browser prompts for a username and password, all of which is normal. Next, Chrome requests authorization information via Kerberos and sends that data in the authorization section of the subsequent http header. All of this should work fine in theory. The problem is that I work for a huge global company, and I am a member of many active directory groups. So, the negotiate string is very long, too long for the IIS server to handle. Firefox works because it sends a much shorter NTLM authorization string. I could request that the server team increase the maximum header size on the IIS server, but it would be hard to justify. Interestingly, if I wait a few minutes and refresh the page it will refresh properly, which I have not quite figured out.

(update, 2009-11-25: The problem above was solved a while ago, and now Chrome works well with the corporate intranet sites.)

The second problem appears when I access secure sites on the Internet. We use a proxy and web content filter, and that is configured through a proxy configuration script. Firefox automatically negotiates with the proxy and does not prompt for a username and password to access the internet, but Chrome does. Again, this is not that big of a deal, it's only needed once per session and then I can access the internet. It is interesting to note that Chrome does seem to send NTLM proxy authorization.

However, when I go to secure login sites I experience problems. I can get to the login screen, but once I enter my username and password and click submit Chrome responds with "Error 104 (net::ERR_CONNECTION_FAILED): The attempt to connect to the server failed." After I get that message I am not able to navigate to any page, even a regular insecure connection. The only option is to close the browser and start over. From a technical perspective, I can see that Chrome is requesting DNS information, and the response seems to be normal, but it never actually makes a web request.

(update, 2009-11-25: The problem above was solved a while ago, and now Chrome works well with the corporate intranet sites.)


I have been using Chrome at home, and I have had some minor issues. On problem that struck me was that Gmail reports errors periodically, but I usually click OK and continue working without problems. In spite of the minor issues I plan on continuing to use Google Chrome at home, though I am not going to remove Firefox anytime soon.

I don't think the enterprise problems I explained are strictly Chrome's fault, but the combination of Chrome and our computing environment appears to be a bad mix. I also had problems in the past with Safari, so it might be the WebKit foundations that they are both built upon. It is also possible that I have caused these problems by making Chrome portable, and I intend to run the same tests from an actual installation when time permits.

I would assume that the enterprise market is not Chrome's target audience a, but I have left the team some feedback on the problems I have experienced.

From my perspective, Firefox is the only viable option for developing web-based applications in the enterprise at this point.

Wolfenstein for the iPhone

Yesterday I mentioned purchasing Flight Control for the iPhone, well I also downloaded another great game last weekend. You may have heard of this game before, especially if you are in my age group, it's called Wolfenstein 3D.



Wolfenstein 3D was the original first person shooter game released in the early 1990's for MS-DOS PCs. This was one of the first PC games that I wasted an untold number of hours on, eventually defeating Hitler and winning the game. My friends and I, being the nerds that we were, went so far as to create and trade custom levels for this game. And now, we can play it on a mobile phone, it's crazy how far things have come.

The iPhone version of the game takes advantage of the tilt sensor for maneuvering B.J. Blazkowicz around the labyrinths, but it takes some getting used to. It is nice that the game offers you choices on how you want the controls to be displayed, there even seems to be a configuration for lefties.

The one small issue that I have is the orientation of the screen. Most games that I have played on the iPhone that are designed for landscape play (as well as the YouTube app) rotate the display counterclockwise. In other words, the bottom of the phone is in the right hand. Wolfenstein rotates clockwise so that the bottom of the phone is in the left hand. Maybe there is a reason for this, and it is only a minor complaint, but it goes against my user interface expectations.

Despite my small complaints about the interface, I am happy with the game, and don't regret sepending the $5.

While I am on the subject of games from my youth, I thought that I would mention that I also enjoy SimCity on the iPhone, that was another game that I spent too many hours playing. I originally downloaded it from the App Store in December, but I didn't do a write up on it because I experienced problems once cities became too large. EA released an upgrade this week that seems to have resolved those issues.

It's nice to see great games from my childhood being revitalised.

Flight Control for iPhone

Over the weekend I purchased a very nice iPhone game called Flight Control. The game is easy to use, takes advantage of the iPhone interface, is cheap ($.99), and most importantly is fun to play.



In the game you are flight controller responsible for getting various types of aircraft to their respective proper landing areas without running in to each other. The controls are simple and effective. To guide a plane to the proper runway you touch the plane and then draw out the path with your finger.

The games are fairly quick, so it is ideal for those situations where you just want to kill a few minutes, or to entertain the children for a few minutes.

I am fairly picky about purchasing applications for the iPhone, the mobile app store makes it easy for you to go a little over board if you aren't careful. And, I don't usually purchase games; the iPhone is expensive and I try to do plenty of "grown-up things" on it in order to help justify the cost. But, this is little game is definitely worth the $.99, it is the best game that I have.

Comments (newest first)

stollcri
For sure! I thought of you when I posted this, if you had an iPhone you would have to get this game.
Scott
the perfect game for a air traffic controller!!!

Web Page to Test Web Pages

This past weekend I rolled out a major upgrade to one of the intranet web applications I maintain at work. The main purpose of the upgrade was to change the scope of the application. It was originally designed for use at one facility, but because of it's effectiveness, the business wanted to start using it at all of our facilities in North America. The catch was that each facility's data needed to stay isolated. When we last upgraded the application two years ago we thought that this might happen, so the structure for this was mostly in place and therefore the number of changes were mostly in the user interface as we exposed the new functionality.

Anytime I make changes to web user interfaces I worry about data validation and the impact on the user experience. We try to catch data entry errors up front and we also check again before posting to the database, but I worry that something will slip through. I have two main concerns with this. First, are we restricting the data that the users enters based on the type and size of the fields in the database. And, second, are we properly cleaning up the data for the database and for proper viewing in the future.

Our intranet applications are developed in a development environment and then migrated into a testing environment before finally being placed into production. Once a new version is available for testing I always solicit the application's owner to test it (each application has an owner from the business). But, they normally focus on the changes that they requested, ensuring that our implementation meets their desires. Because of this we have historically found bugs in the production environment caused by edge cases, and now we do a lot of manually testing for these cases.

I have seen some applications for assisting in the testing of websites, but most of them require some sort of external tools. Many seem to be based on recording and playing back situations. This approach is understandable, but I want something more automated. I don't want to miss a check on a new field because we forgot to add it to the checking macro.

I have been looking for a simple, automated tool with minimal requirements that could assist in test our intranet applications. I was thinking that it would be nice to have a web page that loads up the target application, maybe in an iframe, and then runs some rudimentary tests. Then, I could have a co-op load up this testing web page and run the tests it recommends as the application is navigated from front to back. Instead of containing the page in an iframe, it could somehow load a special JavaScript into each of the pages for the target application. Regardless of the implementation, I want something that proactively checks the current page for possible errors and automatically fills in fields with values that would stress test the submission mechanisms.

I have yet to find a tool that performs in this manner, and am considering writing one if subsequent searching turns up nothing.

Online Web Development References

When I first switched from MooTools to jQuery for my primary JavaScript framework I made the comment that I liked the MooTools documentation better. It seemed that mootools.net/docs/ provided faster navigation than docs.jquery.com. However, I have since found api.jquery.com, which provides very quick access to relevant API documentation. In light of this discovery I have revised my opinion and now prefer jQuery's documentation.

I wanted to share this new discovery (api.jquery.com) and also mention some other great online web development resources that I use on a regular basis.

Mozilla Developer Center
The Mozilla developer center has a wealth of information for web developers. There are references on everything from AJAX to XUL. I frequently find myself searching the CSS reference and the JavaScript 1.5 Guide.

Color Scheme Designer
I have used this tool for a long time. I am more of a programmer than a graphic designer, so it is not that easy for me to pick out great color combinations, which is where this application comes in. You can save schemes that you design by saving a link to the specific scheme (here is a scheme I like).

w3schools.com 
I have used the reference that they have for years because it quickly shows me the tags or properties that I am looking for. They also have many examples and tutorials.

Web Application Server Migration

We recently updated one of our intranet web servers, and had to migrate all of the web applications that it supported over to the new server. Setting up ColdFusion and getting the applications running on the new server was no problem, but updating all the links to them was. Unfortunately, the original server was referenced by name rather than an alias. I could have tried to preserve all the links and rename the new server, but I decided that it would be a good time to set up an alias for this resource.

I wanted to make sure that all the users would be redirected to the appropriate application on the new server. So, I used the following technique to accomplish that. For each ColdFusion application I put the following two files in the old application root directory.

Application.cfm
<cfinclude template="index.cfm">
<cfabort>


This will load my index.cfm template file regardless of the url used and then abort. The index.cfm file is a very basic file with a redirect after ten seconds.

index.cfm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>This page has been moved!</title>
<META HTTP-EQUIV=REFRESH CONTENT="10; URL=http://webapps.intranet.company.com/ApplicationName/">.
</head>
<body>
<div style="text-align:center;">
<br />
The server servername.company.com has been replaced by webapps.intranet.company.com<br /><br />

Please be sure to update any bookmarks that you may have to this page.<br /><br />
<a href="http://webapps.intranet.company.com/ApplicationName/">
Click here if you are not automatically redirected in 10 seconds.</a><br /><br />
For futher assistance please call the IT service desk.
</div>
</body>
</html>

Google Chrome Portable

Since I do web development at work I wanted to be able to test some of our internal applications under Google Chrome. My company strictly uses Internet Explorer, but I like testing my applications outside of IE so that I can be sure that they will work properly if the company ever decides to change it's strategy. I already use FirefoxPortable for testing, but I would like to use Chrome also.

The problem is that software downloads and installations are strictly prohibited. I can get past the installation limitation since I am in IT, but the proxy rules are firm. And, the Google Chrome installer that I downloaded seemed to grab other files from the Internet, so I couldn't just download the installer and bring it in on my USB drive. I was considering finding all the installer files in attempt to bring them in and install them, but I thought that it might be easier to use a portable version.

I tried using the portable version of Chrome from Caschy, but it seemed to be an earlier version that still had some bugs. At that point, I decided to see if I could create my own portable version, then I could make sure it was using the current official files. I'm not concerned with creating a completely portable version that leaves behind no traces, just a version that I can run at work. I was able to do so quite simply, so I am sharing those simple steps.

First, I installed Google Chrome on my home PC.

Next, I navigated to "%USERPROFILE%\Local Settings\Application Data\Google\Chrome\" and copied the folders found there to the PortaChrome folder I created on my thumb drive (e.g. "%USB_DRIVE%\PortaChrome\" -- this could be any folder where you want to place the portable version).

Then, I navigated to "%USB_DRIVE%\PortaChrome\Application\%VERSION%\" and copied everything there except the Installer folder up one level to "%USB_DRIVE%\PortaChrome\Application\". I then deleted the %VERSION% directory, but this isn't strictly necessary.

Finally, I navigated to my PortaChrome directory ("%USB_DRIVE%\PortaChrome\") and created a command file named "chrome.cmd". In that file I have one command (all on one line, in case it is wrapped below):
start Application\Chrome.exe --user-data-dir="..\User Data"
Now I can test my applications under Google Chrome, even inside our rigid corporate environment.

If you decided to follow my directions you do so at your own risk. I don't think that Google intended the application be run in this manner, so you could inadvertently be opening yourself up to Internet threats or data loss risks. I'm not saying that you will, I'm saying that I don't know. I am only using it for testing, so data loss is not a great concern. And, I am running this inside of a corporate firewall, so threats from the Internet are reduced for me. I make no warranty.

Comments (newest first)

Christopher Stoll
You should be able to change the profile folder by starting Chrome with the --user-data-dir switch: chrome --user-data-dir="D:\PortaChrome\UserData"
Anonymous
the user profile folder is always saved onto the desktop. is there a way to change so that it saves to the USB Drive?

Add Link to Selected Text in Textarea

I recently received a request to modify one of our intranet applications so that users would have any easy way of inserting links into a textarea. Due to how we use the data in the text area I didn't want to implement a full WYSIWYG editor, so I had to come up with another solution.

The users that will be adding links are power users, but they understandably didn't want to insert the links manually. They also wanted to select from a list of links that are defined in a different part of the application. So, I just added a little bit of code that shows a select box with all the possible links when text is selected in the textarea. When the users selects a link option, the textarea is updated to contain the HTML code necessary to display a link that opens in a new window.

Below is the code that I use to get the selection and insert the link. It is somewhat crude, yet effective.


<script type="text/javascript"
        src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    /**
    * Gets the start and end position for the selection
    * @param {string} pSelectArea The texatarea
    *        to get the selection from (jQuery selector)
    * @return An object with the parameters start and end
    * @type object
    */
    function getSelectionRange(pSelectArea){
        // if we are in IE
        if(document.selection){
            var tBookmark = 
                document.selection.createRange().getBookmark();
            var tSelection = 
                $(pSelectArea).get(0).createTextRange();
            tSelection.moveToBookmark(tBookmark);

            var tBefore = 
                $(pSelectArea).get(0).createTextRange();
            tBefore.collapse(true);
            tBefore.setEndPoint("EndToStart", tSelection);

            var tBeforeLength = tBefore.text.length;
            var tSelectionLength = tSelection.text.length;

            tSelectStart = tBeforeLength;
            tSelectEnd = tBeforeLength + tSelectionLength;
        }else{
            tSelectStart = $(pSelectArea).get(0).selectionStart;
            tSelectEnd = $(pSelectArea).get(0).selectionEnd;
        }
        return {start: tSelectStart, end: tSelectEnd};
    }
    
    /**
    * Inserts a link into text between a start and end point
    * @param {string} pText The text to insert the link into
    * @param {string} pLink The link to insert
    * @param {integer} pStart The starting location
    * @param {integer} pEnd The ending location
    * @return The new text with the link
    * @type string
    */
    function insertLink(pText, pLink, pStart, pEnd){
        tText01 = pText.substr(0, pStart);
        tText02 = "<a target='_blank' href='" + pLink + "'>";
        tText03 = pText.substr(pStart, pEnd-pStart);
        tText04 = "</a>";
        tText05 = pText.substr(pEnd);
        return tText01 + tText02 + tText03 + tText04 + tText05;
    }

    var selection = {start:0,end:0};
    
    // when a selection is made grab the
    // range and show the link select
    $("#MY_TEXTAREA").select(function(){
        selection = getSelectionRange("#MY_TEXTAREA");
        $("#MY_SELECT").fadeIn(1000);
    });
    
    // when the select changes add the link
    $("#MY_SELECT").change(function(){
        if(selection.end>selection.start){
            var tNewText = insertLink(
            $("#MY_TEXTAREA").val(),
                $(this).get(0).value,
                selection.start, selection.end);
            $("#MY_TEXTAREA").val(tNewText);
        }
    });

});
</script>

Comments (newest first)

Alisa
I like the easy way of inserting links that you made. You can also make something like a button. Anyway, great piece of code!
yainbowl
Click on the New Text Area button on the toolbar, text_new_text_area_button.png.
You can also select Insert > New Text Area from the menu.