1

I'm experiencing right now an interesting fact:

If I write this to load only jQuery minified version:

document.write('<script type="text/javascript" src="../rtvizion/Scripts/jquery-1.10.2.min.js"></script>');

both versions of jQuery files are being loaded:

jquery-1.10.2.js
jquery-1.10.2.min.js

as can be seen in Google Chrome Sources:

enter image description here

If I comment out that document.write line then no jQuery file gets loaded.

The problem I have with both files loading is that it's creating duplicate objects/handlers in my own code.

Of course I can safely delete the one not minified (jquery-1.10.2.js) since I'm not using/referencing it anywhere but I'm really curious about what's causing this behavior...

Why is this happening?

Leniel Maccaferri
  • 94,281
  • 40
  • 348
  • 451
  • 1
    Use the element inspector to check how many script tags are added to DOM. – Salman A Jan 14 '14 at 15:33
  • Is your `jquery-1.10.2.min.js` the original jQuery file? Maybe it's loading the other one for some strange reason? – Pekka Jan 14 '14 at 15:33
  • @Pekka웃 Yes the original ones... I did not touch them. – Leniel Maccaferri Jan 14 '14 at 15:34
  • It doesn't seem possible that it's caused by that line. Are you 10000% sure the other file isn't getting included elsewhere in your document? Despite the fact that when you comment out that line, nothing gets loaded? – Pekka Jan 14 '14 at 15:35
  • What happens if you just use a script tag instead of document.write('<...> – chim Jan 14 '14 at 15:36
  • Yep... but the thing is the `document.write`, isn't it? – Leniel Maccaferri Jan 14 '14 at 15:37
  • Also http://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice – chim Jan 14 '14 at 15:38
  • @chim I'm doing this inside another `.js` file to dynamically insert the scripts. – Leniel Maccaferri Jan 14 '14 at 15:38
  • 1
    I don't know about anyone else but I can't help with just the picture and one line of code. – j08691 Jan 14 '14 at 15:38
  • yeah need more info, it could be any of the other js – chim Jan 14 '14 at 15:39
  • @SalmanA interesting ideed: I checked Chrome's `Elements` tab and only the minified jQuery is being inserted in the page source... so I guess this is a bug regarding Chrome's `Sources` tab. Not sure... – Leniel Maccaferri Jan 14 '14 at 15:42
  • 1
    @j08691 WOOT! I found the problem after posting the question... I'll answer it afterwards... – Leniel Maccaferri Jan 14 '14 at 15:45
  • missing single quote `'` here `.min.js"');` or is just a typo? – Rahil Wazir Jan 14 '14 at 15:48
  • @RahilWazir that was just a typo while pasting the code in the question. :) – Leniel Maccaferri Jan 14 '14 at 15:51
  • 1
    Do you have `jquery-1.10.2.js`, `jquery-1.10.2.min.js` and a `jquery.min.map` in your Scripts folder? Can you check if `General > Source : Enable JS source maps` is enabled in the settings of the chrome dev tools, if yes please check the behavior is gone when you disable it. – t.niese Jan 14 '14 at 16:10
  • @t.niese that's it bro! This fixed what looked like an "issue" to me. In fact this is a feature... I had thought about doing this before but didn't try. If you want, add this comment as an answer and I'll accept it! Do it... :D – Leniel Maccaferri Jan 14 '14 at 16:18

2 Answers2

2

jQuery uses SourceMaps, this enables you debug minimized code.

When you open the console and the setting General > Source : Enable JS source maps is enabled, then chrome checks for the SourceMap, and out of the sourcemap creates maps to the original version.

This is why you see both version.

You see both files, because a minimized file could contain multiple files, which when source map is enabled will be displayed as individual ones.

EDIT
The files referenced by the source map are not immediately loaded so they don't appear in the network tab. Only if the content is displayed while debugging they will be loaded and only at that time you will see them in the network tab.

t.niese
  • 32,069
  • 7
  • 56
  • 86
  • 1
    @LenielMacaferi i also had the same problem a while ago, it gave me headache :D But there I had a bunch of files appearing in sources but not in the networking tab, that was really frustrating. – t.niese Jan 14 '14 at 16:22
  • and you see from my answer that my problem is down the pipe... this really got me confused! :) – Leniel Maccaferri Jan 14 '14 at 16:23
0

Well... after posting the question and following the advice from Salman A. I could see that the problem was not with document.write but with another app that loads dynamic widgets into the page. The widget also has a script tag linking to jQuery. This causes the problem in my case.

Google Chrome's Sources tab is showing both jQuery files but if I look at the page's source in the Elements tab I see only the minified one present. Looks like the Sources view is misleading!

t.niese's answers it all.

Community
  • 1
  • 1
Leniel Maccaferri
  • 94,281
  • 40
  • 348
  • 451