From 8af1e2bcf318bf655a71c48220b6879dca06b238 Mon Sep 17 00:00:00 2001
From: Richard Ockerby <richard@coalfacedevelopment.com>
Date: Sat, 30 May 2020 23:18:56 +0100
Subject: [PATCH 01/42] If `httpContext.GetCurrentRequestIpAddress` is called
 with a spoofed HTTP context then IP returns null

---
 src/Umbraco.Core/Compose/AuditEventsComponent.cs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Core/Compose/AuditEventsComponent.cs b/src/Umbraco.Core/Compose/AuditEventsComponent.cs
index 453fd6314a..033b46c13f 100644
--- a/src/Umbraco.Core/Compose/AuditEventsComponent.cs
+++ b/src/Umbraco.Core/Compose/AuditEventsComponent.cs
@@ -68,7 +68,7 @@ namespace Umbraco.Core.Compose
             {
                 var httpContext = HttpContext.Current == null ? (HttpContextBase) null : new HttpContextWrapper(HttpContext.Current);
                 var ip = httpContext.GetCurrentRequestIpAddress();
-                if (ip.ToLowerInvariant().StartsWith("unknown")) ip = "";
+                if (ip == null || ip.ToLowerInvariant().StartsWith("unknown")) ip = "";
                 return ip;
             }
         }

From 4266e2b1d159b342389c49fa4c7f3001814b554f Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Wed, 13 May 2020 20:45:57 +0200
Subject: [PATCH 02/42] Fix "Edit: undefined" in content editor title

---
 .../components/editor/umbeditorcontentheader.directive.js       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorcontentheader.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorcontentheader.directive.js
index 7bd812e321..9b8f92d7c3 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorcontentheader.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditorcontentheader.directive.js
@@ -27,7 +27,7 @@
                 var title = data[2] + ": ";
                 if (!scope.isNew) {
                     scope.a11yMessage += " " + scope.editor.content.name;
-                    title += scope.content.name;
+                    title += scope.editor.content.name;
                 } else {
                     var name = editorState.current.contentTypeName;
                     scope.a11yMessage += " " + name;

From 3680f22321c77b8732fbc4d94c26e399d19e6cdd Mon Sep 17 00:00:00 2001
From: Warren Buckley <warren@umbraco.com>
Date: Wed, 10 Jun 2020 14:33:32 +0100
Subject: [PATCH 03/42] Allows unpublished content to render a macro HTML in
 the RTE

---
 src/Umbraco.Web/Editors/MacroRenderingController.cs |  2 +-
 src/Umbraco.Web/IUmbracoComponentRenderer.cs        | 13 +++++++++++++
 src/Umbraco.Web/UmbracoComponentRenderer.cs         |  9 +++++++++
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web/Editors/MacroRenderingController.cs b/src/Umbraco.Web/Editors/MacroRenderingController.cs
index 7aabff6822..33a58328b9 100644
--- a/src/Umbraco.Web/Editors/MacroRenderingController.cs
+++ b/src/Umbraco.Web/Editors/MacroRenderingController.cs
@@ -142,7 +142,7 @@ namespace Umbraco.Web.Editors
                 //need to create a specific content result formatted as HTML since this controller has been configured
                 //with only json formatters.
                 result.Content = new StringContent(
-                    _componentRenderer.RenderMacro(pageId, m.Alias, macroParams).ToString(),
+                    _componentRenderer.RenderMacroForContent(publishedContent, m.Alias, macroParams).ToString(),
                     Encoding.UTF8,
                     "text/html");
 
diff --git a/src/Umbraco.Web/IUmbracoComponentRenderer.cs b/src/Umbraco.Web/IUmbracoComponentRenderer.cs
index 4dc9036e6b..f05afe3f6b 100644
--- a/src/Umbraco.Web/IUmbracoComponentRenderer.cs
+++ b/src/Umbraco.Web/IUmbracoComponentRenderer.cs
@@ -42,5 +42,18 @@ namespace Umbraco.Web
         /// <param name="parameters">The parameters.</param>
         /// <returns></returns>
         IHtmlString RenderMacro(int contentId, string alias, IDictionary<string, object> parameters);
+
+        /// <summary>
+        /// Renders the macro with the specified alias, passing in the specified parameters.
+        /// </summary>
+        /// <param name="content">An IPublishedContent to use for the context for the macro rendering</param>
+        /// <param name="alias">The alias.</param>
+        /// <param name="parameters">The parameters.</param>
+        /// <returns>A raw HTML string of the macro output</returns>
+        /// <remarks>
+        /// Currently only used when the node is unpublished and unable to get the contentId item from the
+        /// content cache as its unpublished. This deals with taking in a preview/draft version of the content node
+        /// </remarks>
+        IHtmlString RenderMacroForContent(IPublishedContent content, string alias, IDictionary<string, object> parameters);
     }
 }
diff --git a/src/Umbraco.Web/UmbracoComponentRenderer.cs b/src/Umbraco.Web/UmbracoComponentRenderer.cs
index 0373c73724..aa4cbefe7b 100644
--- a/src/Umbraco.Web/UmbracoComponentRenderer.cs
+++ b/src/Umbraco.Web/UmbracoComponentRenderer.cs
@@ -102,6 +102,15 @@ namespace Umbraco.Web
             return RenderMacro(content, alias, parameters);
         }
 
+
+        public IHtmlString RenderMacroForContent(IPublishedContent content, string alias, IDictionary<string, object> parameters)
+        {
+            if(content == null)
+                throw new InvalidOperationException("Cannot render a macro, IPublishedContent is null");
+
+            return RenderMacro(content, alias, parameters);
+        }
+
         /// <summary>
         /// Renders the macro with the specified alias, passing in the specified parameters.
         /// </summary>

From 1347b973f1c8617d372592236eab101507dd4179 Mon Sep 17 00:00:00 2001
From: Rachel Breeze <RachBreeze@users.noreply.github.com>
Date: Wed, 10 Jun 2020 16:20:44 +0100
Subject: [PATCH 04/42] V8/tmplogin (#8203)

---
 .../application/umblogin.directive.js         |  1 +
 .../components/application/umb-login.html     | 78 +++++++++----------
 2 files changed, 38 insertions(+), 41 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umblogin.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umblogin.directive.js
index 6dd740e08b..c2b298ad24 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umblogin.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umblogin.directive.js
@@ -274,6 +274,7 @@
             vm.showEmailResetConfirmation = false;
 
             if (vm.requestPasswordResetForm.$invalid) {
+                vm.errorMsg = 'Email address cannot be empty';
                 return;
             }
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-login.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-login.html
index 098d69960d..9787c57940 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-login.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-login.html
@@ -23,7 +23,7 @@
                             <small style="font-size: 13px;">{{vm.invitedUserPasswordModel.passwordPolicyText}}</small>
                         </label>
                         <input type="password" ng-model="vm.invitedUserPasswordModel.password" name="password" id="umb-passwordOne" class="-full-width-input" umb-auto-focus required val-server-field="value" ng-minlength="{{vm.invitedUserPasswordModel.passwordPolicies.minPasswordLength}}" />
-                        <span ng-messages="inviteUserPasswordForm.password.$error" show-validation-on-submit >
+                        <span ng-messages="inviteUserPasswordForm.password.$error" show-validation-on-submit>
                             <span class="help-inline" ng-message="required"><localize key="user_passwordIsBlank">Your new password cannot be blank!</localize></span>
                             <span class="help-inline" ng-message="minlength">Minimum {{vm.invitedUserPasswordModel.passwordPolicies.minPasswordLength}} characters</span>
                             <span class="help-inline" ng-message="valServerField">{{inviteUserPasswordForm.password.errorMsg}}</span>
@@ -33,7 +33,7 @@
                     <div class="control-group" ng-class="{error: vm.setPasswordForm.confirmPassword.$invalid}">
                         <label for="umb-confirmPasswordOne"><localize key="user_confirmNewPassword">Confirm new password</localize></label>
                         <input type="password" ng-model="vm.invitedUserPasswordModel.confirmPassword" name="confirmPassword" id="umb-confirmPasswordOne" class="-full-width-input" required val-compare="password" />
-                        <span ng-messages="inviteUserPasswordForm.confirmPassword.$error" show-validation-on-submit >
+                        <span ng-messages="inviteUserPasswordForm.confirmPassword.$error" show-validation-on-submit>
                             <span class="help-inline" ng-message="required"><localize key="general_required">Required</localize></span>
                             <span class="help-inline" ng-message="valCompare"><localize key="user_passwordMismatch">The confirmed password doesn't match the new password!</localize></span>
                         </span>
@@ -41,11 +41,10 @@
                     </div>
 
                     <div class="flex justify-between items-center">
-                        <umb-button
-                            type="submit"
-                            button-style="success"
-                            state="vm.invitedUserPasswordModel.buttonState"
-                            label="Save password">
+                        <umb-button type="submit"
+                                    button-style="success"
+                                    state="vm.invitedUserPasswordModel.buttonState"
+                                    label="Save password">
                         </umb-button>
                     </div>
 
@@ -58,11 +57,10 @@
 
                     <ng-form name="vm.avatarForm">
 
-                        <umb-progress-bar
-                            style="max-width: 100px; margin-bottom: 5px;"
-                            ng-show="vm.avatarFile.uploadStatus === 'uploading'"
-                            progress="{{ vm.avatarFile.uploadProgress }}"
-                            size="s">
+                        <umb-progress-bar style="max-width: 100px; margin-bottom: 5px;"
+                                          ng-show="vm.avatarFile.uploadStatus === 'uploading'"
+                                          progress="{{ vm.avatarFile.uploadProgress }}"
+                                          size="s">
                         </umb-progress-bar>
 
                         <div class="umb-info-local-item text-error mt3" ng-if="vm.avatarFile.uploadStatus === 'error'">
@@ -70,19 +68,18 @@
                         </div>
 
                         <a class="umb-avatar-btn"
-                            ngf-select
-                            ng-model="vm.avatarFile.filesHolder"
-                            ngf-change="vm.changeAvatar($files, $event)"
-                            ngf-multiple="false"
-                            ngf-pattern="{{vm.avatarFile.acceptedFileTypes}}"
-                            ngf-max-size="{{ vm.avatarFile.maxFileSize }}">
+                           ngf-select
+                           ng-model="vm.avatarFile.filesHolder"
+                           ngf-change="vm.changeAvatar($files, $event)"
+                           ngf-multiple="false"
+                           ngf-pattern="{{vm.avatarFile.acceptedFileTypes}}"
+                           ngf-max-size="{{ vm.avatarFile.maxFileSize }}">
 
-                            <umb-avatar
-                                color="gray"
-                                size="xl"
-                                unknown-char="+"
-                                img-src="{{vm.invitedUser.avatars[3]}}"
-                                img-srcset="{{vm.invitedUser.avatars[4]}} 2x, {{invitedUser.avatars[4]}} 3x">
+                            <umb-avatar color="gray"
+                                        size="xl"
+                                        unknown-char="+"
+                                        img-src="{{vm.invitedUser.avatars[3]}}"
+                                        img-srcset="{{vm.invitedUser.avatars[4]}} 2x, {{invitedUser.avatars[4]}} 3x">
                             </umb-avatar>
                         </a>
 
@@ -94,11 +91,10 @@
                     <localize key="user_userinviteAvatarMessage"></localize>
                 </p>
                 <div class="flex justify-center items-center">
-                    <umb-button
-                        type="button"
-                        button-style="success"
-                        label="Done"
-                        action="vm.getStarted()">
+                    <umb-button type="button"
+                                button-style="success"
+                                label="Done"
+                                action="vm.getStarted()">
                     </umb-button>
                 </div>
             </div>
@@ -153,7 +149,7 @@
                         </div>
                         <div class="control-group" ng-class="{error: vm.loginForm.username.$invalid}">
                             <label for="umb-username">{{vm.labels.usernameLabel}}</label>
-                            <input type="text" ng-model="vm.login" name="username" id="umb-username" class="-full-width-input" placeholder="{{vm.labels.usernamePlaceholder}}" focus-when="{{vm.view === 'login'}}" aria-required="true"/>
+                            <input type="text" ng-model="vm.login" name="username" id="umb-username" class="-full-width-input" placeholder="{{vm.labels.usernamePlaceholder}}" focus-when="{{vm.view === 'login'}}" aria-required="true" />
                         </div>
 
                         <div class="control-group" ng-class="{error: vm.loginForm.password.$invalid}">
@@ -188,21 +184,21 @@
                     </p>
 
                     <form method="POST" name="vm.requestPasswordResetForm" ng-submit="vm.requestPasswordResetSubmit(email)">
-                        <div class="control-group" ng-class="{error: requestPasswordResetForm.email.$invalid}">
+                        <div class="control-group" ng-class="{error: vm.requestPasswordResetForm.email.$invalid}">
                             <label for="umb-email"><localize key="general_email">Email</localize></label>
                             <input type="email" val-email ng-model="email" name="email" id="umb-email" class="-full-width-input" localize="placeholder" placeholder="@placeholders_email" focus-when="{{vm.view === 'request-password-reset'}}" />
                         </div>
 
-                        <div class="control-group" ng-show="requestPasswordResetForm.$invalid">
-                            <div class="text-error">{{errorMsg}}</div>
+                        <div ng-messages="vm.requestPasswordResetForm.$error" class="control-group" ng-show="vm.requestPasswordResetForm.$invalid">
+                            <p ng-message="auth" class="text-error" role="alert" tabindex="0">{{vm.errorMsg}}</p>
                         </div>
 
                         <div class="control-group" ng-show="vm.showEmailResetConfirmation">
                             <div class="text-info" role="alert">
                                 <p tabindex="0">
-                                <localize key="login_requestPasswordResetConfirmation">An email with password reset instructions will be sent to the specified address if it matched our records</localize>
-                                    </p>
-                                </div>
+                                    <localize key="login_requestPasswordResetConfirmation">An email with password reset instructions will be sent to the specified address if it matched our records</localize>
+                                </p>
+                            </div>
                         </div>
 
                         <div class="flex justify-between items-center">
@@ -231,16 +227,16 @@
                             <input type="password" ng-model="vm.confirmPassword" name="confirmPassword" id="umb-confirmPasswordThree" class="-full-width-input" localize="placeholder" placeholder="@placeholders_confirmPassword" />
                         </div>
 
-                        <div ng-hide="vm.resetComplete" class="control-group" ng-show="vm.setPasswordForm.$invalid">
-                            <div class="text-error">{{vm.errorMsg}}</div>
+                        <div ng-messages="vm.setPasswordForm.$error" class="control-group" ng-show="vm.setPasswordForm.$invalid">
+                            <p ng-message="auth" class="text-error" role="alert" tabindex="0">{{vm.errorMsg}}</p>
                         </div>
-
                         <div class="control-group" ng-show="vm.showSetPasswordConfirmation">
                             <div class="text-info">
+                                <p tabindex="0">
                                 <localize key="login_setPasswordConfirmation">Your new password has been set and you may now use it to log in.</localize>
+                                </p>
                             </div>
                         </div>
-
                         <div class="flex justify-between items-center">
                             <button ng-hide="vm.resetComplete" type="submit" class="btn btn-success" val-trigger-change="#login .form input"><localize key="general_submit">Submit</localize></button>
                             <a class="muted" href="#" prevent-default ng-click="vm.showLogin()"><localize key="login_returnToLogin">Return to login form</localize></a>
@@ -251,7 +247,7 @@
 
                 <div ng-show="vm.view == 'password-reset-code-expired'">
                     <div class="text-error" ng-repeat="error in vm.resetPasswordCodeInfo.errors">
-                        <span>{{error}}</span>
+                        <p class="text-error">{{error}}</p>
                     </div>
 
                     <div class="switch-view">

From 349a46c311fef19fe7a5896b4aa08bb3a2b1a699 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Thu, 11 Jun 2020 19:14:46 +0200
Subject: [PATCH 05/42] Adjust property editor settings (#8251)

Co-authored-by: Bjarne Fyrstenborg <bf@oerskov-gruppen.lan>
---
 .../less/components/umb-group-builder.less    |  1 -
 .../propertysettings/propertysettings.html    | 26 +++++++------------
 .../macros/infiniteeditors/parameter.html     | 25 ++++++++----------
 3 files changed, 21 insertions(+), 31 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
index ac7a2c63ce..6eded29b8b 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
@@ -527,7 +527,6 @@ input.umb-group-builder__group-sort-value {
         text-align: left;
         display: flex;
         align-items: center;
-        max-width: calc(100% - 48px);
         min-height: 80px;
         color: @ui-action-discreet-type;
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/propertysettings/propertysettings.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/propertysettings/propertysettings.html
index 1b28e84607..af9295f1ed 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/propertysettings/propertysettings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/propertysettings/propertysettings.html
@@ -54,34 +54,32 @@
 
                         <div class="editor-wrapper umb-control-group control-group" ng-model="model.property.editor" val-require-component ng-if="!model.property.locked">
 
-                            <a data-element="editor-add" href="" ng-if="!model.property.editor" class="editor-placeholder" hotkey="alt+shift+e" ng-click="vm.openDataTypePicker(model.property)">
+                            <button type="button" class="btn-reset editor-placeholder" data-element="editor-add" ng-if="!model.property.editor" hotkey="alt+shift+e" ng-click="vm.openDataTypePicker(model.property)">
                                 <localize key="defaultdialogs_selectEditor"></localize>
                                 <div ng-messages="model.property.editor" show-validation-on-submit>
                                     <span class="umb-validation-label" ng-message="required">Required editor</span>
                                 </div>
-                            </a>
+                            </button>
 
                             <div class="editor clearfix" ng-if="model.property.editor">
 
-                                <button class="btn-reset editor-info" ng-click="vm.openDataTypeSettings(model.property)">
+                                <button type="button" class="btn-reset editor-info" ng-click="vm.openDataTypeSettings(model.property)">
                                     <div class="editor-icon-wrapper">
-                                        <i class="icon {{ model.property.dataTypeIcon }}" ng-class="{'icon-autofill': model.property.dataTypeIcon == null}"></i>
+                                        <i class="icon {{ model.property.dataTypeIcon }}" ng-class="{'icon-autofill': model.property.dataTypeIcon == null}" aria-hidden="true"></i>
                                     </div>
 
                                     <div class="editor-details">
                                         <span class="editor-name">{{ model.property.dataTypeName }}</span>
                                         <span class="editor-editor">{{ model.property.editor }}</span>
                                     </div>
-
                                 </button>
 
-                                <button class="editor-remove-icon btn-reset pull-right"
+                                <button type="button" class="editor-remove-icon btn-reset pull-right"
                                     ng-click="vm.openDataTypePicker(model.property)"
                                     hotkey="alt+shift+d"
                                     localize="title"
-                                    title="@actions_changeDataType"
-                                >
-                                    <i class="icon icon-wrong"></i>
+                                    title="@actions_changeDataType">
+                                    <i class="icon icon-wrong" aria-hidden="true"></i>
                                 </button>
                             </div>
 
@@ -108,8 +106,7 @@
                                    placeholder="@validation_mandatoryMessage"
                                    ng-model="model.property.validation.mandatoryMessage"
                                    ng-if="model.property.validation.mandatory"
-                                   ng-keypress="vm.submitOnEnter($event)">
-                            </input>
+                                   ng-keypress="vm.submitOnEnter($event)" />
 
                             <label class="mt3">
                                 <localize key="validation_customValidation"></localize>
@@ -144,8 +141,7 @@
                             <h5><localize key="contentTypeEditor_cultureVariantHeading" /></h5>
                             <umb-toggle data-element="permissions-allow-culture-variant"
                                         checked="model.property.allowCultureVariant"
-                                        on-click="vm.toggleAllowCultureVariants()"
-                            >
+                                        on-click="vm.toggleAllowCultureVariants()">
                             </umb-toggle>
 
                         </div>
@@ -155,8 +151,7 @@
 
                             <umb-toggle data-element="permissions-allow-segment-variant"
                                         checked="model.property.allowSegmentVariant"
-                                        on-click="vm.toggleAllowSegmentVariants()"
-                            >
+                                        on-click="vm.toggleAllowSegmentVariants()">
                             </umb-toggle>
 
                         </div>
@@ -195,7 +190,6 @@
                                         on-click="vm.toggleIsSensitiveData()">
                             </umb-toggle>
 
-
                         </div>
                     </div>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/macros/infiniteeditors/parameter.html b/src/Umbraco.Web.UI.Client/src/views/macros/infiniteeditors/parameter.html
index 5a18ddf2cb..8a915be57b 100644
--- a/src/Umbraco.Web.UI.Client/src/views/macros/infiniteeditors/parameter.html
+++ b/src/Umbraco.Web.UI.Client/src/views/macros/infiniteeditors/parameter.html
@@ -41,25 +41,22 @@
                             </div>
                         </div>
 
-                        <a data-element="editor-add" href="" ng-if="!model.parameter.editor" class="editor-placeholder" hotkey="alt+shift+e" ng-click="vm.openMacroParameterPicker(model.parameter)">
+                        <button type="button" class="btn-reset editor-placeholder" data-element="editor-add" ng-if="!model.parameter.editor" hotkey="alt+shift+e" ng-click="vm.openMacroParameterPicker(model.parameter)">
                             <localize key="shortcuts_addEditor"></localize>
-                        </a>
+                        </button>
 
                         <div class="editor clearfix" ng-if="model.parameter.editor">
 
-                            <div class="editor-details">
-                                <button class="btn-reset editor-info" ng-click="vm.openMacroParameterPicker(model.parameter)">
+                            <button type="button" class="btn-reset editor-info" ng-click="vm.openMacroParameterPicker(model.parameter)">
+                                <div class="editor-icon-wrapper">
+                                    <i class="icon {{ model.parameter.dataTypeIcon }}" ng-class="{'icon-autofill': model.parameter.dataTypeIcon == null}" aria-hidden="true"></i>
+                                </div>
 
-                                    <div class="editor-icon-wrapper">
-                                        <i class="icon {{model.parameter.dataTypeIcon}}" ng-class="{'icon-autofill': model.parameter.dataTypeIcon == null}"></i>
-                                    </div>
-
-                                    <div class="editor-details">
-                                        <a href="" class="editor-name">{{model.parameter.dataTypeName}}</a>
-                                        <a href="" class="editor-editor">{{model.parameter.editor}}</a>
-                                    </div>
-                                </button>
-                            </div>
+                                <div class="editor-details">
+                                    <span class="editor-name">{{ model.parameter.dataTypeName }}</span>
+                                    <span class="editor-editor">{{ model.parameter.editor }}</span>
+                                </div>
+                            </button>
 
                         </div>
 

From c4456c53a054069e1d37c8813b07f02f39bfcfd3 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Fri, 12 Jun 2020 15:37:05 +0200
Subject: [PATCH 06/42] v8: Fix disappearing image cropper and grid content
 when using rollback (#5792)

---
 .../infiniteeditors/rollback/rollback.controller.js  | 12 +++++++++++-
 .../common/infiniteeditors/rollback/rollback.html    | 12 ++++++------
 src/Umbraco.Web.UI/Umbraco/config/lang/da.xml        |  3 +++
 src/Umbraco.Web.UI/Umbraco/config/lang/en.xml        |  4 +++-
 src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml     |  3 +++
 5 files changed, 26 insertions(+), 8 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js
index 24ed971de0..08a26ec340 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js
@@ -68,14 +68,20 @@
 
             if(version && version.versionId) {
 
+                vm.loading = true;
+
                 const culture = $scope.model.node.variants.length > 1 ? vm.currentVersion.language.culture : null;
 
                 contentResource.getRollbackVersion(version.versionId, culture)
-                    .then(function(data){
+                    .then(function(data) {
                         vm.previousVersion = data;
                         vm.previousVersion.versionId = version.versionId;
                         createDiff(vm.currentVersion, vm.previousVersion);
+
+                        vm.loading = false;
                         vm.rollbackButtonDisabled = false;
+                    }, function () {
+                        vm.loading = false;
                     });
 
             } else {
@@ -118,6 +124,10 @@
                 tab.properties.forEach((property, propertyIndex) => {
                     var oldProperty = previousVersion.tabs[tabIndex].properties[propertyIndex];
 
+                    // copy existing properties, so it doesn't manipulate existing properties on page
+                    oldProperty = angular.copy(oldProperty);
+                    property = angular.copy(property);
+
                     // we have to make properties storing values as object into strings (Grid, nested content, etc.)
                     if(property.value instanceof Object) {
                         property.value = JSON.stringify(property.value, null, 1);
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.html
index e292a94606..49408d69c3 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.html
@@ -31,8 +31,8 @@
 
                     <div>
 
-                        <h5><localize key="rollback_currentVersion"></localize></h5>
-                        <p>{{vm.currentVersion.name}} (Created: {{vm.currentVersion.createDate}})</p>
+                        <h5><localize key="rollback_currentVersion">Current version</localize></h5>
+                        <p>{{vm.currentVersion.name}} (<localize key="rollback_created">Created</localize>: {{vm.currentVersion.createDate}})</p>
 
                         <h5><localize key="rollback_rollbackTo"></localize></h5>
                         <select
@@ -44,9 +44,9 @@
                         </select>
                     </div>
 
-                    <div ng-if="vm.diff" class="diff" style="border-top: 1px solid #e9e9eb; margin-top: 30px;">
+                    <div ng-if="vm.diff && !vm.loading" class="diff" style="border-top: 1px solid #e9e9eb; margin-top: 30px;">
 
-                        <h5>Changes</h5>
+                        <h5><localize key="rollback_changes">Changes</localize></h5>
                         <small style="margin-bottom: 15px; display: block;"><localize key="rollback_diffHelp"></localize></small>
 
                         <table class="table table-condensed table-bordered">
@@ -54,7 +54,7 @@
                                 <tr>
                                     <td class="bold">Name</td>
                                     <td>
-                                        <span ng-repeat="part in vm.diff.name">
+                                        <span ng-repeat="part in vm.diff.name track by $id(part)">
                                             <ins ng-if="part.added">{{part.value}}</ins>
                                             <del ng-if="part.removed">{{part.value}}</del>
                                             <span ng-if="!part.added && !part.removed">{{part.value}}</span>
@@ -64,7 +64,7 @@
                                 <tr ng-repeat="property in vm.diff.properties track by property.alias">
                                     <td class="bold">{{property.label}}</td>
                                     <td ng-class="{'pre-line': property.isObject, 'word-wrap': !property.isObject}">
-                                        <span ng-repeat="part in property.diff">
+                                        <span ng-repeat="part in property.diff track by $id(part)">
                                             <ins ng-if="part.added">{{part.value}}</ins>
                                             <del ng-if="part.removed">{{part.value}}</del>
                                             <span ng-if="!part.added && !part.removed">{{part.value}}</span>
diff --git a/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml b/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml
index a876b1a6b7..59ce327d4d 100644
--- a/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml
+++ b/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml
@@ -1094,10 +1094,13 @@ Mange hilsner fra Umbraco robotten
     <key alias="customCrop">Brugerdefineret</key>
   </area>
   <area alias="rollback">
+    <key alias="changes">Ændringer</key>
+    <key alias="created">Oprettet</key>
     <key alias="headline">Vælg en version at sammenligne med den nuværende version</key>
     <key alias="currentVersion">Nuværende version</key>
     <key alias="diffHelp"><![CDATA[Her vises forskellene mellem den nuværende version og den valgte version<br /><del>Rød</del> tekst vil ikke blive vist i den valgte version. <ins>Grøn betyder tilføjet</ins>]]></key>
     <key alias="documentRolledBack">Dokument tilbagerullet</key>
+    <key alias="headline">Vælg en version at sammenligne med den nuværende version</key>
     <key alias="htmlHelp">Her vises den valgte version som html. Hvis du ønsker at se forskellen mellem de 2 versioner på samme tid, brug 'diff'-oversigten</key>
     <key alias="rollbackTo">Tilbagerulning til</key>
     <key alias="selectVersion">Vælg version</key>
diff --git a/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml b/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml
index e96ef754c4..0150a5542d 100644
--- a/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml
+++ b/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml
@@ -1336,10 +1336,12 @@ To manage your website, simply open the Umbraco back office and start adding con
     <key alias="customCrop">User defined</key>
   </area>
   <area alias="rollback">
-    <key alias="headline">Select a version to compare with the current version</key>
+    <key alias="changes">Changes</key>
+    <key alias="created">Created</key>
     <key alias="currentVersion">Current version</key>
     <key alias="diffHelp"><![CDATA[This shows the differences between the current version and the selected version<br /><del>Red</del> text will not be shown in the selected version. , <ins>green means added</ins>]]></key>
     <key alias="documentRolledBack">Document has been rolled back</key>
+    <key alias="headline">Select a version to compare with the current version</key>
     <key alias="htmlHelp">This displays the selected version as HTML, if you wish to see the difference between 2 versions at the same time, use the diff view</key>
     <key alias="rollbackTo">Rollback to</key>
     <key alias="selectVersion">Select version</key>
diff --git a/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml b/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
index 2bb6495977..6700818ee0 100644
--- a/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
+++ b/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
@@ -1345,10 +1345,13 @@ To manage your website, simply open the Umbraco back office and start adding con
     <key alias="customCrop">User defined</key>
   </area>
   <area alias="rollback">
+    <key alias="changes">Changes</key>
+    <key alias="created">Created</key>
     <key alias="headline">Select a version to compare with the current version</key>
     <key alias="currentVersion">Current version</key>
     <key alias="diffHelp"><![CDATA[This shows the differences between the current version and the selected version<br /><del>Red</del> text will not be shown in the selected version. , <ins>green means added</ins>]]></key>
     <key alias="documentRolledBack">Document has been rolled back</key>
+    <key alias="headline">Select a version to compare with the current version</key>
     <key alias="htmlHelp">This displays the selected version as HTML, if you wish to see the difference between 2 versions at the same time, use the diff view</key>
     <key alias="rollbackTo">Rollback to</key>
     <key alias="selectVersion">Select version</key>

From 9be4775acfe63d53a8a4bc1557ea7a5268301138 Mon Sep 17 00:00:00 2001
From: Sebastiaan Janssen <sebastiaan@umbraco.com>
Date: Fri, 12 Jun 2020 15:46:06 +0200
Subject: [PATCH 07/42] Make sure to use the new Utilities class

---
 .../common/infiniteeditors/rollback/rollback.controller.js    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js
index 08a26ec340..fb8b649b55 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/rollback/rollback.controller.js
@@ -125,8 +125,8 @@
                     var oldProperty = previousVersion.tabs[tabIndex].properties[propertyIndex];
 
                     // copy existing properties, so it doesn't manipulate existing properties on page
-                    oldProperty = angular.copy(oldProperty);
-                    property = angular.copy(property);
+                    oldProperty = Utilities.copy(oldProperty);
+                    property = Utilities.copy(property);
 
                     // we have to make properties storing values as object into strings (Grid, nested content, etc.)
                     if(property.value instanceof Object) {

From fda7251aedba177bf0add71ad8bdc1ddc0c1910c Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Fri, 12 Jun 2020 16:01:19 +0200
Subject: [PATCH 08/42] Upload media and select media type (#8043)

---
 .../upload/umbfiledropzone.directive.js       | 43 ++++++++++---------
 .../components/upload/umb-file-dropzone.html  |  7 ---
 .../propertyeditors/grid/grid.controller.js   | 35 +++++++--------
 3 files changed, 41 insertions(+), 44 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/upload/umbfiledropzone.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/upload/umbfiledropzone.directive.js
index 3fb1b3eb36..7f405eb28c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/upload/umbfiledropzone.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/upload/umbfiledropzone.directive.js
@@ -20,7 +20,7 @@ TODO
 
 angular.module("umbraco.directives")
     .directive('umbFileDropzone',
-        function($timeout, Upload, localizationService, umbRequestHelper) {
+        function ($timeout, Upload, localizationService, umbRequestHelper, overlayService) {
             return {
                 restrict: 'E',
                 replace: true,
@@ -119,9 +119,8 @@ angular.module("umbraco.directives")
                             //auto-clear the done queue after 3 secs
                             var currentLength = scope.done.length;
                             $timeout(function() {
-                                    scope.done.splice(0, currentLength);
-                                },
-                                3000);
+                                scope.done.splice(0, currentLength);
+                            }, 3000);
                         }
                     }
 
@@ -197,30 +196,34 @@ angular.module("umbraco.directives")
                     }
 
                     function _chooseMediaType() {
-                        scope.mediatypepickerOverlay = {
-                            view: "mediatypepicker",
-                            title: "Choose media type",
-                            acceptedMediatypes: scope.acceptedMediatypes,
-                            hideSubmitButton: true,
-                            show: true,
-                            submit: function(model) {
-                                scope.contentTypeAlias = model.selectedType.alias;
-                                scope.mediatypepickerOverlay.show = false;
-                                scope.mediatypepickerOverlay = null;
-                                _processQueueItem();
-                            },
-                            close: function(oldModel) {
 
-                                scope.queue.map(function(file) {
+                        const dialog = {
+                            view: "itempicker",
+                            filter: scope.acceptedMediatypes.length > 15,
+                            availableItems: scope.acceptedMediatypes,
+                            submit: function (model) {
+                                scope.contentTypeAlias = model.selectedItem.alias;
+                                _processQueueItem();
+
+                                overlayService.close();
+                            },
+                            close: function () {
+
+                                scope.queue.map(function (file) {
                                     file.uploadStatus = "error";
                                     file.serverErrorMessage = "Cannot upload this file, no mediatype selected";
                                     scope.rejected.push(file);
                                 });
                                 scope.queue = [];
-                                scope.mediatypepickerOverlay.show = false;
-                                scope.mediatypepickerOverlay = null;
+
+                                overlayService.close();
                             }
                         };
+
+                        localizationService.localize("defaultdialogs_selectMediaType").then(value => {
+                            dialog.title = value;
+                            overlayService.open(dialog);
+                        });
                     }
 
                     scope.handleFiles = function(files, event) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/upload/umb-file-dropzone.html b/src/Umbraco.Web.UI.Client/src/views/components/upload/umb-file-dropzone.html
index 1a0086e836..b079b72be4 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/upload/umb-file-dropzone.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/upload/umb-file-dropzone.html
@@ -104,11 +104,4 @@
 
 </ng-form>
 
-<umb-overlay
-		ng-if="mediatypepickerOverlay.show"
-		model="mediatypepickerOverlay"
-        view="mediatypepickerOverlay.view"
-		position="right">
-</umb-overlay>
-
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
index 2568f62cf4..a0826f7a96 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
@@ -318,25 +318,26 @@ angular.module("umbraco")
             // Add items overlay menu
             // *********************************************
             $scope.openEditorOverlay = function (event, area, index, key) {
-                var title = "";
-                localizationService.localize("grid_insertControl").then(function (value) {
-                    title = value;
-                    overlayService.open({
-                        view: "itempicker",
-                        filter: area.$allowedEditors.length > 15,
-                        title: title,
-                        availableItems: area.$allowedEditors,
-                        event: event,
-                        submit: function (model) {
-                            if (model.selectedItem) {
-                                $scope.addControl(model.selectedItem, area, index);
-                                overlayService.close();
-                            }
-                        },
-                        close: function () {
+
+                const dialog = {
+                    view: "itempicker",
+                    filter: area.$allowedEditors.length > 15,
+                    availableItems: area.$allowedEditors,
+                    event: event,
+                    submit: function (model) {
+                        if (model.selectedItem) {
+                            $scope.addControl(model.selectedItem, area, index);
                             overlayService.close();
                         }
-                    });
+                    },
+                    close: function () {
+                        overlayService.close();
+                    }
+                };
+
+                localizationService.localize("grid_insertControl").then(value => {
+                    dialog.title = value;
+                    overlayService.open(dialog);
                 });
             };
 

From 567d7176a51d07515441b5393cec5d09ad2a0275 Mon Sep 17 00:00:00 2001
From: Sebastiaan Janssen <sebastiaan@umbraco.com>
Date: Mon, 15 Jun 2020 11:05:40 +0200
Subject: [PATCH 09/42] Importing a doctype would never assign a value to
 UploadedFiles, turns out we don't need UploadedFiles on the model

Additionally added a check to see if temp files were left behind and delete them to prevent errors when the same file has just been uploaded
---
 .../Editors/ContentTypeController.cs          | 27 ++++++++++++-------
 .../Models/ContentTypeImportModel.cs          |  5 +---
 2 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/src/Umbraco.Web/Editors/ContentTypeController.cs b/src/Umbraco.Web/Editors/ContentTypeController.cs
index 9c248f186b..4e1417fb03 100644
--- a/src/Umbraco.Web/Editors/ContentTypeController.cs
+++ b/src/Umbraco.Web/Editors/ContentTypeController.cs
@@ -551,7 +551,6 @@ namespace Umbraco.Web.Editors
         }
 
         [HttpPost]
-        [FileUploadCleanupFilter(false)]
         public async Task<ContentTypeImportModel> Upload()
         {
             if (Request.Content.IsMimeMultipartContent() == false)
@@ -577,20 +576,28 @@ namespace Umbraco.Web.Editors
             var fileName = file.Headers.ContentDisposition.FileName.Trim('\"');
             var ext = fileName.Substring(fileName.LastIndexOf('.') + 1).ToLower();
 
-            // renaming the file because MultipartFormDataStreamProvider has created a random fileName instead of using the name from the
-            // content-disposition for more than 6 years now. Creating a CustomMultipartDataStreamProvider deriving from MultipartFormDataStreamProvider
-            // seems like a cleaner option, but I'm not sure where to put it and renaming only takes one line of code.
-            System.IO.File.Move(result.FileData[0].LocalFileName, root + "\\" + fileName);
+            var destFileName = root + "\\" + fileName;
+            try
+            {
+                // due to a bug before 8.7.0 we didn't delete temp files, so we need to make sure to delete before
+                // moving else you get errors and the upload fails without a message in the UI (there's a JS error)
+                if(System.IO.File.Exists(destFileName))
+                    System.IO.File.Delete(destFileName);
+
+                // renaming the file because MultipartFormDataStreamProvider has created a random fileName instead of using the name from the
+                // content-disposition for more than 6 years now. Creating a CustomMultipartDataStreamProvider deriving from MultipartFormDataStreamProvider
+                // seems like a cleaner option, but I'm not sure where to put it and renaming only takes one line of code.
+                System.IO.File.Move(result.FileData[0].LocalFileName, destFileName);
+            }
+            catch (Exception ex)
+            {
+                Logger.Error<ContentTypeController>(ex, "Error uploading udt file to App_Data: {File}", destFileName);
+            }
 
             if (ext.InvariantEquals("udt"))
             {
                 model.TempFileName = Path.Combine(root, fileName);
 
-                model.UploadedFiles.Add(new ContentPropertyFile
-                {
-                    TempFilePath = model.TempFileName
-                });
-
                 var xd = new XmlDocument
                 {
                     XmlResolver = null
diff --git a/src/Umbraco.Web/Models/ContentTypeImportModel.cs b/src/Umbraco.Web/Models/ContentTypeImportModel.cs
index f6f9a5926d..fbe3e920f8 100644
--- a/src/Umbraco.Web/Models/ContentTypeImportModel.cs
+++ b/src/Umbraco.Web/Models/ContentTypeImportModel.cs
@@ -1,12 +1,11 @@
 using System.Collections.Generic;
 using System.Runtime.Serialization;
-using Umbraco.Core.Models.Editors;
 using Umbraco.Web.Models.ContentEditing;
 
 namespace Umbraco.Web.Models
 {
     [DataContract(Name = "contentTypeImportModel")]
-    public class ContentTypeImportModel : INotificationModel, IHaveUploadedFiles
+    public class ContentTypeImportModel : INotificationModel
     {
         [DataMember(Name = "alias")]
         public string Alias { get; set; }
@@ -19,7 +18,5 @@ namespace Umbraco.Web.Models
 
         [DataMember(Name = "tempFileName")]
         public string TempFileName { get; set; }
-
-        public List<ContentPropertyFile> UploadedFiles => new List<ContentPropertyFile>();
     }
 }

From 35751e257fae1a4a89b697af962807d509b0dbad Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Mon, 15 Jun 2020 11:48:22 +0200
Subject: [PATCH 10/42] Ensure SVG image is shown in preview (#8007)

Co-authored-by: Bjarne Fyrstenborg <bf@oerskov-gruppen.lan>
---
 .../src/less/components/umb-property-file-upload.less           | 2 +-
 src/Umbraco.Web.UI.Client/src/less/property-editors.less        | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-property-file-upload.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-property-file-upload.less
index 9550acfb1b..39b2f4002e 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-property-file-upload.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-property-file-upload.less
@@ -1,7 +1,7 @@
 .umb-property-file-upload {
+    .umb-property-editor--limit-width();
 
     .umb-upload-button-big {
-        max-width: (@propertyEditorLimitedWidth - 40);
         display: block;
         padding: 20px;
         opacity: 1;
diff --git a/src/Umbraco.Web.UI.Client/src/less/property-editors.less b/src/Umbraco.Web.UI.Client/src/less/property-editors.less
index b5870b8dce..a3bdbb0996 100644
--- a/src/Umbraco.Web.UI.Client/src/less/property-editors.less
+++ b/src/Umbraco.Web.UI.Client/src/less/property-editors.less
@@ -724,6 +724,7 @@
 // --------------------------------------------------
 .umb-fileupload {
     display: flex;
+    flex-direction: column;
 }
 
 .umb-fileupload .preview {

From 57d08c964a0196c4426a1b4b1a338ce79cc0aa5f Mon Sep 17 00:00:00 2001
From: Marc Goodson <marc@snowmoon.co.uk>
Date: Wed, 20 May 2020 16:39:55 +0100
Subject: [PATCH 11/42] Broadcast 'formSubmitting' event when Macro Parameter
 Overlay is submitted

Some property editors - eg MultiUrlPicker listen out for the broadcast of the 'formSubmitting' event before setting their value of $scope.model.value... if these editors are used as Macro Parameters they do not save their value. This commit adds the broadcasting of the event when the 'submit' button is called and any parameters have been set.
---
 .../common/infiniteeditors/macropicker/macropicker.controller.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/macropicker/macropicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/macropicker/macropicker.controller.js
index ba577045aa..40338f2dca 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/macropicker/macropicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/macropicker/macropicker.controller.js
@@ -22,6 +22,7 @@ function MacroPickerController($scope, entityResource, macroResource, umbPropEdi
         if ($scope.wizardStep === "macroSelect") {
             editParams(true);
         } else {
+            $scope.$broadcast("formSubmitting", { scope: $scope });
             $scope.model.submit($scope.model);
         }
     };

From fe90f98515fca46c769a52da1947f10b562edf6b Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Wed, 17 Jun 2020 12:56:41 +0200
Subject: [PATCH 12/42] Add id attribute so click on property label focus in
 input (#8078)

Co-authored-by: Bjarne Fyrstenborg <bf@oerskov-gruppen.lan>
---
 .../src/views/propertyeditors/decimal/decimal.html               | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/decimal/decimal.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/decimal/decimal.html
index d5560c8433..ac2fdabf3d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/decimal/decimal.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/decimal/decimal.html
@@ -7,6 +7,7 @@
                ng-model="model.value"
                ng-required="model.validation.mandatory"
                aria-required="{{model.validation.mandatory}}"
+               id="{{model.alias}}"
                val-server="value"
                fix-number min="{{model.config.min}}" max="{{model.config.max}}" step="{{model.config.step}}" />
 

From 4f70f0e8c56b126e67589105439c186f9c8f6618 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bf@oerskov-gruppen.lan>
Date: Thu, 18 Jun 2020 00:07:26 +0200
Subject: [PATCH 13/42] Use button element for add-button in macro partial view

---
 .../src/views/macros/views/settings.html             | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/macros/views/settings.html b/src/Umbraco.Web.UI.Client/src/views/macros/views/settings.html
index 7706734327..eada93f497 100644
--- a/src/Umbraco.Web.UI.Client/src/views/macros/views/settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/macros/views/settings.html
@@ -21,15 +21,15 @@
                                   on-edit="model.openViewPicker()"
                                   on-remove="model.removeMacroView()">
                 </umb-node-preview>
+
                 <input type="hidden" ng-model="mandatoryViewValidator" ng-required="!model.macro.node" />
 
-                <a href=""
-                   ng-show="!model.macro.node"
-                   class="umb-node-preview-add"
-                   ng-click="model.openViewPicker()"
-                   prevent-default>
+                <button type="button"
+                        class="umb-node-preview-add"
+                        ng-show="!model.macro.node"
+                        ng-click="model.openViewPicker()">
                     <localize key="general_add">Add</localize>
-                </a>
+                </button>
 
             </umb-control-group>
         </umb-box-content>

From 2fd4512d3ae6ecfb4a977d7d480679384169938a Mon Sep 17 00:00:00 2001
From: Richard Thompson <richarth@gmail.com>
Date: Thu, 18 Jun 2020 10:55:01 +0100
Subject: [PATCH 14/42] Spelling correction

Fixed a typo.
---
 .../directives/components/application/umbtour.directive.js      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js
index 6f98dbca6e..92869f39bd 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js
@@ -11,7 +11,7 @@ You can easily add you own tours to the Help-drawer or show and start tours from
 anywhere in the Umbraco backoffice. To see a real world example of a custom tour implementation, install <a href="https://our.umbraco.com/projects/starter-kits/the-starter-kit/">The Starter Kit</a> in Umbraco 7.8
 
 <h1><b>Extending the help drawer with custom tours</b></h1>
-The easiet way to add new tours to Umbraco is through the Help-drawer. All it requires is a my-tour.json file. 
+The easiest way to add new tours to Umbraco is through the Help-drawer. All it requires is a my-tour.json file. 
 Place the file in <i>App_Plugins/{MyPackage}/backoffice/tours/{my-tour}.json</i> and it will automatically be 
 picked up by Umbraco and shown in the Help-drawer.
 

From 378118236345b7d3008935d43319d1be755320fa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 19 Jun 2020 09:41:19 +0200
Subject: [PATCH 15/42] fix of npm run unit, plus begin able to test code that
 uses promises.

---
 src/Umbraco.Web.UI.Client/gulpfile.js               |  4 ++--
 src/Umbraco.Web.UI.Client/package.json              |  6 ++++--
 src/Umbraco.Web.UI.Client/test/config/karma.conf.js | 13 ++++++++++++-
 3 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/gulpfile.js b/src/Umbraco.Web.UI.Client/gulpfile.js
index 542d45c479..d272c77397 100644
--- a/src/Umbraco.Web.UI.Client/gulpfile.js
+++ b/src/Umbraco.Web.UI.Client/gulpfile.js
@@ -31,6 +31,6 @@ exports.build = series(parallel(dependencies, js, less, views), testUnit);
 exports.dev = series(setDevelopmentMode, parallel(dependencies, js, less, views), watchTask);
 exports.watch = series(watchTask);
 // 
-exports.runTests = series(setTestMode, parallel(js, testUnit));
-exports.runUnit = series(setTestMode, parallel(js, runUnitTestServer), watchTask);
+exports.runTests = series(setTestMode, series(js, testUnit));
+exports.runUnit = series(setTestMode, series(js, runUnitTestServer), watchTask);
 exports.testE2e = series(setTestMode, parallel(testE2e));
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index c298f063a7..1b0af95e13 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -2,7 +2,7 @@
   "private": true,
   "scripts": {
     "test": "gulp runTests",
-    "unit": "gulp testUnit",
+    "unit": "gulp runUnit",
     "e2e": "gulp testE2e",
     "build": "gulp build",
     "dev": "gulp dev",
@@ -39,7 +39,7 @@
     "moment": "2.22.2",
     "ng-file-upload": "12.2.13",
     "nouislider": "14.1.1",
-    "npm": "6.13.6",
+    "npm": "^6.14.0",
     "signalr": "2.4.0",
     "spectrum-colorpicker": "1.8.0",
     "tinymce": "4.9.10",
@@ -71,7 +71,9 @@
     "gulp-wrap": "0.15.0",
     "gulp-wrap-js": "0.4.1",
     "jasmine-core": "3.5.0",
+    "jasmine-promise-matchers": "^2.6.0",
     "karma": "4.4.1",
+    "karma-chrome-launcher": "^3.1.0",
     "karma-jasmine": "2.0.1",
     "karma-junit-reporter": "2.0.1",
     "karma-phantomjs-launcher": "1.0.4",
diff --git a/src/Umbraco.Web.UI.Client/test/config/karma.conf.js b/src/Umbraco.Web.UI.Client/test/config/karma.conf.js
index 4e3a78144b..5883f59be8 100644
--- a/src/Umbraco.Web.UI.Client/test/config/karma.conf.js
+++ b/src/Umbraco.Web.UI.Client/test/config/karma.conf.js
@@ -10,6 +10,9 @@ module.exports = function (config) {
         // list of files / patterns to load in the browser
         files: [
 
+            // Jasmine plugins
+            'node_modules/jasmine-promise-matchers/dist/jasmine-promise-matchers.js',
+            
             //libraries
             'node_modules/jquery/dist/jquery.min.js',
             'node_modules/angular/angular.js',
@@ -98,7 +101,14 @@ module.exports = function (config) {
         // - PhantomJS
         // - IE (only Windows)
         // CLI --browsers Chrome,Firefox,Safari
-        browsers: ['PhantomJS'],
+        browsers: ['ChromeHeadless'],
+
+        customLaunchers: {
+            ChromeDebugging: {
+                base: 'Chrome',
+                flags: ['--remote-debugging-port=9333']
+            }
+        },
 
         // allow waiting a bit longer, some machines require this
 
@@ -115,6 +125,7 @@ module.exports = function (config) {
         plugins: [
             require('karma-jasmine'),
             require('karma-phantomjs-launcher'),
+            require('karma-chrome-launcher'),
             require('karma-junit-reporter'),
             require('karma-spec-reporter')
 

From 0886ada39c4651fcd0a8bec5bce4358972791c45 Mon Sep 17 00:00:00 2001
From: Ronald Barendse <ronald@panoramastudios.nl>
Date: Fri, 19 Jun 2020 11:41:16 +0200
Subject: [PATCH 16/42] Properly HTML encode text in helper methods (#6545)

---
 .../PublishedContent/IndexedArrayItem.cs      | 293 +++++++++++++++++-
 src/Umbraco.Web/HtmlHelperRenderExtensions.cs |  77 +++--
 src/Umbraco.Web/HtmlStringUtilities.cs        |  14 +-
 src/Umbraco.Web/Mvc/HtmlTagWrapperTextNode.cs |   2 +-
 src/Umbraco.Web/PublishedContentExtensions.cs | 149 ++++++++-
 5 files changed, 489 insertions(+), 46 deletions(-)

diff --git a/src/Umbraco.Core/Models/PublishedContent/IndexedArrayItem.cs b/src/Umbraco.Core/Models/PublishedContent/IndexedArrayItem.cs
index 5dc42cc542..f7d13fcf90 100644
--- a/src/Umbraco.Core/Models/PublishedContent/IndexedArrayItem.cs
+++ b/src/Umbraco.Core/Models/PublishedContent/IndexedArrayItem.cs
@@ -2,168 +2,441 @@
 
 namespace Umbraco.Core.Models.PublishedContent
 {
+    /// <summary>
+    /// Represents an item in an array that stores its own index and the total count.
+    /// </summary>
+    /// <typeparam name="TContent">The type of the content.</typeparam>
     public class IndexedArrayItem<TContent>
     {
+        /// <summary>
+        /// Initializes a new instance of the <see cref="IndexedArrayItem{TContent}" /> class.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="index">The index.</param>
         public IndexedArrayItem(TContent content, int index)
         {
             Content = content;
             Index = index;
         }
 
+        /// <summary>
+        /// Gets the content.
+        /// </summary>
+        /// <value>
+        /// The content.
+        /// </value>
         public TContent Content { get; }
 
+        /// <summary>
+        /// Gets the index.
+        /// </summary>
+        /// <value>
+        /// The index.
+        /// </value>
         public int Index { get; }
 
+        /// <summary>
+        /// Gets the total count.
+        /// </summary>
+        /// <value>
+        /// The total count.
+        /// </value>
         public int TotalCount { get; internal set; }
 
+        /// <summary>
+        /// Determines whether this item is the first.
+        /// </summary>
+        /// <returns>
+        ///   <c>true</c> if this item is the first; otherwise, <c>false</c>.
+        /// </returns>
         public bool IsFirst()
         {
             return Index == 0;
         }
 
+        /// <summary>
+        /// If this item is the first, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsFirst(string valueIfTrue)
         {
             return IsFirst(valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is the first, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsFirst(string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsFirst() ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsFirst() ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is not the first.
+        /// </summary>
+        /// <returns>
+        ///   <c>true</c> if this item is not the first; otherwise, <c>false</c>.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public bool IsNotFirst()
         {
             return IsFirst() == false;
         }
 
+        /// <summary>
+        /// If this item is not the first, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotFirst(string valueIfTrue)
         {
             return IsNotFirst(valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is not the first, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotFirst(string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsNotFirst() ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsNotFirst() ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is at the specified <paramref name="index" />.
+        /// </summary>
+        /// <param name="index">The index.</param>
+        /// <returns>
+        ///   <c>true</c> if this item is at the specified <paramref name="index" />; otherwise, <c>false</c>.
+        /// </returns>
         public bool IsIndex(int index)
         {
             return Index == index;
         }
 
+        /// <summary>
+        /// If this item is at the specified <paramref name="index" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="index">The index.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsIndex(int index, string valueIfTrue)
         {
             return IsIndex(index, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is at the specified <paramref name="index" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="index">The index.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsIndex(int index, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsIndex(index) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsIndex(index) ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is at an index that can be divided by the specified <paramref name="modulus" />.
+        /// </summary>
+        /// <param name="modulus">The modulus.</param>
+        /// <returns>
+        ///   <c>true</c> if this item is at an index that can be divided by the specified <paramref name="modulus" />; otherwise, <c>false</c>.
+        /// </returns>
         public bool IsModZero(int modulus)
         {
             return Index % modulus == 0;
         }
 
+        /// <summary>
+        /// If this item is at an index that can be divided by the specified <paramref name="modulus" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="modulus">The modulus.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsModZero(int modulus, string valueIfTrue)
         {
             return IsModZero(modulus, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is at an index that can be divided by the specified <paramref name="modulus" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="modulus">The modulus.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsModZero(int modulus, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsModZero(modulus) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsModZero(modulus) ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is not at an index that can be divided by the specified <paramref name="modulus" />.
+        /// </summary>
+        /// <param name="modulus">The modulus.</param>
+        /// <returns>
+        ///   <c>true</c> if this item is not at an index that can be divided by the specified <paramref name="modulus" />; otherwise, <c>false</c>.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public bool IsNotModZero(int modulus)
         {
             return IsModZero(modulus) == false;
         }
 
+        /// <summary>
+        /// If this item is not at an index that can be divided by the specified <paramref name="modulus" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="modulus">The modulus.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotModZero(int modulus, string valueIfTrue)
         {
             return IsNotModZero(modulus, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is not at an index that can be divided by the specified <paramref name="modulus" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="modulus">The modulus.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotModZero(int modulus, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsNotModZero(modulus) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsNotModZero(modulus) ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is not at the specified <paramref name="index" />.
+        /// </summary>
+        /// <param name="index">The index.</param>
+        /// <returns>
+        ///   <c>true</c> if this item is not at the specified <paramref name="index" />; otherwise, <c>false</c>.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public bool IsNotIndex(int index)
         {
             return IsIndex(index) == false;
         }
 
+        /// <summary>
+        /// If this item is not at the specified <paramref name="index" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="index">The index.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotIndex(int index, string valueIfTrue)
         {
             return IsNotIndex(index, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is at the specified <paramref name="index" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="index">The index.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotIndex(int index, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsNotIndex(index) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsNotIndex(index) ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is the last.
+        /// </summary>
+        /// <returns>
+        ///   <c>true</c> if this item is the last; otherwise, <c>false</c>.
+        /// </returns>
         public bool IsLast()
         {
             return Index == TotalCount - 1;
         }
 
+        /// <summary>
+        /// If this item is the last, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsLast(string valueIfTrue)
         {
             return IsLast(valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is the last, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsLast(string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsLast() ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsLast() ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is not the last.
+        /// </summary>
+        /// <returns>
+        ///   <c>true</c> if this item is not the last; otherwise, <c>false</c>.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public bool IsNotLast()
         {
             return IsLast() == false;
         }
 
+        /// <summary>
+        /// If this item is not the last, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotLast(string valueIfTrue)
         {
             return IsNotLast(valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is not the last, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsNotLast(string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsNotLast() ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsNotLast() ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is at an even index.
+        /// </summary>
+        /// <returns>
+        ///   <c>true</c> if this item is at an even index; otherwise, <c>false</c>.
+        /// </returns>
         public bool IsEven()
         {
             return Index % 2 == 0;
         }
 
+        /// <summary>
+        /// If this item is at an even index, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsEven(string valueIfTrue)
         {
             return IsEven(valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is at an even index, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsEven(string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsEven() ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsEven() ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// Determines whether this item is at an odd index.
+        /// </summary>
+        /// <returns>
+        ///   <c>true</c> if this item is at an odd index; otherwise, <c>false</c>.
+        /// </returns>
         public bool IsOdd()
         {
             return Index % 2 == 1;
         }
 
+        /// <summary>
+        /// If this item is at an odd index, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsOdd(string valueIfTrue)
         {
             return IsOdd(valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If this item is at an odd index, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public HtmlString IsOdd(string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(IsOdd() ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(IsOdd() ? valueIfTrue : valueIfFalse));
         }
     }
 }
diff --git a/src/Umbraco.Web/HtmlHelperRenderExtensions.cs b/src/Umbraco.Web/HtmlHelperRenderExtensions.cs
index ebe5e08f89..4b1de86bcf 100644
--- a/src/Umbraco.Web/HtmlHelperRenderExtensions.cs
+++ b/src/Umbraco.Web/HtmlHelperRenderExtensions.cs
@@ -253,12 +253,12 @@ namespace Umbraco.Web
         }
 
         /// <summary>
-        /// Helper method to create a new form to execute in the Umbraco request pipeline against a locally declared controller
+        /// Helper method to create a new form to execute in the Umbraco request pipeline against a locally declared controller.
         /// </summary>
-        /// <param name="html"></param>
-        /// <param name="action"></param>
-        /// <param name="controllerName"></param>
-        /// <param name="method"></param>
+        /// <param name="html">The HTML helper.</param>
+        /// <param name="action">Name of the action.</param>
+        /// <param name="controllerName">Name of the controller.</param>
+        /// <param name="method">The method.</param>
         /// <returns></returns>
         public static MvcForm BeginUmbracoForm(this HtmlHelper html, string action, string controllerName, FormMethod method)
         {
@@ -315,9 +315,9 @@ namespace Umbraco.Web
         /// <param name="method"></param>
         /// <returns></returns>
         public static MvcForm BeginUmbracoForm(this HtmlHelper html, string action, string controllerName,
-                                               object additionalRouteVals,
-                                               object htmlAttributes,
-                                               FormMethod method)
+            object additionalRouteVals,
+            object htmlAttributes,
+            FormMethod method)
         {
             return html.BeginUmbracoForm(action, controllerName, additionalRouteVals, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes), method);
         }
@@ -332,8 +332,8 @@ namespace Umbraco.Web
         /// <param name="htmlAttributes"></param>
         /// <returns></returns>
         public static MvcForm BeginUmbracoForm(this HtmlHelper html, string action, string controllerName,
-                                               object additionalRouteVals,
-                                               object htmlAttributes)
+            object additionalRouteVals,
+            object htmlAttributes)
         {
             return html.BeginUmbracoForm(action, controllerName, additionalRouteVals, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
         }
@@ -349,9 +349,9 @@ namespace Umbraco.Web
         /// <param name="method"></param>
         /// <returns></returns>
         public static MvcForm BeginUmbracoForm(this HtmlHelper html, string action, string controllerName,
-                                               object additionalRouteVals,
-                                               IDictionary<string, object> htmlAttributes,
-                                               FormMethod method)
+            object additionalRouteVals,
+            IDictionary<string, object> htmlAttributes,
+            FormMethod method)
         {
             if (action == null) throw new ArgumentNullException(nameof(action));
             if (string.IsNullOrWhiteSpace(action)) throw new ArgumentException("Value can't be empty or consist only of white-space characters.", nameof(action));
@@ -371,8 +371,8 @@ namespace Umbraco.Web
         /// <param name="htmlAttributes"></param>
         /// <returns></returns>
         public static MvcForm BeginUmbracoForm(this HtmlHelper html, string action, string controllerName,
-                                               object additionalRouteVals,
-                                               IDictionary<string, object> htmlAttributes)
+            object additionalRouteVals,
+            IDictionary<string, object> htmlAttributes)
         {
             if (action == null) throw new ArgumentNullException(nameof(action));
             if (string.IsNullOrWhiteSpace(action)) throw new ArgumentException("Value can't be empty or consist only of white-space characters.", nameof(action));
@@ -840,19 +840,32 @@ namespace Umbraco.Web
         #region If
 
         /// <summary>
-        /// If the test is true, the string valueIfTrue will be returned, otherwise the valueIfFalse will be returned.
+        /// If <paramref name="test" /> is <c>true</c>, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
         /// </summary>
-        public static IHtmlString If(this HtmlHelper html, bool test, string valueIfTrue, string valueIfFalse)
+        /// <param name="html">The HTML helper.</param>
+        /// <param name="test">If set to <c>true</c> returns <paramref name="valueIfTrue" />; otherwise, <see cref="string.Empty" />.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        public static IHtmlString If(this HtmlHelper html, bool test, string valueIfTrue)
         {
-            return test ? new HtmlString(valueIfTrue) : new HtmlString(valueIfFalse);
+            return If(html, test, valueIfTrue, string.Empty);
         }
 
         /// <summary>
-        /// If the test is true, the string valueIfTrue will be returned, otherwise the valueIfFalse will be returned.
+        /// If <paramref name="test" /> is <c>true</c>, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
         /// </summary>
-        public static IHtmlString If(this HtmlHelper html, bool test, string valueIfTrue)
+        /// <param name="html">The HTML helper.</param>
+        /// <param name="test">If set to <c>true</c> returns <paramref name="valueIfTrue" />; otherwise, <paramref name="valueIfFalse" />.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        public static IHtmlString If(this HtmlHelper html, bool test, string valueIfTrue, string valueIfFalse)
         {
-            return test ? new HtmlString(valueIfTrue) : new HtmlString(string.Empty);
+            return new HtmlString(HttpUtility.HtmlEncode(test ? valueIfTrue : valueIfFalse));
         }
 
         #endregion
@@ -862,16 +875,32 @@ namespace Umbraco.Web
         private static readonly HtmlStringUtilities StringUtilities = new HtmlStringUtilities();
 
         /// <summary>
-        /// Replaces text line breaks with HTML line breaks
+        /// Replaces text line breaks with HTML line breaks.
         /// </summary>
-        /// <param name="helper"></param>
+        /// <param name="helper">The HTML helper.</param>
         /// <param name="text">The text.</param>
-        /// <returns>The text with text line breaks replaced with HTML line breaks (<br/>)</returns>
+        /// <returns>
+        /// The text with text line breaks replaced with HTML line breaks (<c>&lt;br /&gt;</c>).
+        /// </returns>
+        [Obsolete("This method doesn't HTML encode the text. Use ReplaceLineBreaks instead.")]
         public static IHtmlString ReplaceLineBreaksForHtml(this HtmlHelper helper, string text)
         {
             return StringUtilities.ReplaceLineBreaksForHtml(text);
         }
 
+        /// <summary>
+        /// HTML encodes the text and replaces text line breaks with HTML line breaks.
+        /// </summary>
+        /// <param name="helper">The HTML helper.</param>
+        /// <param name="text">The text.</param>
+        /// <returns>
+        /// The HTML encoded text with text line breaks replaced with HTML line breaks (<c>&lt;br /&gt;</c>).
+        /// </returns>
+        public static IHtmlString ReplaceLineBreaks(this HtmlHelper helper, string text)
+        {
+            return StringUtilities.ReplaceLineBreaks(text);
+        }
+
         /// <summary>
         /// Generates a hash based on the text string passed in.  This method will detect the
         /// security requirements (is FIPS enabled) and return an appropriate hash.
diff --git a/src/Umbraco.Web/HtmlStringUtilities.cs b/src/Umbraco.Web/HtmlStringUtilities.cs
index a8cbb70019..7df3e69bcb 100644
--- a/src/Umbraco.Web/HtmlStringUtilities.cs
+++ b/src/Umbraco.Web/HtmlStringUtilities.cs
@@ -16,21 +16,25 @@ namespace Umbraco.Web
     public sealed class HtmlStringUtilities
     {
         /// <summary>
-        /// Replaces text line breaks with HTML line breaks
+        /// Replaces text line breaks with HTML line breaks.
         /// </summary>
         /// <param name="text">The text.</param>
-        /// <returns>The text with text line breaks replaced with HTML line breaks (<c>&lt;br /&gt;</c>).
+        /// <returns>
+        /// The text with text line breaks replaced with HTML line breaks (<c>&lt;br /&gt;</c>).
+        /// </returns>
         [Obsolete("This method doesn't HTML encode the text. Use ReplaceLineBreaks instead.")]
         public HtmlString ReplaceLineBreaksForHtml(string text)
         {
-            return new HtmlString(text.Replace("\r\n", @"<br />").Replace("\n", @"<br />").Replace("\r", @"<br />"));            
+            return new HtmlString(text.Replace("\r\n", @"<br />").Replace("\n", @"<br />").Replace("\r", @"<br />"));
         }
-        
+
         /// <summary>
         /// HTML encodes the text and replaces text line breaks with HTML line breaks.
         /// </summary>
         /// <param name="text">The text.</param>
-        /// <returns>The HTML encoded text with text line breaks replaced with HTML line breaks (<c>&lt;br /&gt;</c>).</returns>
+        /// <returns>
+        /// The HTML encoded text with text line breaks replaced with HTML line breaks (<c>&lt;br /&gt;</c>).
+        /// </returns>
         public IHtmlString ReplaceLineBreaks(string text)
         {
             var value = HttpUtility.HtmlEncode(text)?
diff --git a/src/Umbraco.Web/Mvc/HtmlTagWrapperTextNode.cs b/src/Umbraco.Web/Mvc/HtmlTagWrapperTextNode.cs
index 43bfedde86..1085c2a279 100644
--- a/src/Umbraco.Web/Mvc/HtmlTagWrapperTextNode.cs
+++ b/src/Umbraco.Web/Mvc/HtmlTagWrapperTextNode.cs
@@ -12,7 +12,7 @@ namespace Umbraco.Web.Mvc
 
         public void WriteToHtmlTextWriter(System.Web.UI.HtmlTextWriter html)
         {
-            html.Write(Content);
+            html.WriteEncodedText(Content);
         }
     }
 }
diff --git a/src/Umbraco.Web/PublishedContentExtensions.cs b/src/Umbraco.Web/PublishedContentExtensions.cs
index 750ffa4be6..73148b667a 100644
--- a/src/Umbraco.Web/PublishedContentExtensions.cs
+++ b/src/Umbraco.Web/PublishedContentExtensions.cs
@@ -287,29 +287,82 @@ namespace Umbraco.Web
             return content.Id == other.Id;
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is equal to <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsEqual(this IPublishedContent content, IPublishedContent other, string valueIfTrue)
         {
             return content.IsEqual(other, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is equal to <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsEqual(this IPublishedContent content, IPublishedContent other, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(content.IsEqual(other) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(content.IsEqual(other) ? valueIfTrue : valueIfFalse));
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is not equal to <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static bool IsNotEqual(this IPublishedContent content, IPublishedContent other)
         {
             return content.IsEqual(other) == false;
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is not equal to <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsNotEqual(this IPublishedContent content, IPublishedContent other, string valueIfTrue)
         {
             return content.IsNotEqual(other, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is not equal to <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsNotEqual(this IPublishedContent content, IPublishedContent other, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(content.IsNotEqual(other) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(content.IsNotEqual(other) ? valueIfTrue : valueIfFalse));
         }
 
         #endregion
@@ -321,14 +374,35 @@ namespace Umbraco.Web
             return other.Level < content.Level && content.Path.InvariantStartsWith(other.Path.EnsureEndsWith(','));
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is a decendant of <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsDescendant(this IPublishedContent content, IPublishedContent other, string valueIfTrue)
         {
             return content.IsDescendant(other, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is a decendant of <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsDescendant(this IPublishedContent content, IPublishedContent other, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(content.IsDescendant(other) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(content.IsDescendant(other) ? valueIfTrue : valueIfFalse));
         }
 
         public static bool IsDescendantOrSelf(this IPublishedContent content, IPublishedContent other)
@@ -336,14 +410,35 @@ namespace Umbraco.Web
             return content.Path.InvariantEquals(other.Path) || content.IsDescendant(other);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is a decendant of <paramref name="other" /> or are the same, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsDescendantOrSelf(this IPublishedContent content, IPublishedContent other, string valueIfTrue)
         {
             return content.IsDescendantOrSelf(other, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is a decendant of <paramref name="other" /> or are the same, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsDescendantOrSelf(this IPublishedContent content, IPublishedContent other, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(content.IsDescendantOrSelf(other) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(content.IsDescendantOrSelf(other) ? valueIfTrue : valueIfFalse));
         }
 
         public static bool IsAncestor(this IPublishedContent content, IPublishedContent other)
@@ -351,14 +446,35 @@ namespace Umbraco.Web
             return content.Level < other.Level && other.Path.InvariantStartsWith(content.Path.EnsureEndsWith(','));
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is an ancestor of <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsAncestor(this IPublishedContent content, IPublishedContent other, string valueIfTrue)
         {
             return content.IsAncestor(other, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is an ancestor of <paramref name="other" />, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsAncestor(this IPublishedContent content, IPublishedContent other, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(content.IsAncestor(other) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(content.IsAncestor(other) ? valueIfTrue : valueIfFalse));
         }
 
         public static bool IsAncestorOrSelf(this IPublishedContent content, IPublishedContent other)
@@ -366,14 +482,35 @@ namespace Umbraco.Web
             return other.Path.InvariantEquals(content.Path) || content.IsAncestor(other);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is an ancestor of <paramref name="other" /> or are the same, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <see cref="string.Empty" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsAncestorOrSelf(this IPublishedContent content, IPublishedContent other, string valueIfTrue)
         {
             return content.IsAncestorOrSelf(other, valueIfTrue, string.Empty);
         }
 
+        /// <summary>
+        /// If the specified <paramref name="content" /> is an ancestor of <paramref name="other" /> or are the same, the HTML encoded <paramref name="valueIfTrue" /> will be returned; otherwise, <paramref name="valueIfFalse" />.
+        /// </summary>
+        /// <param name="content">The content.</param>
+        /// <param name="other">The other content.</param>
+        /// <param name="valueIfTrue">The value if <c>true</c>.</param>
+        /// <param name="valueIfFalse">The value if <c>false</c>.</param>
+        /// <returns>
+        /// The HTML encoded value.
+        /// </returns>
+        // TODO: This method should be removed or moved to an extension method on HtmlHelper.
         public static HtmlString IsAncestorOrSelf(this IPublishedContent content, IPublishedContent other, string valueIfTrue, string valueIfFalse)
         {
-            return new HtmlString(content.IsAncestorOrSelf(other) ? valueIfTrue : valueIfFalse);
+            return new HtmlString(HttpUtility.HtmlEncode(content.IsAncestorOrSelf(other) ? valueIfTrue : valueIfFalse));
         }
 
         #endregion

From 591575b47de87ce64c963ac85066ed6572660171 Mon Sep 17 00:00:00 2001
From: patrickdemooij9 <patrickdemooij98@hotmail.com>
Date: Fri, 19 Jun 2020 19:10:16 +0200
Subject: [PATCH 17/42] Added content apps for document types (#8187)

* Added content apps for document types

* PR Feedback updates

* Updated the javascript code to use Utilities

* Replace tolowercase comparison with localeCompare
---
 .../Manifest/ManifestContentAppFactory.cs     |  4 +
 .../views/documenttypes/edit.controller.js    | 79 ++++++-------------
 .../ContentEditorContentAppFactory.cs         |  8 +-
 .../ContentInfoContentAppFactory.cs           |  2 +-
 .../ContentTypeDesignContentAppFactory.cs     | 33 ++++++++
 .../ContentTypeListViewContentAppFactory.cs   | 33 ++++++++
 ...ContentTypePermissionsContentAppFactory.cs | 33 ++++++++
 .../ContentTypeTemplatesContentAppFactory.cs  | 33 ++++++++
 .../ContentApps/ListViewContentAppFactory.cs  |  4 +-
 .../ContentEditing/DocumentTypeDisplay.cs     |  4 +
 .../Models/Mapping/CommonMapper.cs            |  3 +-
 .../Mapping/ContentTypeMapDefinition.cs       |  5 +-
 src/Umbraco.Web/Runtime/WebInitialComposer.cs |  6 +-
 src/Umbraco.Web/Umbraco.Web.csproj            |  4 +
 14 files changed, 182 insertions(+), 69 deletions(-)
 create mode 100644 src/Umbraco.Web/ContentApps/ContentTypeDesignContentAppFactory.cs
 create mode 100644 src/Umbraco.Web/ContentApps/ContentTypeListViewContentAppFactory.cs
 create mode 100644 src/Umbraco.Web/ContentApps/ContentTypePermissionsContentAppFactory.cs
 create mode 100644 src/Umbraco.Web/ContentApps/ContentTypeTemplatesContentAppFactory.cs

diff --git a/src/Umbraco.Core/Manifest/ManifestContentAppFactory.cs b/src/Umbraco.Core/Manifest/ManifestContentAppFactory.cs
index 788310d7a1..e0b63d1069 100644
--- a/src/Umbraco.Core/Manifest/ManifestContentAppFactory.cs
+++ b/src/Umbraco.Core/Manifest/ManifestContentAppFactory.cs
@@ -62,6 +62,10 @@ namespace Umbraco.Core.Manifest
                     partA = "member";
                     partB = member.ContentType.Alias;
                     break;
+                case IContentType contentType:
+                    partA = "contentType";
+                    partB = contentType.Alias;
+                    break;
 
                 default:
                     return null;
diff --git a/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.controller.js b/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.controller.js
index 42dba5f580..ad042842f5 100644
--- a/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.controller.js
@@ -38,7 +38,7 @@
         vm.page.loading = false;
         vm.page.saveButtonState = "init";
         vm.page.navigation = [];
-     
+
         var labelKeys = [
             "general_design",
             "general_listView",
@@ -92,33 +92,6 @@
             vm.labels.addTemplate = values[13];
             vm.labels.allowCultureVariants = values[14];
 
-            var buttons = [
-                {
-                    "name": vm.labels.design,
-                    "alias": "design",
-                    "icon": "icon-document-dashed-line",
-                    "view": "views/documenttypes/views/design/design.html"
-                },
-                {
-                    "name": vm.labels.listview,
-                    "alias": "listView",
-                    "icon": "icon-list",
-                    "view": "views/documenttypes/views/listview/listview.html"
-                },
-                {
-                    "name": vm.labels.permissions,
-                    "alias": "permissions",
-                    "icon": "icon-keychain",
-                    "view": "views/documenttypes/views/permissions/permissions.html"
-                },
-                {
-                    "name": vm.labels.templates,
-                    "alias": "templates",
-                    "icon": "icon-layout",
-                    "view": "views/documenttypes/views/templates/templates.html"
-                }
-            ];
-
             vm.page.keyboardShortcutsOverview = [
                 {
                     "name": vm.labels.sections,
@@ -187,9 +160,6 @@
                     ]
                 }
             ];
-
-            loadButtons(buttons);
-
         });
 
         contentTypeHelper.checkModelsBuilderStatus().then(function (result) {
@@ -279,25 +249,25 @@
             contentTypeResource.getById(documentTypeId).then(function (dt) {
                 init(dt);
                 // we don't need to sync the tree in infinite mode
-                if(!infiniteMode) { 
+                if (!infiniteMode) {
                     syncTreeNode(vm.contentType, dt.path, true);
                 }
                 vm.page.loading = false;
             });
         }
 
-        function loadButtons(buttons) {
+        function loadButtons() {
+            vm.page.navigation = vm.contentType.apps;
 
-            angular.forEach(buttons,
-                function (val, index) {
+            if (disableTemplates === true) {
+                Utilities.forEach(vm.contentType.apps,
+                    (app, index) => {
+                        if (app.alias === "templates") {
+                            vm.page.navigation.splice(index, 1);
+                        }
+                    });
+            }
 
-                    if (disableTemplates === true && val.alias === "templates") {
-                        buttons.splice(index, 1);
-                    }
-
-                });
-
-            vm.page.navigation = buttons;
             initializeActiveNavigationPanel();
         }
 
@@ -307,16 +277,14 @@
             var initialViewSetFromRouteParams = false;
             var view = $routeParams.view;
             if (view) {
-                var viewPath = "views/documenttypes/views/" + view + "/" + view + ".html";
                 for (var i = 0; i < vm.page.navigation.length; i++) {
-                    if (vm.page.navigation[i].view === viewPath) {
+                    if (vm.page.navigation[i].alias.localeCompare(view, undefined, { sensitivity: 'accent' }) === 0) {
                         vm.page.navigation[i].active = true;
                         initialViewSetFromRouteParams = true;
                         break;
                     }
                 }
             }
-
             if (initialViewSetFromRouteParams === false) {
                 vm.page.navigation[0].active = true;
             }
@@ -379,17 +347,17 @@
                 }).then(function (data) {
                     //success
                     // we don't need to sync the tree in infinite mode
-                    if(!infiniteMode) {
+                    if (!infiniteMode) {
                         syncTreeNode(vm.contentType, data.path);
                     }
 
                     // emit event
                     var args = { documentType: vm.contentType };
                     eventsService.emit("editors.documentType.saved", args);
-                    
+
                     vm.page.saveButtonState = "success";
 
-                    if(infiniteMode && $scope.model.submit) {
+                    if (infiniteMode && $scope.model.submit) {
                         $scope.model.documentTypeAlias = vm.contentType.alias;
                         $scope.model.submit($scope.model);
                     }
@@ -446,10 +414,12 @@
             // convert icons for content type
             convertLegacyIcons(contentType);
 
-            //set a shared state
-            editorState.set(contentType);
-
             vm.contentType = contentType;
+
+            //set a shared state
+            editorState.set(vm.contentType);
+
+            loadButtons();
         }
 
         /** Syncs the template alias for new doc types before saving if a template is to be created */
@@ -525,11 +495,10 @@
                     if (treeExists) {
                         navigationService.syncTree({ tree: "templates", path: [], forceReload: true })
                             .then(function (syncArgs) {
-                                navigationService.reloadNode(syncArgs.node)
-                            }
-                        );
+                                navigationService.reloadNode(syncArgs.node);
+                            });
                     }
-                }); 
+                });
             }
         }));
 
diff --git a/src/Umbraco.Web/ContentApps/ContentEditorContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ContentEditorContentAppFactory.cs
index add7e2f16a..9f6924cd54 100644
--- a/src/Umbraco.Web/ContentApps/ContentEditorContentAppFactory.cs
+++ b/src/Umbraco.Web/ContentApps/ContentEditorContentAppFactory.cs
@@ -30,9 +30,6 @@ namespace Umbraco.Web.ContentApps
                         Weight = Weight
                     });
 
-                case IContent _:
-                    return null;
-
                 case IMedia media when !media.ContentType.IsContainer || media.Properties.Count > 0:
                     return _mediaApp ?? (_mediaApp = new ContentApp
                     {
@@ -43,9 +40,6 @@ namespace Umbraco.Web.ContentApps
                         Weight = Weight
                     });
 
-                case IMedia _:
-                    return null;
-
                 case IMember _:
                     return _memberApp ?? (_memberApp = new ContentApp
                     {
@@ -57,7 +51,7 @@ namespace Umbraco.Web.ContentApps
                     });
 
                 default:
-                    throw new NotSupportedException($"Object type {o.GetType()} is not supported here.");
+                    return null;
             }
         }
     }
diff --git a/src/Umbraco.Web/ContentApps/ContentInfoContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ContentInfoContentAppFactory.cs
index fac03c43d0..abad7f4bf8 100644
--- a/src/Umbraco.Web/ContentApps/ContentInfoContentAppFactory.cs
+++ b/src/Umbraco.Web/ContentApps/ContentInfoContentAppFactory.cs
@@ -49,7 +49,7 @@ namespace Umbraco.Web.ContentApps
                     });
 
                 default:
-                    throw new NotSupportedException($"Object type {o.GetType()} is not supported here.");
+                    return null;
             }
         }
     }
diff --git a/src/Umbraco.Web/ContentApps/ContentTypeDesignContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ContentTypeDesignContentAppFactory.cs
new file mode 100644
index 0000000000..1aa0770aeb
--- /dev/null
+++ b/src/Umbraco.Web/ContentApps/ContentTypeDesignContentAppFactory.cs
@@ -0,0 +1,33 @@
+using System;
+using System.Collections.Generic;
+using Umbraco.Core.Models;
+using Umbraco.Core.Models.ContentEditing;
+using Umbraco.Core.Models.Membership;
+
+namespace Umbraco.Web.ContentApps
+{
+    internal class ContentTypeDesignContentAppFactory : IContentAppFactory
+    {
+        private const int Weight = -200;
+
+        private ContentApp _contentTypeApp;
+
+        public ContentApp GetContentAppFor(object source, IEnumerable<IReadOnlyUserGroup> userGroups)
+        {
+            switch (source)
+            {
+                case IContentType _:
+                    return _contentTypeApp ?? (_contentTypeApp = new ContentApp()
+                    {
+                        Alias = "design",
+                        Name = "Design",
+                        Icon = "icon-document-dashed-line",
+                        View = "views/documenttypes/views/design/design.html",
+                        Weight = Weight
+                    });
+                default:
+                    return null;
+            }
+        }
+    }
+}
diff --git a/src/Umbraco.Web/ContentApps/ContentTypeListViewContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ContentTypeListViewContentAppFactory.cs
new file mode 100644
index 0000000000..3b618c64f7
--- /dev/null
+++ b/src/Umbraco.Web/ContentApps/ContentTypeListViewContentAppFactory.cs
@@ -0,0 +1,33 @@
+using System;
+using System.Collections.Generic;
+using Umbraco.Core.Models;
+using Umbraco.Core.Models.ContentEditing;
+using Umbraco.Core.Models.Membership;
+
+namespace Umbraco.Web.ContentApps
+{
+    internal class ContentTypeListViewContentAppFactory : IContentAppFactory
+    {
+        private const int Weight = -180;
+
+        private ContentApp _contentTypeApp;
+
+        public ContentApp GetContentAppFor(object source, IEnumerable<IReadOnlyUserGroup> userGroups)
+        {
+            switch (source)
+            {
+                case IContentType _:
+                    return _contentTypeApp ?? (_contentTypeApp = new ContentApp()
+                    {
+                        Alias = "listView",
+                        Name = "List view",
+                        Icon = "icon-list",
+                        View = "views/documenttypes/views/listview/listview.html",
+                        Weight = Weight
+                    });
+                default:
+                    return null;
+            }
+        }
+    }
+}
diff --git a/src/Umbraco.Web/ContentApps/ContentTypePermissionsContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ContentTypePermissionsContentAppFactory.cs
new file mode 100644
index 0000000000..0b07515068
--- /dev/null
+++ b/src/Umbraco.Web/ContentApps/ContentTypePermissionsContentAppFactory.cs
@@ -0,0 +1,33 @@
+using System;
+using System.Collections.Generic;
+using Umbraco.Core.Models;
+using Umbraco.Core.Models.ContentEditing;
+using Umbraco.Core.Models.Membership;
+
+namespace Umbraco.Web.ContentApps
+{
+    internal class ContentTypePermissionsContentAppFactory : IContentAppFactory
+    {
+        private const int Weight = -160;
+
+        private ContentApp _contentTypeApp;
+
+        public ContentApp GetContentAppFor(object source, IEnumerable<IReadOnlyUserGroup> userGroups)
+        {
+            switch (source)
+            {
+                case IContentType _:
+                    return _contentTypeApp ?? (_contentTypeApp = new ContentApp()
+                    {
+                        Alias = "permissions",
+                        Name = "Permissions",
+                        Icon = "icon-keychain",
+                        View = "views/documenttypes/views/permissions/permissions.html",
+                        Weight = Weight
+                    });
+                default:
+                    return null;
+            }
+        }
+    }
+}
diff --git a/src/Umbraco.Web/ContentApps/ContentTypeTemplatesContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ContentTypeTemplatesContentAppFactory.cs
new file mode 100644
index 0000000000..0b656518d8
--- /dev/null
+++ b/src/Umbraco.Web/ContentApps/ContentTypeTemplatesContentAppFactory.cs
@@ -0,0 +1,33 @@
+using System;
+using System.Collections.Generic;
+using Umbraco.Core.Models;
+using Umbraco.Core.Models.ContentEditing;
+using Umbraco.Core.Models.Membership;
+
+namespace Umbraco.Web.ContentApps
+{
+    internal class ContentTypeTemplatesContentAppFactory : IContentAppFactory
+    {
+        private const int Weight = -140;
+
+        private ContentApp _contentTypeApp;
+
+        public ContentApp GetContentAppFor(object source, IEnumerable<IReadOnlyUserGroup> userGroups)
+        {
+            switch (source)
+            {
+                case IContentType _:
+                    return _contentTypeApp ?? (_contentTypeApp = new ContentApp()
+                    {
+                        Alias = "templates",
+                        Name = "Templates",
+                        Icon = "icon-layout",
+                        View = "views/documenttypes/views/templates/templates.html",
+                        Weight = Weight
+                    });
+                default:
+                    return null;
+            }
+        }
+    }
+}
diff --git a/src/Umbraco.Web/ContentApps/ListViewContentAppFactory.cs b/src/Umbraco.Web/ContentApps/ListViewContentAppFactory.cs
index bf6184197f..7d9ab43ac9 100644
--- a/src/Umbraco.Web/ContentApps/ListViewContentAppFactory.cs
+++ b/src/Umbraco.Web/ContentApps/ListViewContentAppFactory.cs
@@ -45,10 +45,8 @@ namespace Umbraco.Web.ContentApps
                     entityType = "media";
                     dtdId = Core.Constants.DataTypes.DefaultMediaListView;
                     break;
-                case IMember member:
-                    return null;
                 default:
-                    throw new NotSupportedException($"Object type {o.GetType()} is not supported here.");
+                    return null;
             }
 
             return CreateContentApp(_dataTypeService, _propertyEditors, entityType, contentTypeAlias, dtdId);
diff --git a/src/Umbraco.Web/Models/ContentEditing/DocumentTypeDisplay.cs b/src/Umbraco.Web/Models/ContentEditing/DocumentTypeDisplay.cs
index 9467033aec..8aaa5c8af1 100644
--- a/src/Umbraco.Web/Models/ContentEditing/DocumentTypeDisplay.cs
+++ b/src/Umbraco.Web/Models/ContentEditing/DocumentTypeDisplay.cs
@@ -1,5 +1,6 @@
 using System.Collections.Generic;
 using System.Runtime.Serialization;
+using Umbraco.Core.Models.ContentEditing;
 
 namespace Umbraco.Web.Models.ContentEditing
 {
@@ -27,5 +28,8 @@ namespace Umbraco.Web.Models.ContentEditing
         [DataMember(Name = "allowSegmentVariant")]
         public bool AllowSegmentVariant { get; set; }
 
+        [DataMember(Name = "apps")]
+        public IEnumerable<ContentApp> ContentApps { get; set; }
+
     }
 }
diff --git a/src/Umbraco.Web/Models/Mapping/CommonMapper.cs b/src/Umbraco.Web/Models/Mapping/CommonMapper.cs
index 7bf4a94b1c..1276a2a405 100644
--- a/src/Umbraco.Web/Models/Mapping/CommonMapper.cs
+++ b/src/Umbraco.Web/Models/Mapping/CommonMapper.cs
@@ -7,6 +7,7 @@ using Umbraco.Core;
 using Umbraco.Core.Mapping;
 using Umbraco.Core.Models;
 using Umbraco.Core.Models.ContentEditing;
+using Umbraco.Core.Models.Entities;
 using Umbraco.Core.Models.Membership;
 using Umbraco.Core.Services;
 using Umbraco.Web.ContentApps;
@@ -81,7 +82,7 @@ namespace Umbraco.Web.Models.Mapping
             return urlHelper.GetUmbracoApiService<MemberTreeController>(controller => controller.GetTreeNode(source.Key.ToString("N"), null));
         }
 
-        public IEnumerable<ContentApp> GetContentApps(IContentBase source)
+        public IEnumerable<ContentApp> GetContentApps(IUmbracoEntity source)
         {
             var apps = _contentAppDefinitions.GetContentAppsFor(source).ToArray();
 
diff --git a/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs b/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
index c767e9aaf3..35b844ce95 100644
--- a/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
+++ b/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
@@ -17,6 +17,7 @@ namespace Umbraco.Web.Models.Mapping
     /// </summary>
     internal class ContentTypeMapDefinition : IMapDefinition
     {
+        private readonly CommonMapper _commonMapper;
         private readonly PropertyEditorCollection _propertyEditors;
         private readonly IDataTypeService _dataTypeService;
         private readonly IFileService _fileService;
@@ -25,10 +26,11 @@ namespace Umbraco.Web.Models.Mapping
         private readonly IMemberTypeService _memberTypeService;
         private readonly ILogger _logger;
 
-        public ContentTypeMapDefinition(PropertyEditorCollection propertyEditors, IDataTypeService dataTypeService, IFileService fileService,
+        public ContentTypeMapDefinition(CommonMapper commonMapper, PropertyEditorCollection propertyEditors, IDataTypeService dataTypeService, IFileService fileService,
             IContentTypeService contentTypeService, IMediaTypeService mediaTypeService, IMemberTypeService memberTypeService,
             ILogger logger)
         {
+            _commonMapper = commonMapper;
             _propertyEditors = propertyEditors;
             _dataTypeService = dataTypeService;
             _fileService = fileService;
@@ -122,6 +124,7 @@ namespace Umbraco.Web.Models.Mapping
 
             target.AllowCultureVariant = source.VariesByCulture();
             target.AllowSegmentVariant = source.VariesBySegment();
+            target.ContentApps = _commonMapper.GetContentApps(source);
 
             //sync templates
             target.AllowedTemplates = context.MapEnumerable<ITemplate, EntityBasic>(source.AllowedTemplates);
diff --git a/src/Umbraco.Web/Runtime/WebInitialComposer.cs b/src/Umbraco.Web/Runtime/WebInitialComposer.cs
index c631aac5e3..60521e6d90 100644
--- a/src/Umbraco.Web/Runtime/WebInitialComposer.cs
+++ b/src/Umbraco.Web/Runtime/WebInitialComposer.cs
@@ -238,7 +238,11 @@ namespace Umbraco.Web.Runtime
             composition.ContentApps()
                 .Append<ListViewContentAppFactory>()
                 .Append<ContentEditorContentAppFactory>()
-                .Append<ContentInfoContentAppFactory>();
+                .Append<ContentInfoContentAppFactory>()
+                .Append<ContentTypeDesignContentAppFactory>()
+                .Append<ContentTypeListViewContentAppFactory>()
+                .Append<ContentTypePermissionsContentAppFactory>()
+                .Append<ContentTypeTemplatesContentAppFactory>();
 
             // register back office sections in the order we want them rendered
             composition.Sections()
diff --git a/src/Umbraco.Web/Umbraco.Web.csproj b/src/Umbraco.Web/Umbraco.Web.csproj
index c06ec574c5..b1cbff0fef 100755
--- a/src/Umbraco.Web/Umbraco.Web.csproj
+++ b/src/Umbraco.Web/Umbraco.Web.csproj
@@ -135,6 +135,10 @@
     <Compile Include="Composing\CompositionExtensions\Installer.cs" />
     <Compile Include="Composing\LightInject\LightInjectContainer.cs" />
     <Compile Include="Compose\BackOfficeUserAuditEventsComponent.cs" />
+    <Compile Include="ContentApps\ContentTypeTemplatesContentAppFactory.cs" />
+    <Compile Include="ContentApps\ContentTypePermissionsContentAppFactory.cs" />
+    <Compile Include="ContentApps\ContentTypeListViewContentAppFactory.cs" />
+    <Compile Include="ContentApps\ContentTypeDesignContentAppFactory.cs" />
     <Compile Include="ContentApps\ListViewContentAppFactory.cs" />
     <Compile Include="Dashboards\ContentDashboard.cs" />
     <Compile Include="Dashboards\DashboardCollection.cs" />

From 7210cf45d2d410478aa1a174738e3d8f04dbb052 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 23 Jun 2020 11:08:19 +0200
Subject: [PATCH 18/42] Bump angular from 1.7.9 to 1.8.0 in
 /src/Umbraco.Web.UI.Client (#8312)

Bumps [angular](https://github.com/angular/angular.js) from 1.7.9 to 1.8.0.
- [Release notes](https://github.com/angular/angular.js/releases)
- [Changelog](https://github.com/angular/angular.js/blob/master/CHANGELOG.md)
- [Commits](https://github.com/angular/angular.js/compare/v1.7.9...v1.8.0)

Signed-off-by: dependabot[bot] <support@github.com>

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 src/Umbraco.Web.UI.Client/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index c298f063a7..95e91e61fa 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -11,7 +11,7 @@
   },
   "dependencies": {
     "ace-builds": "1.4.2",
-    "angular": "1.7.9",
+    "angular": "1.8.0",
     "angular-animate": "1.7.5",
     "angular-aria": "1.7.9",
     "angular-chart.js": "^1.1.1",

From 5cb56042249ea825449f60f9200a2c5ae4ec5b26 Mon Sep 17 00:00:00 2001
From: Sebastiaan Janssen <sebastiaan@umbraco.com>
Date: Tue, 23 Jun 2020 11:55:54 +0200
Subject: [PATCH 19/42] Update to the latest jQuery

---
 src/Umbraco.Web.UI.Client/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 95e91e61fa..167bf53eb8 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -32,7 +32,7 @@
     "diff": "3.5.0",
     "flatpickr": "4.5.2",
     "font-awesome": "4.7.0",
-    "jquery": "^3.4.1",
+    "jquery": "^3.5.1",
     "jquery-ui-dist": "1.12.1",
     "jquery-ui-touch-punch": "0.2.3",
     "lazyload-js": "1.0.0",

From 611e7d3f6961b4d86573aa40b3721f754d5b6436 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Tue, 23 Jun 2020 13:17:56 +0200
Subject: [PATCH 20/42] Media picker folder create loader (#8306)

* Format document

* Use umb-loader component instead since this wrap the loader so it doesn't cause overflow on animation

Co-authored-by: Bjarne Fyrstenborg <bf@oerskov-gruppen.lan>
---
 .../mediapicker/mediapicker.html              | 26 ++++++++-----------
 1 file changed, 11 insertions(+), 15 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediapicker/mediapicker.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediapicker/mediapicker.html
index e1a89061b6..51cbf0269a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediapicker/mediapicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediapicker/mediapicker.html
@@ -20,15 +20,14 @@
                         <div class="umb-mediapicker-upload">
                             <div class="form-search">
                                 <i class="icon-search" aria-hidden="true"></i>
-                                <input class="umb-search-field search-query -full-width-input"
+                                <input type="text"
+                                    class="umb-search-field search-query -full-width-input"
                                     ng-model="vm.searchOptions.filter"
                                     localize="placeholder"
                                     placeholder="@placeholders_search"
                                     ng-change="vm.changeSearch()"
-                                    type="text"
                                     umb-auto-focus
-                                    no-dirty-check
-                                    />
+                                    no-dirty-check />
 
                                 <div class="form-search__toggle">
                                     <umb-checkbox
@@ -56,17 +55,15 @@
                     <div class="row umb-control-group" ng-show="!vm.searchOptions.filter">
                         <ul class="umb-breadcrumbs">
                             <li ng-hide="startNodeId != -1" class="umb-breadcrumbs__ancestor">
-                            <button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-click="vm.gotoFolder()" ng-class="{'--current':path.length === 0}">
-                                <localize key="treeHeaders_media">Media</localize>
-                            </button>
-                            <span class="umb-breadcrumbs__separator" aria-hidden="true">&#47;</span>
+                                <button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-click="vm.gotoFolder()" ng-class="{'--current':path.length === 0}">
+                                    <localize key="treeHeaders_media">Media</localize>
+                                </button>
+                                <span class="umb-breadcrumbs__separator" aria-hidden="true">&#47;</span>
                             </li>
-
                             <li ng-repeat="item in path" class="umb-breadcrumbs__ancestor">
-                            <button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-click="vm.gotoFolder(item)" ng-class="{'--current':$last}">{{item.name}}</button>
-                            <span class="umb-breadcrumbs__separator" aria-hidden="true">&#47;</span>
+                                <button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-click="vm.gotoFolder(item)" ng-class="{'--current':$last}">{{item.name}}</button>
+                                <span class="umb-breadcrumbs__separator" aria-hidden="true">&#47;</span>
                             </li>
-
                             <li class="umb-breadcrumbs__ancestor" ng-show="!lockedFolder">
                             <button type="button" class="umb-breadcrumbs__action umb-outline umb-outline--surronding" ng-hide="model.showFolderInput" ng-click="model.showFolderInput = true">
                                 <i class="icon icon-add small" aria-hidden="true"></i>
@@ -81,11 +78,10 @@
                                 ng-model="model.newFolderName"
                                 ng-keydown="enterSubmitFolder($event)"
                                 ng-blur="vm.submitFolder()"
-                                focus-when="{{model.showFolderInput}}"
-                            />
+                                focus-when="{{model.showFolderInput}}" />
                             </li>
                         </ul>
-                        <div class="umb-loader" ng-if="model.creatingFolder"></div>
+                        <umb-loader ng-if="model.creatingFolder"></umb-loader>
                     </div>
 
                     <umb-file-dropzone

From 69cfcc568cb434aced05c802351c4eaa30e134f2 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Tue, 23 Jun 2020 17:22:53 +0200
Subject: [PATCH 21/42] Add aria-hidden to icons in url lists (#8079)

---
 .../content/umb-content-node-info.html        | 19 +++++++++----------
 .../propertyeditors/urllist/urllist.html      |  7 +++----
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/components/content/umb-content-node-info.html b/src/Umbraco.Web.UI.Client/src/views/components/content/umb-content-node-info.html
index 2b5bceb11a..9ec8ea9302 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/content/umb-content-node-info.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/content/umb-content-node-info.html
@@ -5,18 +5,16 @@
         <umb-box ng-if="currentUrls" data-element="node-info-urls">
             <umb-box-header title-key="general_links"></umb-box-header>
             <umb-box-content class="block-form">
-                <ul class="nav nav-stacked" style="margin-bottom: 0;">
+                <ul class="nav nav-stacked mb0">
                     <li ng-repeat="url in currentUrls">
                         <a href="{{url.text}}" target="_blank" ng-if="url.isUrl">
                             <span ng-if="currentUrlsHaveMultipleCultures && url.culture" style="font-size: 13px; color: #cccccc; width: 50px;display: inline-block">{{url.culture}}</span>
-                            <i class="icon icon-out"></i>
+                            <i class="icon icon-out" aria-hidden="true"></i>
                             <span>{{url.text}}</span>
                         </a>
                         <div ng-if="!url.isUrl" style="margin-top: 4px;">
-
                             <span ng-if="currentUrlsHaveMultipleCultures && url.culture" style="font-size: 13px; color: #cccccc; width: 50px;display: inline-block">{{url.culture}}</span>
                             <em>{{url.text}}</em>
-
                         </div>
                     </li>
                 </ul>
@@ -32,7 +30,10 @@
                         <p><localize key="redirectUrls_panelInformation" class="ng-isolate-scope ng-scope">The following URLs redirect to this content item:</localize></p>
                         <ul class="nav nav-stacked" style="margin-bottom: 0;">
                             <li ng-repeat="redirectUrl in redirectUrls">
-                                <a href="{{redirectUrl.originalUrl}}" target="_blank"><i ng-class="value.icon" class="icon-out"></i> {{redirectUrl.originalUrl}}</a>
+                                <a href="{{redirectUrl.originalUrl}}" target="_blank">
+                                    <i ng-class="value.icon" class="icon-out" aria-hidden="true"></i>
+                                    {{redirectUrl.originalUrl}}
+                                </a>
                             </li>
                         </ul>
                     </div>
@@ -42,9 +43,8 @@
 
         <umb-box data-element="node-info-history">
 
-            <umb-box-header
-                title="{{historyLabel}}">
-
+            <umb-box-header title="{{historyLabel}}"> 
+                
                 <umb-button
                     ng-hide="node.trashed"
                     type="button"
@@ -104,8 +104,7 @@
                                 <span>
                                     <localize key="auditTrails_{{ item.logType | lowercase }}" tokens="[item.parameters]">{{ item.comment }}</localize>
                                 </span>
-
-
+                                
                             </div>
 
                         </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/urllist/urllist.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/urllist/urllist.html
index 864ad213a4..65c8c2364c 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/urllist/urllist.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/urllist/urllist.html
@@ -2,10 +2,9 @@
     <ul class="nav nav-stacked">
         <li ng-repeat="value in renderModel">
             <a href="{{getUrl(value.url)}}" prevent-default="{{value.url.indexOf('/') == -1}}" target="{{value.urlTarget}}">
-                <i ng-class="value.icon"></i>
-                <span ng-if="value.linkText">{{value.linkText}}</span>
-                <span ng-if="!value.linkText">{{value.url}}</span>
+                <i ng-class="value.icon" aria-hidden="true"></i>
+                <span>{{value.linkText || value.url}}</span>
             </a>
         </li>
     </ul>
-</div>
\ No newline at end of file
+</div>

From e19f375c84fb02ffe1c387af2a193d21d7d40919 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Tue, 23 Jun 2020 17:24:01 +0200
Subject: [PATCH 22/42] Update slider to handle merging of overlapping tooltips
 (#8074)

---
 src/Umbraco.Web.UI.Client/package.json        |  2 +-
 .../components/umbrangeslider.directive.js    | 87 +++++++++++++++++++
 2 files changed, 88 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 167bf53eb8..816d4e5090 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -38,7 +38,7 @@
     "lazyload-js": "1.0.0",
     "moment": "2.22.2",
     "ng-file-upload": "12.2.13",
-    "nouislider": "14.1.1",
+    "nouislider": "14.4.0",
     "npm": "6.13.6",
     "signalr": "2.4.0",
     "spectrum-colorpicker": "1.8.0",
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbrangeslider.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbrangeslider.directive.js
index 21a1f181a6..e467522c84 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbrangeslider.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbrangeslider.directive.js
@@ -118,6 +118,8 @@ For extra details about options and events take a look here: https://refreshless
             // create new slider
             noUiSlider.create(sliderInstance, options);
 
+            mergeTooltips(sliderInstance, 15, ' - ');
+
             if (ctrl.onSetup) {
                 ctrl.onSetup({
                     slider: sliderInstance
@@ -200,6 +202,91 @@ For extra details about options and events take a look here: https://refreshless
             }
         }
 
+        // Merging overlapping tooltips: https://refreshless.com/nouislider/examples/#section-merging-tooltips
+
+        /**
+         * @param slider HtmlElement with an initialized slider
+         * @param threshold Minimum proximity (in percentages) to merge tooltips
+         * @param separator String joining tooltips
+         */
+        function mergeTooltips(slider, threshold, separator) {
+
+            var textIsRtl = getComputedStyle(slider).direction === 'rtl';
+            var isRtl = slider.noUiSlider.options.direction === 'rtl';
+            var isVertical = slider.noUiSlider.options.orientation === 'vertical';
+            var tooltips = slider.noUiSlider.getTooltips();
+            var origins = slider.noUiSlider.getOrigins();
+
+            // Move tooltips into the origin element. The default stylesheet handles this.
+            tooltips.forEach(function (tooltip, index) {
+                if (tooltip) {
+                    origins[index].appendChild(tooltip);
+                }
+            });
+
+            slider.noUiSlider.on('update', function (values, handle, unencoded, tap, positions) {
+
+                var pools = [[]];
+                var poolPositions = [[]];
+                var poolValues = [[]];
+                var atPool = 0;
+
+                // Assign the first tooltip to the first pool, if the tooltip is configured
+                if (tooltips[0]) {
+                    pools[0][0] = 0;
+                    poolPositions[0][0] = positions[0];
+                    poolValues[0][0] = values[0];
+                }
+
+                for (var i = 1; i < positions.length; i++) {
+                    if (!tooltips[i] || (positions[i] - positions[i - 1]) > threshold) {
+                        atPool++;
+                        pools[atPool] = [];
+                        poolValues[atPool] = [];
+                        poolPositions[atPool] = [];
+                    }
+
+                    if (tooltips[i]) {
+                        pools[atPool].push(i);
+                        poolValues[atPool].push(values[i]);
+                        poolPositions[atPool].push(positions[i]);
+                    }
+                }
+
+                pools.forEach(function (pool, poolIndex) {
+                    var handlesInPool = pool.length;
+
+                    for (var j = 0; j < handlesInPool; j++) {
+                        var handleNumber = pool[j];
+
+                        if (j === handlesInPool - 1) {
+                            var offset = 0;
+
+                            poolPositions[poolIndex].forEach(function (value) {
+                                offset += 1000 - 10 * value;
+                            });
+
+                            var direction = isVertical ? 'bottom' : 'right';
+                            var last = isRtl ? 0 : handlesInPool - 1;
+                            var lastOffset = 1000 - 10 * poolPositions[poolIndex][last];
+                            offset = (textIsRtl && !isVertical ? 100 : 0) + (offset / handlesInPool) - lastOffset;
+
+                            // Filter to unique values
+                            var tooltipValues = poolValues[poolIndex].filter((v, i, a) => a.indexOf(v) === i); 
+
+                            // Center this tooltip over the affected handles
+                            tooltips[handleNumber].innerHTML = tooltipValues.join(separator);
+                            tooltips[handleNumber].style.display = 'block';
+                            tooltips[handleNumber].style[direction] = offset + '%';
+                        } else {
+                            // Hide this tooltip
+                            tooltips[handleNumber].style.display = 'none';
+                        }
+                    }
+                });
+            });
+        }
+
     }
 
     angular.module('umbraco.directives').component('umbRangeSlider', umbRangeSlider);

From 5ce9a3e74f3b8470430298db5f00e4212b95619e Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Wed, 13 May 2020 20:22:14 +0200
Subject: [PATCH 23/42] Reload property preview when changing property type

---
 .../property/umbpropertyeditor.directive.js           | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/property/umbpropertyeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/property/umbpropertyeditor.directive.js
index 5eac7e5e24..8aaa4ff5ec 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/property/umbpropertyeditor.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/property/umbpropertyeditor.directive.js
@@ -33,8 +33,15 @@ function umbPropEditor(umbPropEditorHelper) {
                    scope.model.alias = Math.random().toString(36).slice(2);
                 }
 
-                scope.propertyEditorView = umbPropEditorHelper.getViewPath(scope.model.view, scope.isPreValue);
-                
+                var unbindWatcher = scope.$watch("model.view",
+                    function() {
+                        scope.propertyEditorView = umbPropEditorHelper.getViewPath(scope.model.view, scope.isPreValue);
+                    }
+                );
+
+                scope.$on("$destroy", function () {
+                    unbindWatcher();
+                });
             }
         };
     };

From 7b0468fb39bc2ee28f1ad5110f8a33a524d4a844 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Wed, 13 May 2020 20:57:36 +0200
Subject: [PATCH 24/42] Prevent property previews from having focus

---
 .../src/views/components/umb-groups-builder.html                | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
index 0e1b2b4973..c46981a6cb 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
@@ -240,7 +240,7 @@
 
                                 </div>
 
-                                <ng-form inert class="umb-group-builder__property-preview-form" name="propertyEditorPreviewForm" umb-disable-form-validation ng-click="editPropertyTypeSettings(property, tab)">
+                                <ng-form inert class="umb-group-builder__property-preview-form" name="propertyEditorPreviewForm" umb-disable-form-validation ng-click="editPropertyTypeSettings(property, tab)" tabindex="-1">
                                     <umb-property-editor
                                         ng-if="property.view !== undefined"
                                         model="property"

From 66a75dbc1e2fa5de06f10c1058a1a6a740d7e7d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=B8ren=20Kottal?= <sk@ecreo.dk>
Date: Fri, 22 May 2020 16:14:40 +0200
Subject: [PATCH 25/42] adds row immediately if only one layout is allowed

---
 .../src/views/propertyeditors/grid/grid.html                  | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
index 5048c479bb..0628766638 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
@@ -251,7 +251,9 @@
 
                        <button
                           class="iconBox btn-reset"
-                          ng-click="toggleAddRow()"
+                          type="button"
+                          title="{{ section.$allowedLayouts.length == 1 ? section.$allowedLayouts[0].label || section.$allowedLayouts[0].name : '' }}"
+                          ng-click="section.$allowedLayouts.length == 1 ? addRow(section, section.$allowedLayouts[0]) : toggleAddRow()"
                           ng-if="!showRowConfigurations">
 
                           <i class="icon icon-add" ></i>

From 75ae5e69e0063c8e7aa57a800007ba4213e8d93e Mon Sep 17 00:00:00 2001
From: BatJan <jaskov@gmail.com>
Date: Fri, 22 May 2020 23:41:21 +0200
Subject: [PATCH 26/42] Change binding type

---
 .../common/directives/components/buttons/umbbutton.directive.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js
index 56416e3544..dc012945dd 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js
@@ -99,7 +99,7 @@ Use this directive to render an umbraco button. The directive can be used to gen
                 alias: "@?",
                 addEllipsis: "@?",
                 showCaret: "@?",
-                autoFocus: "@?",
+                autoFocus: "<?",
                 hasPopup: "@?",
                 isExpanded: "<?"
             }

From 4aef0d09972308cf205d62c9493977bd36a01a56 Mon Sep 17 00:00:00 2001
From: BatJan <jaskov@gmail.com>
Date: Sat, 23 May 2020 00:11:38 +0200
Subject: [PATCH 27/42] Add missing foucs style

---
 src/Umbraco.Web.UI.Client/src/less/mixins.less | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/Umbraco.Web.UI.Client/src/less/mixins.less b/src/Umbraco.Web.UI.Client/src/less/mixins.less
index f5c499cbfc..a87080a326 100644
--- a/src/Umbraco.Web.UI.Client/src/less/mixins.less
+++ b/src/Umbraco.Web.UI.Client/src/less/mixins.less
@@ -448,9 +448,11 @@
   }
 
   // in these cases the gradient won't cover the background, so we override
+  &:focus,
   &:hover {
     color: @textColorHover;
     background-color: @hoverColor;
+    text-decoration: none;
   }
 
   &.disabled, &[disabled] {

From e96d2a30cccd0d1ba0c68d211a33f832a89f419a Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Sat, 23 May 2020 13:51:00 +0100
Subject: [PATCH 28/42] Removing legacy Examine.Config references from
 web.config template

---
 src/Umbraco.Web.UI/web.Template.Debug.config | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI/web.Template.Debug.config b/src/Umbraco.Web.UI/web.Template.Debug.config
index 0026f23514..d4c39e15dd 100644
--- a/src/Umbraco.Web.UI/web.Template.Debug.config
+++ b/src/Umbraco.Web.UI/web.Template.Debug.config
@@ -1,8 +1,7 @@
 <?xml version="1.0"?>
 <configuration xmlns:xdt="http://schemas.microsoft.com/XML-Document-Transform">
-
     
-    <!--
+  <!--
     Defines transforms that apply to web.Template.config when creating the Debug web.config.
 
     This file should contain changes that need to go into the Debug config (the one that everybody
@@ -13,14 +12,6 @@
     file everytime Umbraco builds.
   -->
 
-    <configSections>
-        <section name="Examine" xdt:Transform="Remove" xdt:Locator="Match(name)" />
-        <section name="ExamineLuceneIndexSets" xdt:Transform="Remove" xdt:Locator="Match(name)" />
-    </configSections>
-
-    <Examine xdt:Transform="Remove"  />
-    <ExamineLuceneIndexSets xdt:Transform="Remove"  />
-
     <appSettings>
         <add key="Umbraco.TestData.Enabled" xdt:Transform="Remove" xdt:Locator="Match(key)"/>
         <add key="Umbraco.TestData.Enabled" value="true" xdt:Transform="Insert" />

From 6c2bc3ca37bc07bcb696d52e9b92b47986dbb08a Mon Sep 17 00:00:00 2001
From: Jan Skovgaard <1932158+BatJan@users.noreply.github.com>
Date: Tue, 23 Jun 2020 18:07:09 +0200
Subject: [PATCH 29/42] Accessibility improvement: umb-context-menu (#8155)

---
 .../views/components/application/umb-contextmenu.html  | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-contextmenu.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-contextmenu.html
index a6d42d923b..820ef4a886 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-contextmenu.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-contextmenu.html
@@ -5,13 +5,9 @@
 
     <div class='umb-modalcolumn-body'>
         <ul class="umb-actions">
-            <li data-element="action-{{action.alias}}" ng-click="executeMenuItem(action)" class="umb-action" ng-class="{sep:action.separator, '-opens-dialog': action.opensDialog}" ng-repeat="action in menuActions">
-                <button class="umb-action-link btn-reset umb-outline" prevent-default umb-auto-focus ng-if="$index === 0">
-                    <i class="icon icon-{{action.cssclass}}"></i>
-                    <span class="menu-label">{{action.name}}</span>
-                </button>
-                <button class="umb-action-link btn-reset umb-outline" prevent-default ng-if="$index !== 0">
-                    <i class="icon icon-{{action.cssclass}}"></i>
+            <li data-element="action-{{action.alias}}" class="umb-action" ng-class="{sep:action.separator, '-opens-dialog': action.opensDialog}" ng-repeat="action in menuActions">
+                <button type="button" umb-auto-focus="{{$index === 0}}" ng-click="executeMenuItem(action)" class="umb-action-link btn-reset umb-outline" prevent-default>
+                    <i class="icon icon-{{action.cssclass}}" aria-hidden="true"></i>
                     <span class="menu-label">{{action.name}}</span>
                 </button>
             </li>

From 9723c81d2721c57c6dfff5e38692c929d947b6eb Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 24 May 2020 13:53:48 +0200
Subject: [PATCH 30/42] Use element type description as tooltip in the Nested
 Content "Add content" dialog

---
 .../itempicker/itempicker.controller.js       | 25 +++++++++++++++++++
 .../overlays/itempicker/itempicker.html       |  6 ++++-
 .../nestedcontent/nestedcontent.controller.js |  3 ++-
 3 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
index 74a677b7c6..17184ae9a3 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
@@ -19,6 +19,31 @@ function ItemPickerOverlay($scope, localizationService) {
         $scope.submitForm($scope.model);
     };
 
+    $scope.tooltip = {
+        show: false,
+        event: null
+    };
+
+    $scope.showTooltip = function(item, $event) {
+        if (!item.tooltip) {
+            $scope.mouseLeave();
+            return;
+        }
+        $scope.tooltip = {
+            show: true,
+            event: $event,
+            text: item.tooltip
+        };
+    }
+
+    $scope.hideTooltip = function () {
+        $scope.tooltip = {
+            show: false,
+            event: null,
+            text: null
+        };
+    }
+
     onInit();
 
 }
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
index 715dc12a07..ff2ce6379f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
@@ -38,9 +38,13 @@
             <button class="umb-card-grid-item btn-reset" ng-click="selectItem(availableItem)">
                 <span>
                     <i class="{{ availableItem.icon }}"></i>
-                    {{ availableItem.name }}
+                    <span ng-mouseover="showTooltip(availableItem, $event)" ng-mouseleave="hideTooltip()">{{ availableItem.name }}</span>                    
                 </span>
             </button>
         </li>
     </ul>
+
+    <umb-tooltip ng-if="tooltip.show" event="tooltip.event">
+        {{ tooltip.text }}
+    </umb-tooltip>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
index 066cbd6c17..fad68acbee 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
@@ -228,7 +228,8 @@
                 vm.overlayMenu.availableItems.push({
                     alias: scaffold.contentTypeAlias,
                     name: scaffold.contentTypeName,
-                    icon: iconHelper.convertFromLegacyIcon(scaffold.icon)
+                    icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
+                    tooltip: scaffold.documentType.description
                 });
             });
 

From a70f95b4e563e8468f033c675d2537728bb8217c Mon Sep 17 00:00:00 2001
From: Jan Skovgaard <1932158+BatJan@users.noreply.github.com>
Date: Tue, 23 Jun 2020 18:12:24 +0200
Subject: [PATCH 31/42] Sort dialog: Accessibility optimizations (#8156)

---
 src/Umbraco.Web.UI.Client/src/less/main.less  |  8 +++-
 .../src/views/content/sort.html               | 42 +++++++++----------
 .../src/views/media/sort.html                 | 30 +++++++------
 3 files changed, 41 insertions(+), 39 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/main.less b/src/Umbraco.Web.UI.Client/src/less/main.less
index b34f313435..ee8dafebc2 100644
--- a/src/Umbraco.Web.UI.Client/src/less/main.less
+++ b/src/Umbraco.Web.UI.Client/src/less/main.less
@@ -347,10 +347,16 @@ label:not([for]) {
   border: none !important;
 }
 
-table thead a {
+table thead a,
+table thead button {
   color: @gray-2;
 }
 
+table thead button:hover,
+table thead button:focus{
+    text-decoration: underline;
+}
+
 /* UI interactions */
 
 .umb-table tbody.ui-sortable tr
diff --git a/src/Umbraco.Web.UI.Client/src/views/content/sort.html b/src/Umbraco.Web.UI.Client/src/views/content/sort.html
index 471f3de956..e6cc58c8be 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/sort.html
+++ b/src/Umbraco.Web.UI.Client/src/views/content/sort.html
@@ -1,37 +1,35 @@
 <div ng-controller="Umbraco.Editors.Content.SortController as vm" ng-cloak>
-    
+
         <div class="umb-dialog-body with-footer sort-order">
-            
+
             <div class="umb-pane">
 
-                <div ng-if="vm.error">
-                    <div class="alert alert-error">
-                        <div>{{vm.error.errorMsg}}</div>
-                    </div>
+                <div ng-if="vm.error" class="alert alert-error">
+                    <p>{{vm.error.errorMsg}}</p>
                 </div>
-    
+
                 <umb-load-indicator
                     ng-show="vm.loading">
                 </umb-load-indicator>
-    
+
                 <div ng-if="!vm.loading">
-                    <p class="abstract"><localize key="sort_sortHelp"></localize></p>
+                    <p class="abstract"><localize key="sort_sortHelp">Drag the different items up or down below to set how they should be arranged. Or click the column headers to sort the entire collection of items</localize></p>
                     <table class="table table-condensed table-sortable" ng-if="vm.children">
                         <thead>
                             <tr>
                                 <th colspan="2">
-                                    <a ng-href="#" ng-click="vm.sort('name')" prevent-default>
-                                        <localize key="general_name"></localize>
-                                        <span ng-if="vm.sortOrder.column === 'name'">
+                                    <button type="button" class="btn-reset" ng-click="vm.sort('name')">
+                                        <b><localize key="general_name">Name</localize></b>
+                                        <span ng-if="vm.sortOrder.column === 'name'" aria-hidden="true">
                                             <i ng-if="vm.sortOrder.reverse" class="icon-navigation-up"></i>
                                             <i ng-if="!vm.sortOrder.reverse" class="icon-navigation-down"></i>
                                         </span>
-                                    </a>
+                                    </button>
                                 </th>
                                 <th>
-                                    <a ng-href="#" ng-click="vm.sort('createDate')" prevent-default>
-                                        <localize key="sort_sortCreationDate"></localize>
-                                        <span ng-if="vm.sortOrder.column === 'createDate'">
+                                    <button type="button" class="btn-reset" ng-click="vm.sort('createDate')">
+                                        <b><localize key="sort_sortCreationDate">Creation date</localize></b>
+                                        <span ng-if="vm.sortOrder.column === 'createDate'" aria-hidden="true">
                                             <i ng-if="vm.sortOrder.reverse" class="icon-navigation-up"></i>
                                             <i ng-if="!vm.sortOrder.reverse" class="icon-navigation-down"></i>
                                         </span>
@@ -51,14 +49,14 @@
                     <umb-empty-state
                         ng-if="!vm.children"
                         position="center">
-                        <localize key="sort_sortEmptyState"></localize>
+                        <localize key="sort_sortEmptyState">This node has no child nodes to sort</localize>
                     </umb-empty-state>
                 </div>
-    
+
             </div>
-    
+
         </div>
-    
+
         <div class="umb-dialog-footer btn-toolbar umb-btn-toolbar">
             <umb-button
                 type="button"
@@ -68,12 +66,12 @@
             </umb-button>
             <umb-button
                 ng-if="vm.children"
-                type="button" 
+                type="button"
                 action="vm.save()"
                 state="vm.saveButtonState"
                 button-style="success"
                 label-key="buttons_save">
             </umb-button>
         </div>
-    
+
     </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/media/sort.html b/src/Umbraco.Web.UI.Client/src/views/media/sort.html
index b893517f1c..a483e9c7dc 100644
--- a/src/Umbraco.Web.UI.Client/src/views/media/sort.html
+++ b/src/Umbraco.Web.UI.Client/src/views/media/sort.html
@@ -1,13 +1,11 @@
 <div ng-controller="Umbraco.Editors.Media.SortController as vm" ng-cloak>
-    
+
     <div class="umb-dialog-body with-footer sort-order">
-        
+
         <div class="umb-pane">
 
-            <div ng-if="vm.error">
-                <div class="alert alert-error">
-                    <div>{{vm.error.errorMsg}}</div>
-                </div>
+            <div ng-if="vm.error" class="alert alert-error">
+                <p>{{vm.error.errorMsg}}</p>
             </div>
 
             <umb-load-indicator
@@ -15,27 +13,27 @@
             </umb-load-indicator>
 
             <div ng-if="!vm.loading">
-                <p class="abstract"><localize key="sort_sortHelp"></localize></p>
+                <p class="abstract"><localize key="sort_sortHelp">Drag the different items up or down below to set how they should be arranged. Or click the column headers to sort the entire collection of items</localize></p>
                 <table class="table table-condensed table-sortable" ng-if="vm.children">
                     <thead>
                         <tr>
                             <th colspan="2">
-                                <a ng-href="#" ng-click="vm.sort('name')" prevent-default>
-                                    <localize key="general_name"></localize>
-                                    <span ng-if="vm.sortOrder.column === 'name'">
+                                <button type="button" class="btn-reset" ng-click="vm.sort('name')">
+                                    <b><localize key="general_name">Name</localize></b>
+                                    <span ng-if="vm.sortOrder.column === 'name'" aria-hidden="true">
                                         <i ng-if="vm.sortOrder.reverse" class="icon-navigation-up"></i>
                                         <i ng-if="!vm.sortOrder.reverse" class="icon-navigation-down"></i>
                                     </span>
-                                </a>
+                                </button>
                             </th>
                             <th>
-                                <a ng-href="#" ng-click="vm.sort('createDate')" prevent-default>
-                                    <localize key="sort_sortCreationDate"></localize>
-                                    <span ng-if="vm.sortOrder.column === 'createDate'">
+                                <button type="button" class="btn-reset" ng-click="vm.sort('createDate')">
+                                    <b><localize key="sort_sortCreationDate">Creation date</localize></b>
+                                    <span ng-if="vm.sortOrder.column === 'createDate'" aria-hidden="true">
                                         <i ng-if="vm.sortOrder.reverse" class="icon-navigation-up"></i>
                                         <i ng-if="!vm.sortOrder.reverse" class="icon-navigation-down"></i>
                                     </span>
-                                </a>
+                                </button>
                             </th>
                         </tr>
                     </thead>
@@ -68,7 +66,7 @@
         </umb-button>
         <umb-button
             ng-if="vm.children"
-            type="button" 
+            type="button"
             action="vm.save()"
             state="vm.saveButtonState"
             button-style="success"

From dc5d418477e7ecf339dfe38d53d754bbb4c3ed41 Mon Sep 17 00:00:00 2001
From: BatJan <jaskov@gmail.com>
Date: Sun, 24 May 2020 21:30:38 +0200
Subject: [PATCH 32/42] Fix semantics and accessibility issues

---
 .../lib/bootstrap/less/type.less              | 28 +++++------
 src/Umbraco.Web.UI.Client/src/less/main.less  | 16 +++++--
 .../datatypepicker/datatypepicker.html        | 47 ++++++++++++-------
 3 files changed, 58 insertions(+), 33 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less
index 3f93deaf56..414ab10ba8 100644
--- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less
+++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less
@@ -56,7 +56,7 @@ a.text-success:focus { color: darken(@successText, 10%); }
 // Headings
 // -------------------------
 
-h1, h2, h3, h4, h5, h6 {
+h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
   margin: (@baseLineHeight / 2) 0;
   font-family: @headingsFontFamily;
   font-weight: @headingsFontWeight;
@@ -70,21 +70,21 @@ h1, h2, h3, h4, h5, h6 {
   }
 }
 
-h1,
-h2,
-h3 { line-height: @baseLineHeight * 2; }
+h1, .h1,
+h2, .h2,
+h3, .h3 { line-height: @baseLineHeight * 2; }
 
-h1 { font-size: @baseFontSize * 2.75; } // ~38px
-h2 { font-size: @baseFontSize * 2.25; } // ~32px
-h3 { font-size: @baseFontSize * 1.75; } // ~24px
-h4 { font-size: @baseFontSize * 1.25; } // ~18px
-h5 { font-size: @baseFontSize; }
-h6 { font-size: @baseFontSize * 0.85; } // ~12px
+h1, .h1 { font-size: @baseFontSize * 2.75; } // ~38px
+h2, .h2 { font-size: @baseFontSize * 2.25; } // ~32px
+h3, .h3 { font-size: @baseFontSize * 1.75; } // ~24px
+h4, .h4 { font-size: @baseFontSize * 1.25; } // ~18px
+h5, .h5 { font-size: @baseFontSize; }
+h6, .h6 { font-size: @baseFontSize * 0.85; } // ~12px
 
-h1 small { font-size: @baseFontSize * 1.75; } // ~24px
-h2 small { font-size: @baseFontSize * 1.25; } // ~18px
-h3 small { font-size: @baseFontSize; }
-h4 small { font-size: @baseFontSize; }
+h1 small, .h1 small { font-size: @baseFontSize * 1.75; } // ~24px
+h2 small, .h2 small { font-size: @baseFontSize * 1.25; } // ~18px
+h3 small, .h3 small { font-size: @baseFontSize; }
+h4 small, .h4 small { font-size: @baseFontSize; }
 
 
 // Page header
diff --git a/src/Umbraco.Web.UI.Client/src/less/main.less b/src/Umbraco.Web.UI.Client/src/less/main.less
index ee8dafebc2..a2c43c2979 100644
--- a/src/Umbraco.Web.UI.Client/src/less/main.less
+++ b/src/Umbraco.Web.UI.Client/src/less/main.less
@@ -26,19 +26,29 @@
     color: @gray-7;
 }
 
-h5{
+h5, .h5{
   color: @gray-1;
   font-weight: bold;
   font-size: 15px;
   margin-top: 15px;
 }
 
-h5.-border-bottom {
+h1.-border-bottom,
+h2.-border-bottom,
+h3.-border-bottom,
+h4.-border-bottom,
+h5.-border-bottom,
+h6.-border-bottom {
 	border-bottom: 1px solid @gray-9;
 	padding-bottom: 5px;
 }
 
-h5.-black {
+h1.-black,
+h2.-black,
+h3.-black,
+h4.-black,
+h5.-black,
+h6.-black {
 	color: @black;
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html
index 768f8a8c24..d6e2d8133d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html
@@ -34,16 +34,19 @@
 
                     <div ng-if="vm.loading === false && vm.showDataTypes === true">
                         <div ng-repeat="(key,value) in vm.dataTypes">
-                            <h5>{{key | umbCmsTitleCase}}</h5>
+                            <h2 class="h5">{{key | umbCmsTitleCase}}</h2>
                             <ul class="umb-card-grid -six-in-row">
-                                <li ng-repeat="dataType in value | orderBy:'name'"
-                                    data-element="datatype-{{dataType.name}}">
-                                    <a class="umb-card-grid-item" href="" ng-click="vm.viewOptionsForEditor(dataType)" title="{{ dataType.name }}">
+                                <li ng-repeat="dataType in value | orderBy:'name'" data-element="datatype-{{dataType.name}}">
+                                    <button
+                                        type="button"
+                                        class="btn-reset umb-card-grid-item"
+                                        ng-click="vm.viewOptionsForEditor(dataType)"
+                                        title="{{ dataType.name }}">
                                         <span>
-                                            <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
+                                            <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}" aria-hidden="true"></i>
                                             {{ dataType.name }}
                                         </span>
-                                    </a>
+                                    </button>
                                 </li>
                             </ul>
                         </div>
@@ -51,38 +54,50 @@
 
                     <!-- SEARCH RESULTS -->
                     <div ng-if="vm.loading === false && vm.showDataTypes === false && vm.searchResult !== null">
-                        <h5 class="-border-bottom -black"><localize key="contentTypeEditor_searchResultSettings"></localize></h5>
+                        <h2 class="h5 -border-bottom -black">
+                            <localize key="contentTypeEditor_searchResultSettings">Available configurations</localize>
+                        </h2>
                         <div ng-repeat="result in vm.searchResult.configs">
                             <div ng-if="result.entries.length > 0">
-                                <h5>{{result.group | umbCmsTitleCase}}</h5>
+                                <h3 class="h5">{{result.group | umbCmsTitleCase}}</h3>
                                 <ul class="umb-card-grid -six-in-row">
                                     <li ng-repeat="dataType in result.entries | orderBy:'name'"
                                         ng-mouseover="vm.showDetailsOverlay(dataType)">
                                         <div ng-if="dataType.loading" class="umb-card-grid-item__loading">
                                             <div class="umb-button__progress"></div>
                                         </div>
-                                        <a class="umb-card-grid-item" href="" ng-click="vm.pickDataType(dataType)" title="{{ dataType.name }}">
+                                        <button
+                                            type="button"
+                                            class="btn-reset umb-card-grid-item"
+                                            ng-click="vm.pickDataType(dataType)"
+                                            title="{{ dataType.name }}">
                                             <span>
-                                                <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
+                                                <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}" aria-hidden="true"></i>
                                                 {{ dataType.name }}
                                             </span>
-                                        </a>
+                                        </button>
                                     </li>
                                 </ul>
                             </div>
                         </div>
-                        <h5 class="-border-bottom -black"><localize key="contentTypeEditor_searchResultEditors"></localize></h5>
+                        <h2 class="h5 -border-bottom -black">
+                            <localize key="contentTypeEditor_searchResultEditors">Create a new configuration</localize>
+                        </h2>
                         <div ng-repeat="result in vm.searchResult.dataTypes">
                             <div ng-if="result.entries.length > 0">
-                                <h5>{{result.group | umbCmsTitleCase}}</h5>
+                                <h3 class="h5">{{result.group | umbCmsTitleCase}}</h3>
                                 <ul class="umb-card-grid -six-in-row">
                                     <li ng-repeat="dataType in result.entries | orderBy:'name'">
-                                        <a class="umb-card-grid-item" href="" ng-click="vm.pickEditor(dataType)" title="{{ dataType.name }}">
+                                        <button
+                                            type="button"
+                                            class="btn-reset umb-card-grid-item"
+                                            ng-click="vm.pickEditor(dataType)"
+                                            title="{{ dataType.name }}">
                                             <span>
-                                                <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>
+                                                <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}" aria-hidden="true"></i>
                                                 {{ dataType.name }}
                                             </span>
-                                        </a>
+                                        </button>
                                     </li>
                                 </ul>
                             </div>

From b55fdd60e5397f3b9d95160d78d2a34a85ba2a7f Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 24 May 2020 22:08:58 +0200
Subject: [PATCH 33/42] Update listviews after sorting children

---
 .../src/views/content/content.sort.controller.js  |  3 ++-
 .../src/views/media/media.sort.controller.js      |  3 ++-
 .../listview/listview.controller.js               | 15 ++++++++++++++-
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/content/content.sort.controller.js b/src/Umbraco.Web.UI.Client/src/views/content/content.sort.controller.js
index bd501a5b07..f3113f5c8f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/content.sort.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/content/content.sort.controller.js
@@ -1,7 +1,7 @@
 (function () {
     "use strict";
 
-    function ContentSortController($scope, $filter, $routeParams, contentResource, navigationService) {
+    function ContentSortController($scope, $filter, $routeParams, contentResource, navigationService, eventsService) {
 
         var vm = this;
         var id = $scope.currentNode.id;
@@ -50,6 +50,7 @@
                     navigationService.syncTree({ tree: "content", path: $scope.currentNode.path, forceReload: true })
                         .then(() => navigationService.reloadNode($scope.currentNode));
 
+                    eventsService.emit("sortCompleted", { id: id });
                     vm.saveButtonState = "success";
                 }, function(error) {
                     vm.error = error;
diff --git a/src/Umbraco.Web.UI.Client/src/views/media/media.sort.controller.js b/src/Umbraco.Web.UI.Client/src/views/media/media.sort.controller.js
index 4ad1fc8aab..95aeb239b9 100644
--- a/src/Umbraco.Web.UI.Client/src/views/media/media.sort.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/media/media.sort.controller.js
@@ -1,7 +1,7 @@
 (function () {
     "use strict";
 
-    function MediaSortController($scope, $filter, mediaResource, navigationService) {
+    function MediaSortController($scope, $filter, mediaResource, navigationService, eventsService) {
 
         var vm = this;
         var id = $scope.currentNode.id;
@@ -50,6 +50,7 @@
                     navigationService.syncTree({ tree: "media", path: $scope.currentNode.path, forceReload: true })
                         .then(() => navigationService.reloadNode($scope.currentNode));
 
+                    eventsService.emit("sortCompleted", { id: id });
                     vm.saveButtonState = "success";
                 }, function(error) {
                     vm.error = error;
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.controller.js
index 16c1be98a0..9a86dc575a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.controller.js
@@ -1,4 +1,4 @@
-function listViewController($scope, $interpolate, $routeParams, $injector, $timeout, currentUserResource, notificationsService, iconHelper, editorState, localizationService, appState, $location, listViewHelper, navigationService, editorService, overlayService, languageResource, mediaHelper) {
+function listViewController($scope, $interpolate, $routeParams, $injector, $timeout, currentUserResource, notificationsService, iconHelper, editorState, localizationService, appState, $location, listViewHelper, navigationService, editorService, overlayService, languageResource, mediaHelper, eventsService) {
 
     //this is a quick check to see if we're in create mode, if so just exit - we cannot show children for content
     // that isn't created yet, if we continue this will use the parent id in the route params which isn't what
@@ -838,6 +838,19 @@ function listViewController($scope, $interpolate, $routeParams, $injector, $time
     $scope.toggleDropdown = toggleDropdown;
     $scope.leaveDropdown = leaveDropdown;
 
+    // if this listview has sort order in it, make sure it is updated when sorting is performed on the current content
+    if (_.find($scope.options.includeProperties, property => property.alias === "sortOrder")) {
+        var eventSubscription = eventsService.on("sortCompleted", function (e, args) {
+            if (parseInt(args.id) === parseInt($scope.contentId)) {
+                $scope.reloadView($scope.contentId);
+            }
+        });
+
+        $scope.$on('$destroy', function () {
+            eventsService.unsubscribe(eventSubscription);
+        });
+    }
+
     //GO!
     initView();
 }

From 4b673815a133be4865de1a7d48cfd51bc7f0dc79 Mon Sep 17 00:00:00 2001
From: Jan Skovgaard <1932158+BatJan@users.noreply.github.com>
Date: Tue, 23 Jun 2020 18:27:00 +0200
Subject: [PATCH 34/42] Umb-editor directive: Fix semantics (#8160)

---
 .../components/editor/umb-editor-header.html     | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-header.html b/src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-header.html
index e1bc01a7a1..7929f92371 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-header.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-header.html
@@ -12,16 +12,16 @@
         <div class="flex items-center" style="flex: 1;">
 
             <ng-form data-element="editor-icon" name="iconForm">
-                <button 
-                    type="button" class="umb-panel-header-icon" 
-                    ng-if="!hideIcon" 
-                    ng-click="openIconPicker()" 
+                <button
+                    type="button" class="umb-panel-header-icon"
+                    ng-if="!hideIcon"
+                    ng-click="openIconPicker()"
                     ng-class="{'-placeholder': $parent.icon==='' || $parent.icon===null}"
                     title="{{$parent.icon}}">
                         <i class="icon {{$parent.icon}}" ng-if="$parent.icon!=='' && $parent.icon!==null" aria-hidden="true"></i>
-                        <div class="umb-panel-header-icon-text" ng-if="$parent.icon==='' || $parent.icon===null">
+                        <span class="umb-panel-header-icon-text" ng-if="$parent.icon==='' || $parent.icon===null">
                             <localize key="settings_addIcon">Add icon</localize>
-                        </div>
+                        </span>
                 </button>
             </ng-form>
 
@@ -67,7 +67,7 @@
 
                 </div>
 
-                <div class="umb-panel-header-name" ng-if="nameLocked" title="{{key}}">{{ name }}</div>
+                <h1 class="umb-panel-header-name" id="editor-headline-{{$id}}" ng-if="nameLocked" title="{{key}}">{{ name }}</h1>
 
                 <input data-element="editor-description"
                        no-password-manager
@@ -78,7 +78,7 @@
                        ng-if="!hideDescription && !descriptionLocked"
                        ng-model="$parent.description"/>
 
-                <div class="umb-panel-header-locked-description" ng-if="descriptionLocked">{{ description }}</div>
+                <p class="umb-panel-header-locked-description" id="editor-description-{{$id}}" ng-if="descriptionLocked">{{ description }}</p>
 
             </div>
 

From dc7277771c41883c76c19ae6b4b3002902a6940f Mon Sep 17 00:00:00 2001
From: BatJan <jaskov@gmail.com>
Date: Sun, 24 May 2020 22:59:57 +0200
Subject: [PATCH 35/42] Improve accessibility and UX

---
 .../datatypeconfigurationpicker.html          | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html
index 06162d2961..cbc5b102cc 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html
@@ -18,29 +18,28 @@
                     <umb-load-indicator ng-if="vm.loading"></umb-load-indicator>
 
                     <div ng-if="!vm.loading">
-                        <a href="" tabindex="0" umb-auto-focus></a>
                         <ul class="umb-card-grid -three-in-row">
-                            <li ng-repeat="dataTypeConfig in vm.configs | orderBy:'name'"
+                            <li ng-repeat="dataTypeConfig in vm.configs | orderBy:'name' track by $index"
                                 data-element="datatypeconfig-{{dataTypeConfig.name}}">
                                 <div ng-if="dataTypeConfig.loading" class="umb-card-grid-item__loading">
                                     <div class="umb-button__progress"></div>
                                 </div>
-                                <a class="umb-card-grid-item" href="" ng-click="vm.pickDataType(dataTypeConfig)" title="{{ dataTypeConfig.name }}">
+                                <button umb-auto-focus="{{$index === 0}}" class="btn-reset umb-card-grid-item" type="button" ng-click="vm.pickDataType(dataTypeConfig)" title="Select {{ dataTypeConfig.name }}">
                                     <span>
-                                        <i class="{{ dataTypeConfig.icon }}" ng-class="{'icon-autofill': dataTypeConfig.icon == null}"></i>
-                                        {{ dataTypeConfig.name }}
+                                        <i class="{{ dataTypeConfig.icon }}" ng-class="{'icon-autofill': dataTypeConfig.icon == null}" aria-hidden="true"></i>
+                                        <span class="sr-only">Select</span> {{ dataTypeConfig.name }}
                                     </span>
-                                </a>
+                                </button>
                             </li>
                         </ul>
                         <ul class="umb-card-grid -three-in-row">
                             <li>
-                                <a class="umb-card-grid-item-slot" href="" ng-click="vm.newDataType()" title="Create a new configuration of {{ model.editor.name }}">
+                                <button umb-auto-focus="{{vm.configs.length === 0}}" class="btn-reset umb-card-grid-item-slot" type="button" ng-click="vm.newDataType()" title="Create a new configuration of {{ model.editor.name }}">
                                     <span>
-                                        <i class="icon icon-add"></i>
-                                        Create new
+                                        <i class="icon icon-add" aria-hidden="true"></i>
+                                        Create new <span class="sr-only">configuration of {{ model.editor.name }}</span>
                                     </span>
-                                </a>
+                                </button>
                             </li>
                         </ul>
 

From a7b0a75e5d38288e30348fab0eaee58790df9d3b Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Mon, 25 May 2020 13:15:10 +0200
Subject: [PATCH 36/42] Ensure that "sort" is available as "order by" for new
 listviews

---
 .../components/umblistviewsettings.directive.js    | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umblistviewsettings.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umblistviewsettings.directive.js
index 63c8427bfb..318ffebd1b 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umblistviewsettings.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umblistviewsettings.directive.js
@@ -12,16 +12,18 @@
 
             /* ---------- INIT ---------- */ 
 
+            const setDataType = (dataType) => {
+                scope.dataType = dataType;
+                listViewPrevalueHelper.setPrevalues(dataType.preValues);
+            }
+
             const activate = () => {
 
                 if (scope.enableListView) {
 
                     dataTypeResource.getByName(scope.listViewName)
                         .then(dataType => {
-
-                            scope.dataType = dataType;
-
-                            listViewPrevalueHelper.setPrevalues(dataType.preValues);
+                            setDataType(dataType);
                             scope.customListViewCreated = checkForCustomListView();
                         });
 
@@ -64,7 +66,7 @@
                 dataTypeResource.createCustomListView(scope.modelAlias).then(dataType => {
 
                     // store data type
-                    scope.dataType = dataType;
+                    setDataType(dataType);
 
                     // set list view name on scope
                     scope.listViewName = dataType.name;
@@ -95,7 +97,7 @@
                         .then(defaultDataType => {
 
                             // store data type
-                            scope.dataType = defaultDataType;
+                            setDataType(defaultDataType);
 
                             // change state to default list view
                             scope.customListViewCreated = false;

From b38cf4175208c46d398bc9dcaa8f2bc6895f9701 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Mon, 25 May 2020 10:54:54 +0200
Subject: [PATCH 37/42] Add a bit of spacing in infinite listview editing

---
 src/Umbraco.Web.UI.Client/src/less/main.less | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/Umbraco.Web.UI.Client/src/less/main.less b/src/Umbraco.Web.UI.Client/src/less/main.less
index a2c43c2979..57d867ccd5 100644
--- a/src/Umbraco.Web.UI.Client/src/less/main.less
+++ b/src/Umbraco.Web.UI.Client/src/less/main.less
@@ -210,10 +210,16 @@ h6.-black {
         clear: both;
     }
 }
+
+.umb-editor--infiniteMode .umb-control-group .control-header {
+    padding-bottom: 5px;
+}
+
 .form-horizontal .umb-control-group .control-header {
     float: left;
     width: 160px;
     padding-top: 5px;
+    padding-bottom: 0;
     text-align: left;
 
     .control-label {

From d539fdf4f6aaa5d6a34fd6233f93ccb232addaa0 Mon Sep 17 00:00:00 2001
From: Jan Skovgaard <1932158+BatJan@users.noreply.github.com>
Date: Tue, 23 Jun 2020 18:36:09 +0200
Subject: [PATCH 38/42] Add backdrop when menu items are opened (#8121)

---
 .../application/umbcontextmenu.directive.js   |  3 +-
 .../components/editor/umbeditors.directive.js | 25 +++++++++++++----
 .../umbcontextdialog.directive.js             |  3 +-
 .../components/tree/umbtree.directive.js      | 16 ++++++++++-
 .../components/tree/umbtreeitem.directive.js  |  2 +-
 .../src/common/services/navigation.service.js | 28 ++++++++++++++++---
 .../src/less/application/grid.less            |  4 +++
 .../content/content.create.controller.js      |  2 ++
 8 files changed, 69 insertions(+), 14 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbcontextmenu.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbcontextmenu.directive.js
index 8d1420b73e..32034818a3 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbcontextmenu.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbcontextmenu.directive.js
@@ -1,5 +1,5 @@
 angular.module("umbraco.directives")
-.directive('umbContextMenu', function (navigationService, keyboardService) {
+.directive('umbContextMenu', function (navigationService, keyboardService, backdropService) {
     return {
         scope: {
             menuDialogTitle: "@",
@@ -30,7 +30,6 @@ angular.module("umbraco.directives")
             scope.$on('$destroy', function () {
                 keyboardService.unbind("esc");
             });
-
         }
     };
 });
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditors.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditors.directive.js
index 9bdef41225..672b3fa286 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditors.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/umbeditors.directive.js
@@ -7,11 +7,12 @@
 
             var evts = [];
             var allowedNumberOfVisibleEditors = 3;
-            
+            var aboveBackDropCssClass = 'above-backdrop';
+            var sectionId = '#leftcolumn';
+            var isLeftColumnAbove = false;
             scope.editors = [];
             
             function addEditor(editor) {
-                
                 editor.inFront = true;
                 editor.moveRight = true;
                 editor.level = 0;
@@ -19,6 +20,14 @@
                                 
                 // push the new editor to the dom
                 scope.editors.push(editor);
+
+                if(scope.editors.length === 1){
+                    isLeftColumnAbove = $(sectionId).hasClass(aboveBackDropCssClass);
+
+                    if(isLeftColumnAbove){
+                        $(sectionId).removeClass(aboveBackDropCssClass);
+                    }
+                }
                 
                 $timeout(() => {
                     editor.moveRight = false;
@@ -32,14 +41,20 @@
             }
             
             function removeEditor(editor) {
-                
                 editor.moveRight = true;
                 
                 editor.animating = true;
                 setTimeout(removeEditorFromDOM.bind(this, editor), 400);
                 
                 updateEditors(-1);
-                
+
+                if(scope.editors.length === 1){
+                    if(isLeftColumnAbove){
+                        $('#leftcolumn').addClass(aboveBackDropCssClass);
+                    }
+
+                    isLeftColumnAbove = false;
+                }
             }
             
             function revealEditorContent(editor) {
@@ -57,7 +72,7 @@
                 if (index !== -1) {
                     scope.editors.splice(index, 1);
                 }
-                
+ 
                 updateEditors();
                 
                 scope.$digest();
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbcontextdialog/umbcontextdialog.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbcontextdialog/umbcontextdialog.directive.js
index 904a2ce8ca..3b753a371c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbcontextdialog/umbcontextdialog.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbcontextdialog/umbcontextdialog.directive.js
@@ -1,7 +1,7 @@
 (function() {
     'use strict';
 
-    function UmbContextDialog(navigationService, keyboardService, localizationService, overlayService) {
+    function UmbContextDialog(navigationService, keyboardService, localizationService, overlayService, backdropService) {
 
         function link($scope) {
 
@@ -23,6 +23,7 @@
             });
 
             function hide() {
+
                 if ($scope.dialog.confirmDiscardChanges) {
                     localizationService.localizeMany(["prompt_unsavedChanges", "prompt_unsavedChangesWarning", "prompt_discardChanges", "prompt_stay"]).then(
                         function (values) {
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtree.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtree.directive.js
index 5a7da80eff..0ccaf7b05c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtree.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtree.directive.js
@@ -3,7 +3,7 @@
 * @name umbraco.directives.directive:umbTree
 * @restrict E
 **/
-function umbTreeDirective($q, $rootScope, treeService, notificationsService, userService) {
+function umbTreeDirective($q, $rootScope, treeService, notificationsService, userService, backdropService) {
 
     return {
         restrict: 'E',
@@ -319,6 +319,18 @@ function umbTreeDirective($q, $rootScope, treeService, notificationsService, use
                 }
             }
 
+            // Close any potential backdrop and remove the #leftcolumn modifier class
+            function closeBackdrop() {
+                var aboveClass = 'above-backdrop';
+                var leftColumn = $('#leftcolumn');
+                var isLeftColumnOnTop = leftColumn.hasClass(aboveClass);
+
+                if(isLeftColumnOnTop){
+                    backdropService.close();
+                    leftColumn.removeClass(aboveClass);
+                }
+            }
+
             /** Returns the css classses assigned to the node (div element) */
             $scope.getNodeCssClass = function (node) {
                 if (!node) {
@@ -368,6 +380,8 @@ function umbTreeDirective($q, $rootScope, treeService, notificationsService, use
             */
             $scope.select = function (n, ev) {
 
+                closeBackdrop()
+                
                 if (n.metaData && n.metaData.noAccess === true) {
                     ev.preventDefault();
                     return;
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtreeitem.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtreeitem.directive.js
index 0a6eeb8835..8767de446a 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtreeitem.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/tree/umbtreeitem.directive.js
@@ -18,7 +18,7 @@
    </example>
  */
 angular.module("umbraco.directives")
-    .directive('umbTreeItem', function(treeService, $timeout, localizationService, eventsService, appState) {
+    .directive('umbTreeItem', function(treeService, $timeout, localizationService, eventsService, appState, navigationService) {
     return {
         restrict: 'E',
         replace: true,
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js b/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js
index da784a1f9e..f903c44ad5 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js
@@ -13,7 +13,7 @@
  * Section navigation and search, and maintain their state for the entire application lifetime
  *
  */
-function navigationService($routeParams, $location, $q, $injector, eventsService, umbModelMapper, treeService, appState) {
+function navigationService($routeParams, $location, $q, $injector, eventsService, umbModelMapper, treeService, appState, backdropService) {
 
     //the promise that will be resolved when the navigation is ready
     var navReadyPromise = $q.defer();
@@ -26,7 +26,10 @@ function navigationService($routeParams, $location, $q, $injector, eventsService
         navReadyPromise.resolve(mainTreeApi);
     });
 
-
+    eventsService.on('appState.backdrop', function(e, args){
+        var element = $(args.element);
+        element.addClass('above-backdrop');
+    });
 
     //A list of query strings defined that when changed will not cause a reload of the route
     var nonRoutingQueryStrings = ["mculture", "cculture", "csegment", "lq", "sr"];
@@ -113,6 +116,17 @@ function navigationService($routeParams, $location, $q, $injector, eventsService
         }
     }
 
+    function closeBackdrop() {
+        var aboveClass = 'above-backdrop';
+        var leftColumn = $('#leftcolumn');
+        var isLeftColumnOnTop = leftColumn.hasClass(aboveClass);
+
+        if(isLeftColumnOnTop){
+            backdropService.close();
+            leftColumn.removeClass(aboveClass);
+        }
+    }
+
     var service = {
 
         /**
@@ -410,12 +424,15 @@ function navigationService($routeParams, $location, $q, $injector, eventsService
          * @param {Event} event the click event triggering the method, passed from the DOM element
          */
         showMenu: function (args) {
-
             var self = this;
 
+            var backDropOptions = {
+                'element': $('#leftcolumn')[0]
+            };
+
             return treeService.getMenu({ treeNode: args.node })
                 .then(function (data) {
-
+                    backdropService.open(backDropOptions);
                     //check for a default
                     //NOTE: event will be undefined when a call to hideDialog is made so it won't re-load the default again.
                     // but perhaps there's a better way to deal with with an additional parameter in the args ? it works though.
@@ -466,6 +483,7 @@ function navigationService($routeParams, $location, $q, $injector, eventsService
             appState.setMenuState("currentNode", null);
             appState.setMenuState("menuActions", []);
             setMode("tree");
+            closeBackdrop();
         },
 
         /** Executes a given menu action */
@@ -650,6 +668,7 @@ function navigationService($routeParams, $location, $q, $injector, eventsService
             if (showMenu) {
                 this.showMenu({ skipDefault: true, node: appState.getMenuState("currentNode") });
             } else {
+                closeBackdrop();
                 setMode("default");
             }
         },
@@ -685,6 +704,7 @@ function navigationService($routeParams, $location, $q, $injector, eventsService
           */
         hideNavigation: function () {
             appState.setMenuState("menuActions", []);
+            closeBackdrop();
             setMode("default");
         }
     };
diff --git a/src/Umbraco.Web.UI.Client/src/less/application/grid.less b/src/Umbraco.Web.UI.Client/src/less/application/grid.less
index 0c6e790272..9e91da4792 100644
--- a/src/Umbraco.Web.UI.Client/src/less/application/grid.less
+++ b/src/Umbraco.Web.UI.Client/src/less/application/grid.less
@@ -80,6 +80,10 @@ body.umb-drawer-is-visible #mainwrapper{
   float: left;
   position: absolute;
   top: 0;
+
+  &.above-backdrop{
+      z-index: 7501;
+  }
 }
 
 #navigation {
diff --git a/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js b/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js
index fc7d38fd37..487a73f948 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js
@@ -92,6 +92,8 @@ function contentCreateController($scope,
         } else {
             createBlank(docType);
         }
+
+        navigationService.hideDialog();
     }
 
     function createFromBlueprint(blueprintId) {

From fe12f35d79edb2665707fc32f93c985f1a5701b0 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Mon, 25 May 2020 08:37:13 +0200
Subject: [PATCH 39/42] Parse complex RTE styles rules correctly

---
 .../src/common/services/tinymce.service.js                      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js b/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
index 66f0b110bf..41f240d3af 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
@@ -133,7 +133,7 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s
                         else if (rule.selector[0] !== "." && rule.selector.indexOf(".") > -1) {
                             var split = rule.selector.split(".");
                             r.block = split[0];
-                            r.classes = rule.selector.substring(rule.selector.indexOf(".") + 1).replace(".", " ");
+                            r.classes = rule.selector.substring(rule.selector.indexOf(".") + 1).replace(/\./g, " ");
                         }
                         else if (rule.selector[0] != "#" && rule.selector.indexOf("#") > -1) {
                             var split = rule.selector.split("#");

From b28bb9bb94b7bee8e9a353e79037dd9440599115 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Mon, 25 May 2020 15:01:44 +0200
Subject: [PATCH 40/42] Listview "Order by" should not contain removed
 properties

---
 .../listview/includeproperties.prevalues.controller.js     | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/includeproperties.prevalues.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/includeproperties.prevalues.controller.js
index 216f1555e2..2eced1f660 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/includeproperties.prevalues.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/includeproperties.prevalues.controller.js
@@ -53,10 +53,9 @@ function includePropsPreValsController($rootScope, $scope, localizationService,
         $scope.errorMsg = "";
     }
 
-    $scope.removeField = function(e) {
-        $scope.model.value = _.reject($scope.model.value, function (x) {
-            return x.alias === e.alias;
-        }); 
+    $scope.removeField = function (e) {
+        var index = $scope.model.value.indexOf(e);
+        $scope.model.value.splice(index, 1);
     }
 
     //now we'll localize these strings, for some reason the directive doesn't work inside of the select group with an ng-model declared

From 90a9ce4c5d82e1c1149bc72452b04a0b18a7657f Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Mon, 25 May 2020 16:20:30 +0200
Subject: [PATCH 41/42] Fix a few localizatoin glitches in the listview "Order
 by" selector

---
 .../listview/sortby.prevalues.controller.js   | 23 ++++++-------------
 1 file changed, 7 insertions(+), 16 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/sortby.prevalues.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/sortby.prevalues.controller.js
index 099c5fe0a0..0a81bb40e2 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/sortby.prevalues.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/sortby.prevalues.controller.js
@@ -46,7 +46,7 @@ function sortByPreValsController($rootScope, $scope, localizationService, editor
         var systemFields = [
             { value: "SortOrder", key: "general_sort" },
             { value: "Name", key: "general_name" },
-            { value: "VersionDate", key: "content_updateDate" },
+            { value: "UpdateDate", key: "content_updateDate" },
             { value: "Updater", key: "content_updatedBy" },
             { value: "CreateDate", key: "content_createDate" },
             { value: "Owner", key: "content_createBy" },
@@ -57,28 +57,19 @@ function sortByPreValsController($rootScope, $scope, localizationService, editor
         ];
         _.each(systemFields, function (e) {
             localizationService.localize(e.key).then(function (v) {
-
                 var sortByListValue = findFromSortByFields(e.value);
                 if (sortByListValue) {
                     sortByListValue.name = v;
-                    switch (e.value) {
-                        case "Updater":
-                            e.name += " (Content only)";
-                            break;
-                        case "Published":
-                            e.name += " (Content only)";
-                            break;
-                        case "Email":
-                            e.name += " (Members only)";
-                            break;
-                        case "Username":
-                            e.name += " (Members only)";
-                            break;
-                    }
                 }
             });
         });
 
+        _.each($scope.sortByFields, function (sortByField) {
+            if (!sortByField.name) {
+                sortByField.name = "(" + sortByField.value + ")";
+            }
+        });
+
         // Check existing model value is available in list and ensure a value is set
         var existingValue = findFromSortByFields($scope.model.value);
         if (existingValue) {

From ee7d62e58309031db6db4fc0f82ae6c2994db0ea Mon Sep 17 00:00:00 2001
From: Shannon Deminick <sdeminick@gmail.com>
Date: Wed, 24 Jun 2020 18:22:10 +1000
Subject: [PATCH 42/42] Fixes #7148 - ensures we only check for
 SurfaceController routes (#8322)

* See https://github.com/umbraco/Umbraco-CMS/issues/7148 for bug report and reason for fork and PR.

* Fixes #7148 - ensures we only check for SurfaceController routes

When finding the SurfaceController to post back to when using BeginUmbracoForm we weren't specifically checking for only SurfaceControllers routes since we just assumed it would be a SurfaceController route. This is problematic if using a SurfaceController simultaneously as an IRenderController with a custom front-end route since it will fail to find that controller to post back to. This is fixed by further filtering the controllers looked up to only include SurfaceControllers.

Co-authored-by: Colin Wiseman <sayhi@codeitwise.co.uk>
---
 src/Umbraco.Web/Mvc/RenderRouteHandler.cs | 45 +++++++++--------------
 1 file changed, 18 insertions(+), 27 deletions(-)

diff --git a/src/Umbraco.Web/Mvc/RenderRouteHandler.cs b/src/Umbraco.Web/Mvc/RenderRouteHandler.cs
index c30f83170b..64bdac669f 100644
--- a/src/Umbraco.Web/Mvc/RenderRouteHandler.cs
+++ b/src/Umbraco.Web/Mvc/RenderRouteHandler.cs
@@ -178,37 +178,28 @@ namespace Umbraco.Web.Mvc
             using (RouteTable.Routes.GetReadLock())
             {
                 Route surfaceRoute;
-                if (postedInfo.Area.IsNullOrWhiteSpace())
+
+                //find the controller in the route table
+                var surfaceRoutes = RouteTable.Routes.OfType<Route>()
+                                        .Where(x => x.Defaults != null &&
+                                                    x.Defaults.ContainsKey("controller") &&
+                                                    x.Defaults["controller"].ToString().InvariantEquals(postedInfo.ControllerName) &&
+                                                    // Only return surface controllers
+                                                    x.DataTokens["umbraco"].ToString().InvariantEquals("surface") &&
+                                                    // Check for area token if the area is supplied
+                                                    (postedInfo.Area.IsNullOrWhiteSpace() ? !x.DataTokens.ContainsKey("area") : x.DataTokens["area"].ToString().InvariantEquals(postedInfo.Area)))
+                                        .ToList();
+
+                // If more than one route is found, find one with a matching action
+                if (surfaceRoutes.Count > 1)
                 {
-                    //find the controller in the route table without an area
-                    var surfaceRoutes = RouteTable.Routes.OfType<Route>()
-                                                  .Where(x => x.Defaults != null &&
-                                                              x.Defaults.ContainsKey("controller") &&
-                                                              x.Defaults["controller"].ToString().InvariantEquals(postedInfo.ControllerName) &&
-                                                              x.DataTokens.ContainsKey("area") == false).ToList();
-
-                    // If more than one route is found, find one with a matching action
-                    if (surfaceRoutes.Count > 1)
-                    {
-                        surfaceRoute = surfaceRoutes.FirstOrDefault(x =>
-                            x.Defaults["action"] != null &&
-                            x.Defaults["action"].ToString().InvariantEquals(postedInfo.ActionName));
-                    }
-                    else
-                    {
-                        surfaceRoute = surfaceRoutes.SingleOrDefault();
-                    }
-
+                    surfaceRoute = surfaceRoutes.FirstOrDefault(x =>
+                        x.Defaults["action"] != null &&
+                        x.Defaults["action"].ToString().InvariantEquals(postedInfo.ActionName));
                 }
                 else
                 {
-                    //find the controller in the route table with the specified area
-                    surfaceRoute = RouteTable.Routes.OfType<Route>()
-                                             .SingleOrDefault(x => x.Defaults != null &&
-                                                                   x.Defaults.ContainsKey("controller") &&
-                                                                   x.Defaults["controller"].ToString().InvariantEquals(postedInfo.ControllerName) &&
-                                                                   x.DataTokens.ContainsKey("area") &&
-                                                                   x.DataTokens["area"].ToString().InvariantEquals(postedInfo.Area));
+                    surfaceRoute = surfaceRoutes.FirstOrDefault();
                 }
 
                 if (surfaceRoute == null)