V10: Update @umbraco-ui/uui, jQuery, ace-editor, nouislider, spectrum-colorpicker2 (#15197)

* V13: Add support for Node.js 20 (#15022)

* update versionSpec to nodejs 20 and avoid specifying minor and patch versions to improve Azure Pipelines stability

* update engines and package lock files

* update helpful displayNames for npm builds

* add retry to counter nodejs.org timeouts

add retryCountOnTaskFailure as suggested on https://developercommunity.visualstudio.com/t/NodeTool0-task-to-install-nodejs-fails/10455454

* update lockfile

* bump nvm support to latest node.js 20.9 LTS

* build(deps): bump @umbraco-ui/uui from 1.3.0 to 1.5.0

* build(deps): bump public dependencies to latest

* build(deps-dev): bump build dependencies to latest

* build(deps-dev): bump test tools to latest

* build: add script to lint and run --fix

* revert login merge from v13

build/azure-pipelines.yml

@@ -43,7 +43,7 @@ parameters:
     default: ' '
 
 variables:
-  nodeVersion: 14.18.1
+  nodeVersion: 20
   dotnetVersion: 6.x
   dotnetIncludePreviewVersions: false
   solution: umbraco.sln
@@ -69,6 +69,7 @@ stages:
         steps:
           - task: NodeTool@0
             displayName: Use Node.js $(nodeVersion)
+            retryCountOnTaskFailure: 3
             inputs:
               versionSpec: $(nodeVersion)
           - task: Cache@2
@@ -81,9 +82,9 @@ stages:
               path: $(npm_config_cache)
           - script: npm ci --no-fund --no-audit --prefer-offline
             workingDirectory:  src/Umbraco.Web.UI.Client
-            displayName: Run npm ci
+            displayName: Run npm ci (Backoffice)
           - task: gulp@0
-            displayName: Run gulp build
+            displayName: Run gulp build (Backoffice)
             inputs:
               gulpFile: src/Umbraco.Web.UI.Client/gulpfile.js
               targets: coreBuild
@@ -208,7 +209,8 @@ stages:
           vmImage: 'ubuntu-latest'
         steps:
           - task: NodeTool@0
-            displayName: Use Node.js 10.15.0
+            displayName: Use Node.js 10.15.x
+            retryCountOnTaskFailure: 3
             inputs:
               versionSpec: 10.15.0 # Won't work with higher versions
           - script: |
@@ -442,6 +444,7 @@ stages:
               path: $(Build.SourcesDirectory)/tests/Umbraco.Tests.AcceptanceTest/misc/nupkg
           - task: NodeTool@0
             displayName: Use Node.js $(nodeVersion)
+            retryCountOnTaskFailure: 3
             inputs:
               versionSpec: $(nodeVersion)
           - task: Cache@2

src/Umbraco.Web.UI.Client/.nvmrc

@@ -0,0 +1 @@
+20.9

src/Umbraco.Web.UI.Client/package.json

@@ -10,17 +10,18 @@
     "build:dev": "gulp buildDev",
     "dev": "gulp dev",
     "fastdev": "gulp fastdev",
-    "watch": "gulp watch"
+    "watch": "gulp watch",
+    "lint": "eslint src"
   },
   "engines": {
-    "node": ">=14.0.0 <17",
-    "npm": ">=8.0.0 < 9"
+    "node": ">=20.9",
+    "npm": ">=10.1"
   },
   "dependencies": {
     "@microsoft/signalr": "6.0.9",
-    "@umbraco-ui/uui": "1.3.0",
-    "@umbraco-ui/uui-css": "1.3.0",
-    "ace-builds": "1.22.1",
+    "@umbraco-ui/uui": "1.5.0",
+    "@umbraco-ui/uui-css": "1.5.0",
+    "ace-builds": "1.31.1",
     "angular": "1.8.3",
     "angular-animate": "1.8.3",
     "angular-aria": "1.8.3",
@@ -42,14 +43,14 @@
     "diff": "5.1.0",
     "flatpickr": "4.6.13",
     "font-awesome": "4.7.0",
-    "jquery": "3.7.0",
+    "jquery": "3.7.1",
     "jquery-ui-dist": "1.13.2",
     "jquery-ui-touch-punch": "0.2.3",
     "lazyload-js": "1.0.0",
     "moment": "2.29.4",
     "ng-file-upload": "12.2.13",
-    "nouislider": "15.6.1",
-    "spectrum-colorpicker2": "2.0.9",
+    "nouislider": "15.7.1",
+    "spectrum-colorpicker2": "2.0.10",
     "tinymce": "4.9.11",
     "typeahead.js": "0.11.1",
     "underscore": "1.13.6",
@@ -58,8 +59,8 @@
   "devDependencies": {
     "@babel/core": "7.19.1",
     "@babel/preset-env": "7.19.1",
-    "autoprefixer": "10.4.14",
-    "cssnano": "5.1.13",
+    "autoprefixer": "10.4.16",
+    "cssnano": "6.0.1",
     "gulp": "4.0.2",
     "gulp-angular-embed-templates": "2.3.0",
     "gulp-babel": "8.0.0",
@@ -78,17 +79,17 @@
     "gulp-watch": "5.0.1",
     "gulp-wrap": "0.15.0",
     "gulp-wrap-js": "0.4.1",
-    "jasmine-core": "4.4.0",
-    "jsdom": "20.0.0",
-    "karma": "6.4.0",
+    "jasmine-core": "5.1.1",
+    "jsdom": "22.1.0",
+    "karma": "6.4.2",
     "karma-jasmine": "5.1.0",
-    "karma-jsdom-launcher": "13.0.0",
+    "karma-jsdom-launcher": "15.0.0",
     "karma-junit-reporter": "2.0.1",
-    "karma-spec-reporter": "0.0.34",
-    "less": "4.1.3",
+    "karma-spec-reporter": "0.0.36",
+    "less": "4.2.0",
     "lodash": "4.17.21",
     "merge-stream": "2.0.0",
-    "postcss": "8.4.16",
+    "postcss": "8.4.31",
     "run-sequence": "2.2.1"
   }
 }

src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/config/grid.default.config.js

@@ -170,7 +170,7 @@ var uSkyGridConfig = [
             }, {
                 grid: 3,
                 percentage: 25
-            }, ]
+            } ]
         }, {
             models: [{
                 grid: 2,
@@ -279,7 +279,7 @@ var uSkyGridConfig = [
             }, {
                 grid: 3,
                 percentage: 25
-            }, ]
+            } ]
         }, {
             models: [{
                 grid: 2,