Remember the extensions or the story of one bug

Background

One day we received a letter from a dissatisfied user in the mail. “Your photos aren’t uploaded to my site,” said the user and attached a screenshot to the letter. In the screenshot there was a layer with a picture, and instead of the picture - trim from the tag.

(on the left - for ordinary users, on the right - for angry ones)

In those days, the download was done simply - through a form that submits to an iframe and then from there, in plain-text, it takes away part of the file name, with which you can get a link to the file already on our server. "Fashionable" download through XmlHttpRequest2and FormDatawas only in the plans.

Having broken his head for some time, he redid the creation of the picture manually, and its attributes - throughsetAttribute, instead of creating an element directly through plain-html. As it turned out much later, it’s useless, but it doesn’t matter - the user was tired of communicating with us, we ourselves could not reproduce (although we tried hard) and put the problem in the long box, no one complained anymore.

Suddenly

More than six months later, when the image upload was redone in a new way , with a progress bar and fashionable chips, a tester called me who decided to write the upload test in the old way, via iframe, on browsers that do not support XmlHttpRequest2or FormData. I go up to him and see the same thing that an angry user once sent us in the screenshot. Right here, in the browser, you can make a deal, even played constantly!

I open FireBug, look at the result, returning to the iframe and see that everything is ok, look at javascript and see that in fact, inside the iframe, in addition to the file name, there is some kind of enemy. Probably late, but then it dawned on me and I went to turn off extensions and, one by one, check. Indeed, it turned out to be one of the extensions. And such an option initially somehow did not even enter my head, although at that time I had several of my extensions, one of which already had several thousand users. In the extension (I have no idea why), the author decided to embed in all possible documents, his own special one.

Something like this (formatting saved, identifier - replaced, so as not to identify the extension):

if(!doc.body)return;
if(doc.getElementById('xxx'))
        return;
var tmp = doc.createElement("div");
tmp.setAttribute("style", "display:none");
tmp.setAttribute("id",'xxx');
(doc.body||doc.head[0]).appendChild(tmp);

I didn’t even swear at the huge sheet of the terrible extension code, but simply smiled - the problem turned out to be so simple.

Crutch for repair

Not to write to the developer of the extension, especially since it is far from the only one that inserts its own trinkets into everything that is possible. Though rarely used by us, the old way of downloading files is used by us, so we repaired the whole thing on our side in such a quick way:

var 
    $source = $('
').html(iframeBodyContent),
    filename;
$source.children().remove();
filename = $.trim($source.text());

Nested tags are cut out, only plain text remains, cheers! Everyone is working, all possible victims are satisfied.

Why did I even write all this here?

Extensions to browsers, both high-quality and not very (such, alas, the majority), are becoming more and more. Most extensions brazenly crash into your code and somehow modify it. And not all of them are equally useful. I was very lucky that the tester had that ill-fated plugin.

Be vigilant (there should be an emoticon, but a harsh UFO warned that you should not insert it here).