I upgraded an Umbraco 7.4.3 website to 7.5.0 with NuGet. I thought everything worked, but when I set debug="false" in the web.config all javascript is broken. I already deleted the ClientDependency folder in the TEMP folder and updated the version number in ClientDependency.config, but the problem remains.
I had an issue with one of my packages not working after the upgrade to 7.5, when in release mode. Clearly seems to ClientDependency related.
When looking in Chrome Console it seemed to be the minified file was throwing an error similar to yours ("suchandsuchcontroller' is not a function"). Looking further it appeared this was happening because a syntax error was in the JS. I tracked this down to the fact that the Angular controllers I'd written had 'use strict' at the top of each .js file. When I removed this, deleted the ClientDependency cache and restarted the site, it then worked.
Now, it might be coincidence, but it seems to be the use of 'use strict' at the top that caused the issue. This may be a red herring, or not the issue for you. The trouble is, because the CD minifies and concatenates all JS files, that an error in just one file can break a lot of others. So maybe check if your controllers have 'use strict' in them? Let me know if this helps and we can report it to Shannon.
Can you both please point me to where i can find your 'raw' JS files so i can test the minification process - to see if it's causing issues for whatever reason. If you can do this asap it would be most appreciated.
But this also broke my TraceLog Viewer package, even though that didn't have the 'use strict' statement. However, they seemed to be minified together, so an error in one broke all the others in the same bundle.
If you put a semicolon after 'use strict' (which you should) then it won't break.
I could update CDF (JsMin) to deal with this circumstance but it's really an error to not have a semicolon after this. I probably won't get around to doing that anytime soon however.
I usually do use semicolons, not sure why it isn't in that file. Though I thought they were entirely optional? After all, it does work when not minified?
Browsers will allow this to work, but browsers allow all sorts of invalid JS to execute - it is unfortunately the nature of JS in that it's rules are too lax. Ironically this is part of the reason to introduce 'use strict'; :)
Semi colons are required for this, it is part of the ecma spec. Though browsers will allow this to 'work' the reason they are required is because in some cases it won't actually work. You won't actually know it's not working because in these cases 'use strict' won't be applied, but the browser doesn't care. For example:
'use strict'
.toString();
The browser is just going to call a method here, 'use strict' isn't actually going to do anything - thus a semi colon is a requirement.
Cool, I agree, and I'll update my package(s) as soon as I get chance.
Though I think you do need to take into account that people don't always write perfect JavaScript and that it's rules can be pretty lax. It's probably going to bite other people at some point.
PS. 7.5 is a fantastic release, really great work to you and the team!
Yes I understand that. CDF uses JSMin which is not a language parser, it doesn't know about language functionality but this is what makes it fast. If we were to use AjaxMin which knows about language features, these types of things are possible, but those parsers are much slower and since CDF is a runtime parser it needs to be fast - though CDF does hard cache on disk once processing is done, performance should still be a requirement for that first bundle processing.
CDF has been like this since it's beginning but over the years I've improved JSMin to cater for all sorts of new things that have come into the JS world but because JSMin is not 'smart' it cannot cater for all developers' mistakes.
If this does keep biting other developers I can look at changing the js min engine to use AjaxMin or have it as an option but in the past 5 years we've seen a very minimal amount of issues relating to issues such as this.
Out of interest, Shannon, is there any reason you "rolled your own" minification engine? For our front-end sites we use ASP.NET MVC bundling and minification along with WebGrease. Seems to work pretty well. Not that CD doesn't, and it's really cool, just wondering...?
CDF Pre-dates all of these bundlers - it was an original :) So maybe they all copied it :P
These other ones also don't persist changes to disk, it's all in memory which isn't great for performance. CDF was originally design for webforms and working in teams so you can make your components dependent on any 'client dependencies' instead of having to know all of the dependencies up front. Nowadays things have changed tremendously, so most of that logic is unnecessary but still supported. Because of this functionality though CDF supports dynamic bundling functionality along with being able to have your views and even partial views register dependencies - no other framework can do that. But again, it's a niche thing that most people don't use or need. There's various other features CDF does too but also quite niche and was included because the web at the time didn't support some of these things (like mime type compression) but now most of the web servers do these types of things ootb.
Dan pointed me in the right direction. I started looking in my solution for 'use strict' and I saw that code in the MultiUrlPicker.js file. Turns out I was using an older version of the RJP.UmbracoMultiUrlPicker and after upgrading the error was gone :-).
All Javascript is broken after upgrade to Umbraco 7.5
Hello,
I upgraded an Umbraco 7.4.3 website to 7.5.0 with NuGet. I thought everything worked, but when I set debug="false" in the web.config all javascript is broken. I already deleted the ClientDependency folder in the TEMP folder and updated the version number in ClientDependency.config, but the problem remains.
Here is the (large) console.log:
For now I need to set debug="true" in the web.config so everything keeps working.
Any idea what could be the problem?
Thanks.
Jeroen
I already did a "Empty Cache and Hard Reload" in the chrome dev tools.
I had an issue with one of my packages not working after the upgrade to 7.5, when in release mode. Clearly seems to ClientDependency related.
When looking in Chrome Console it seemed to be the minified file was throwing an error similar to yours ("suchandsuchcontroller' is not a function"). Looking further it appeared this was happening because a syntax error was in the JS. I tracked this down to the fact that the Angular controllers I'd written had
'use strict'
at the top of each .js file. When I removed this, deleted the ClientDependency cache and restarted the site, it then worked.Now, it might be coincidence, but it seems to be the use of 'use strict' at the top that caused the issue. This may be a red herring, or not the issue for you. The trouble is, because the CD minifies and concatenates all JS files, that an error in just one file can break a lot of others. So maybe check if your controllers have 'use strict' in them? Let me know if this helps and we can report it to Shannon.
Can you both please point me to where i can find your 'raw' JS files so i can test the minification process - to see if it's causing issues for whatever reason. If you can do this asap it would be most appreciated.
I assume this is one of them: https://github.com/leekelleher/umbraco-nested-content/blob/develop/src/Our.Umbraco.NestedContent/Web/UI/App_Plugins/NestedContent/Js/nestedcontent.controllers.js
so i'll test with that
Shannon, the issue I saw was in my God Mode package:
https://our.umbraco.org/projects/developer-tools/diplo-god-mode/
You can view the source for the JS controllers on GitHub:
https://github.com/DanDiplo/Umbraco.GodMode/tree/master/Umbraco.Web/App_Plugins/GodMode/BackOffice/Scripts
Each controller starts with
'use strict'
But this also broke my TraceLog Viewer package, even though that didn't have the 'use strict' statement. However, they seemed to be minified together, so an error in one broke all the others in the same bundle.
Let me know if you need any more...
If you put a semicolon after 'use strict' (which you should) then it won't break.
I could update CDF (JsMin) to deal with this circumstance but it's really an error to not have a semicolon after this. I probably won't get around to doing that anytime soon however.
I usually do use semicolons, not sure why it isn't in that file. Though I thought they were entirely optional? After all, it does work when not minified?
Browsers will allow this to work, but browsers allow all sorts of invalid JS to execute - it is unfortunately the nature of JS in that it's rules are too lax. Ironically this is part of the reason to introduce 'use strict'; :)
Semi colons are required for this, it is part of the ecma spec. Though browsers will allow this to 'work' the reason they are required is because in some cases it won't actually work. You won't actually know it's not working because in these cases 'use strict' won't be applied, but the browser doesn't care. For example:
'use strict' .toString();
The browser is just going to call a method here, 'use strict' isn't actually going to do anything - thus a semi colon is a requirement.
Cool, I agree, and I'll update my package(s) as soon as I get chance.
Though I think you do need to take into account that people don't always write perfect JavaScript and that it's rules can be pretty lax. It's probably going to bite other people at some point.
PS. 7.5 is a fantastic release, really great work to you and the team!
Yes I understand that. CDF uses JSMin which is not a language parser, it doesn't know about language functionality but this is what makes it fast. If we were to use AjaxMin which knows about language features, these types of things are possible, but those parsers are much slower and since CDF is a runtime parser it needs to be fast - though CDF does hard cache on disk once processing is done, performance should still be a requirement for that first bundle processing.
CDF has been like this since it's beginning but over the years I've improved JSMin to cater for all sorts of new things that have come into the JS world but because JSMin is not 'smart' it cannot cater for all developers' mistakes.
If this does keep biting other developers I can look at changing the js min engine to use AjaxMin or have it as an option but in the past 5 years we've seen a very minimal amount of issues relating to issues such as this.
I've released a new version of my God Mode package which fixes the semicolon issue and also a couple of CSS changes that 7.5 introduced:
https://our.umbraco.org/projects/developer-tools/diplo-god-mode/
(PS. the new package browser is great!)
https://www.nuget.org/packages/Diplo.GodMode/
Out of interest, Shannon, is there any reason you "rolled your own" minification engine? For our front-end sites we use ASP.NET MVC bundling and minification along with WebGrease. Seems to work pretty well. Not that CD doesn't, and it's really cool, just wondering...?
CDF Pre-dates all of these bundlers - it was an original :) So maybe they all copied it :P
These other ones also don't persist changes to disk, it's all in memory which isn't great for performance. CDF was originally design for webforms and working in teams so you can make your components dependent on any 'client dependencies' instead of having to know all of the dependencies up front. Nowadays things have changed tremendously, so most of that logic is unnecessary but still supported. Because of this functionality though CDF supports dynamic bundling functionality along with being able to have your views and even partial views register dependencies - no other framework can do that. But again, it's a niche thing that most people don't use or need. There's various other features CDF does too but also quite niche and was included because the web at the time didn't support some of these things (like mime type compression) but now most of the web servers do these types of things ootb.
Hello,
Dan pointed me in the right direction. I started looking in my solution for 'use strict' and I saw that code in the MultiUrlPicker.js file. Turns out I was using an older version of the RJP.UmbracoMultiUrlPicker and after upgrading the error was gone :-).
Jeroen
is working on a reply...