Part of javascripts gets cut off in browser

Question

Greetings

One of my clients javascript files is failing. I have found the reason, but the discovery has made me REALLY confused as I have never seen anything like it.

The issue is that when the browser reads through the script sources and enters a specific custom .js file which contains 543 lines of code, it only reads to line 502 which is this if (isValidWidthChange) { but what confuses me is that when I use developer tool in IE and firebug in FireFox and uses their script debug tool, when it hits line 502, the javascript is cut off like so - if (isValidWidthChan

if (isValidWidthChange) {

if (isValidWidthChan

Can anyone give me a logic explanation on WHY this happens?

I can say so much that I was adding a few things to the file, but I took a back-up of the original before starting, and this is actually the error which keeps occuring even after I set the website to use the original file again.

I have tried IISRESET a lot of times. I have tried copying the file from a healthy environment. I have cleared all the caches in my browsers and on the server. Yet it still appears.

I didn't develop it myself, it's a third party product. But this has never happened before.

Codesnippet of where the error occurs

(function($) {
    // jQuery autoGrowInput plugin by James Padolsey
    // See related thread: http://stackoverflow.com/questions/931207/is-there-a-jquery-autogrow-plugin-for-text-fields
    $.fn.autoGrowInput = function(o) {
        o = $.extend({
            maxWidth: 1000,
            minWidth: 0,
            comfortZone: 70
        }, o);
        this.filter('input:text').each(function() {
            var minWidth = o.minWidth || $(this).width(),
                val = '',
                input = $(this),
                testSubject = $('<tester/>').css({
                    position: 'absolute',
                    top: -9999,
                    left: -9999,
                    width: 'auto',
                    fontSize: input.css('fontSize'),
                    fontFamily: input.css('fontFamily'),
                    fontWeight: input.css('fontWeight'),
                    letterSpacing: input.css('letterSpacing'),
                    whiteSpace: 'nowrap'
                }),
                check = function() {
                    if (val === (val = input.val())) { return; }
                    // Enter new content into testSubject
                    var escaped = val.replace(/&/g, '&amp;').replace(/\s/g, '&nbsp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
                    testSubject.html(escaped);
                    // Calculate new width + whether to change
                    var testerWidth = testSubject.width(),
                        newWidth = (testerWidth + o.comfortZone) >= minWidth ? testerWidth + o.comfortZone : minWidth,
                        currentWidth = input.width(),
                        isValidWidthChange = (newWidth < currentWidth && newWidth >= minWidth)
                                             || (newWidth > minWidth && newWidth < o.maxWidth);
                    // Animate width
                    if (isValidWidthChange) { // This is where it stops
                        input.width(newWidth);
                    }
                };
            testSubject.insertAfter(input);
            $(this).bind('keyup keydown blur update', check);
        });
        return this;
    };
})(jQuery);

Inspect your http responses (with firebug or httpfox). It is possible the server is (for some reason) not returning the whole script. — Richard H, May 04 '11 at 12:55
@Daniel It's in all of the browsers. @ppumkin Yes there are other scripts loading and they work just fine. — , May 04 '11 at 13:05
Sounds like server or SharePoint issue. Try renaming the `.js` file and see if it helps. — Shadow The GPT Wizard, May 04 '11 at 13:11

score 1 · Answer 1 · answered Nov 28 '13 at 10:23

It's probably encoding issue, please make sure you don't have special characters in all the script;

Look on the characters near Owns and Rate, that characters will be ignored by the browser and the script will be cut off by the amount of them

/*
    Mapping GUI to event types
    Click - clickEvents
    Purchase -purchaseEvents
    Consume - consumeEvents
    Recommended - clickedRecommended
    Rendered - renderedEvents
    Rate ײateEvents
    Blacklist - blacklistEvents
    Owns ׯwnsEvents
    Total

*/

score 0 · Answer 2 · answered May 30 '11 at 13:13

Is it possible for you to split the script into two parts? 543 lines is quite a lot of code, and I would be surprised if there are not at least some functions or modules which could be moved to a separate script.

As for debugging the issue, your symptoms would suggest that your server may have some kind of maximum content length. I know there are maximums (maxima?) for requests (there is something called maxAllowedContentLength, which is configurable), but I would be surprised if there was an upper limit on the size of files served. (Frankly that would be damn stupid, and would cause lots of problems but hey, IIS is not always smart - or maybe your administrator has been a bit too parsimonious?). It would be interesting to check if the maximum is a matter of lines or (more likely) bytes. So, to check this, have you tried:

Adding comments - does this shift the break-off point?
Adding additional (unused) code - does this shift the break-off point?
Serving another long script, for example you could get a hold of the developer version of jQuery (rather than the minified one). Does this get broken-off too?

The results of these experiments and similar would help narrow down the issue a little.

Part of javascripts gets cut off in browser

2 Answers2