U4-5576 - Upgrade to latest AngularJS

Created by Jeroen Breuer 02 Oct 2014, 11:29:57 Updated by Sebastiaan Janssen 18 Jul 2018, 12:59:53

Duplicates: U4-10928

Is required for: U4-11050

Subtask of: U4-11042

Currently Umbraco is using AngularJS v1.1.5. It would be nice if this is upgraded to the latest version. For example I heard that Typescript works a lot better with AngularJS 1.2 if you want to use that in the backoffice.

Comments

Jeroen Breuer 05 Nov 2014, 13:23:19

Blog about Umbraco and Angular: http://umbraco.com/follow-us/blog-archive/2014/11/4/umbraco-and-angular-20


Peter Gregory 25 Feb 2015, 08:19:38

Even if its not V.latest just going to 1.2 at least would be ace.


Martin Griffiths 27 May 2015, 08:59:52

1.3?


Bert Loedeman 27 Jul 2015, 09:38:26

Is AngularJS 1.3 (or, even better, 1.4) still planned for v7.5? TypeScript support for these versions is way better than for the current version!


Shannon Deminick 26 Jun 2017, 07:13:12

Closing issue due to inactivity - see blog post for details https://umbraco.com/blog/issue-tracker-cleanup/


Pete Duncanson 04 Mar 2018, 13:58:07

I think we might be warming this one back up due to http://issues.umbraco.org/issue/U4-11042 as it blocks some additional optimisations we can do such as http://issues.umbraco.org/issue/U4-11050.


Pete Duncanson 04 Mar 2018, 14:34:18

This is the place to start: https://docs.angularjs.org/guide/migration#migrating-from-1-0-to-1-2


Pete Duncanson 05 Mar 2018, 13:06:00

The React team do an amazing job on looking after backwards compat. They use something called CodeMod's which are rulesets that sniff through your code and make the changes needed to bring your code up to standard. Don't worry its not done with RegExpressions, it actually parses your code and builds up a AST, makes the changes to that and then writes it all back down again so you know "it will work" but you might lose some of your formatting etc.

This is what they are using (it seems a little scary on first read but I think its actually not too bad to use in action) https://github.com/facebook/jscodeshift

And here is an example of their post about backwards compat: https://reactjs.org/blog/2017/04/07/react-v15.5.0.html

And their repos for storing the CodeMods: https://github.com/reactjs/react-codemod

This might be a nice way of trying to upgrade the code, instead of manually going through maybe we could use this to build a ruleset and some tools which could upgrade the code and also packages too? I've not had enough time to get super deep into it so I don't even know if this can work with AngularJS (as it has its templates in HTML which it might not be able to parse, unlike React were everything is in JS) but something to look into.

As a nice bonus React add lots of nice warnings in the console when you run the code if you are doing something you shouldn't and links you off to were you can get info on how to fix it. They very nicely do this for stuff that is going to break in the future "You are still using createClass, this will be removed in v16+, please see xxxx for details on how to fix" which is certianly something I think we should be doing more of. Winning over the developers is still super important, help us help ourselves which helps clients :)


Pete Duncanson 05 Mar 2018, 13:28:05

Following on from the above I can't find anythign "complete" for AngularJS that uses CodeMod's.

This is a good intro read into them: https://medium.com/airbnb-engineering/turbocharged-javascript-refactoring-with-codemods-b0cae8b326b9

This is from one of the guys who wrote it, he also Took over the awesome Jest testing framework too and made it great and hes an old MooTooler so whats not to like ;)

https://medium.com/@cpojer/effective-javascript-codemods-5a6686bb46fb

There is this start of a CodeMods for Angular which might help but might also be duff but its all I found: https://github.com/arthurflachs/angular-codemods


david 18 Jul 2018, 12:53:19

i would also want to vote for reactjs to be used wherever possible and a reactnative build of umbraco would be great to create umbraco based apps


Sebastiaan Janssen 18 Jul 2018, 12:59:53

I'll close this as duplicate of U4-10928 For v8, work has completed to go to the latest version of AngularJS (1.7). We may have some more issues flowing out of U4-10928 but we'll deal with them as we go along.


Priority: Normal

Type: Feature (request)

State: Duplicate

Assignee:

Difficulty: Normal

Category:

Backwards Compatible: True

Fix Submitted:

Affected versions: 7.1.6, 7.2.7

Due in version:

Sprint:

Story Points:

Cycle: