Fix focussing on erroneous fields

frontend/app/components/work-packages/wp-display-attr/wp-display-attr.directive.html

@@ -7,7 +7,7 @@
         ng-switch="$ctrl.displayType"
         ng-click="$ctrl.activateIfEditable($event)"
         data-click-on-keypress="[13, 32]"
-        focus
+        focus="$ctrl.shouldFocus()"
         ng-attr-tabindex="{{$ctrl.isEditable() ? '0' : '-1'}}"
         aria-labelledby="{{$ctrl.labelId}}">
     <progress-bar ng-switch-when="Percent"

frontend/app/components/work-packages/wp-display-attr/wp-display-attr.directive.ts

@@ -69,6 +69,10 @@ export class WorkPackageDisplayAttributeController {
     return this.wpEditField && this.wpEditField.isEditable;
   };
 
+  public shouldFocus() {
+    return this.wpEditField && this.wpEditField.shouldFocus();
+  }
+
   public get labelId():string {
     return 'wp-' + this.workPackage.id + '-display-attr-' + this.attribute + '-aria-label';
   }

frontend/app/components/wp-edit/field-types/wp-edit-boolean-field.directive.html

@@ -5,4 +5,5 @@
        ng-change="vm.submit()"
        ng-blur="vm.handleUserBlur()"
        focus="vm.shouldFocus()"
+       focus-priority="vm.shouldFocus()"
        ng-attr-id="{{vm.htmlId}}" />

frontend/app/components/wp-edit/field-types/wp-edit-date-field.directive.html

@@ -7,6 +7,7 @@
          type="text"
          class="wp-inline-edit--field"
          focus="vm.shouldFocus()"
+         focus-priority="vm.shouldFocus()"
          ng-attr-id="{{vm.htmlId}}" />
 
 </op-date-picker>

frontend/app/components/wp-edit/field-types/wp-edit-duration-field.directive.html

@@ -5,4 +5,5 @@
        duration-value
        ng-blur="vm.handleUserBlur()"
        focus="vm.shouldFocus()"
+       focus-priority="vm.shouldFocus()"
        ng-attr-id="{{vm.htmlId}}" />

frontend/app/components/wp-edit/field-types/wp-edit-float-field.directive.html

@@ -5,4 +5,5 @@
        ng-blur="vm.handleUserBlur()"
        float-value
        focus="vm.shouldFocus()"
+       focus-priority="vm.shouldFocus()"
        ng-attr-id="{{vm.htmlId}}" />

frontend/app/components/wp-edit/field-types/wp-edit-integer-field.directive.html

@@ -4,4 +4,5 @@
        ng-model="vm.workPackage[vm.fieldName]"
        ng-blur="vm.handleUserBlur()"
        focus="vm.shouldFocus()"
+       focus-priority="vm.shouldFocus()"
        ng-attr-id="{{vm.htmlId}}" />

frontend/app/components/wp-edit/field-types/wp-edit-select-field.directive.html

@@ -5,6 +5,7 @@
         ng-change="vm.submit()"
         ng-blur="vm.handleUserBlur()"
         focus="vm.shouldFocus()"
+        focus-priority="vm.shouldFocus()"
         ng-attr-id="{{vm.htmlId}}">
   <option value=""
           ng-bind="vm.field.text.requiredPlaceholder"

frontend/app/components/wp-edit/field-types/wp-edit-select-field.module.ts

@@ -46,11 +46,13 @@ export class SelectField extends Field {
     if (angular.isArray(this.schema.allowedValues)) {
       this.options = angular.copy(this.schema.allowedValues);
       this.addEmptyOption();
-    } else {
+    } else if (this.schema.allowedValues) {
       this.schema.allowedValues.$load().then((values) => {
         this.options = angular.copy(values.elements);
         this.addEmptyOption();
       });
+    } else {
+      this.options = [];
     }
   }
 

frontend/app/components/wp-edit/field-types/wp-edit-wiki-textarea-field.directive.html

@@ -7,6 +7,7 @@
           class="focus-input wp-inline-edit--field inplace-edit--textarea -animated"
           name="value"
           focus="vm.shouldFocus()"
+          focus-priority="vm.shouldFocus()"
           ng-hide="vm.field.isPreview"
           ng-disabled="vm.field.isBusy"
           ng-model="vm.field.fieldVal.raw"

frontend/app/components/wp-edit/wp-edit-field/wp-edit-field.directive.ts

@@ -79,17 +79,16 @@ export class WorkPackageEditFieldController {
     }
 
     this.formCtrl.updateWorkPackage()
-      .then(() => this.deactivate());
+      .finally(() => this.deactivate());
   }
 
   public deactivate() {
+    this._forceFocus = false;
     return this._active = false;
   }
 
-  public activate() {
-    if (this._active) {
-      return this.$q.when(true);
-    }
+  public activate(forceFocus = false) {
+    this._forceFocus = forceFocus;
 
     return this.buildEditField().then(() => {
       this._active = this.field.schema.writable;
@@ -149,7 +148,7 @@ export class WorkPackageEditFieldController {
   }
 
   public handleUserActivate() {
-    this.activate().then((active) => {
+    this.activate(true).then((active) => {
       // Display a generic error if the field turns out not to be editable,
       // despite the field being editable.
       if (this.isEditable && !active) {
@@ -162,12 +161,12 @@ export class WorkPackageEditFieldController {
   }
 
   public handleUserBlur(): boolean {
-    if (!this.active || this.inEditMode) {
+    if (this.inEditMode) {
       return;
     }
 
-    this._forceFocus = false;
     this.deactivate();
+
   }
 
   public handleUserCancel(focus) {
@@ -175,7 +174,12 @@ export class WorkPackageEditFieldController {
       return;
     }
 
-    return this.reset(focus);
+    // Close the field
+    this.reset();
+
+    // Keep focus on read value
+    this._forceFocus = true;
+    this.focusField();
   }
 
   /**
@@ -192,14 +196,10 @@ export class WorkPackageEditFieldController {
     this.$element.toggleClass('-error', error);
   }
 
-  public reset(focus = false) {
+  public reset() {
     this.workPackage.restoreFromPristine(this.fieldName);
     this.fieldForm.$setPristine();
     this.deactivate();
-
-    if (focus) {
-      this.focusField();
-    }
   }
 
   protected buildEditField(): ng.IPromise<any> {

frontend/app/components/wp-edit/wp-edit-form.directive.ts

@@ -166,7 +166,7 @@ export class WorkPackageEditFormController {
     if (attributes.length === 0) return;
 
     // Allow additional error handling
-    this.errorHandler({
+    this.firstActiveField = this.errorHandler({
       workPackage: this.workPackage,
       fields: this.fields,
       attributes: attributes
@@ -181,7 +181,9 @@ export class WorkPackageEditFormController {
       });
 
       // Activate + Focus on first field
-      this.firstActiveField = attributes[0];
+      if (!this.firstActiveField) {
+        this.firstActiveField = attributes[0];
+      }
 
       // Activate that field
       // TODO: For inplace-edit, this may be undefined

frontend/app/components/wp-table/wp-table.directive.ts

@@ -238,6 +238,7 @@ function wpTable(
       });
 
         QueryService.setSelectedColumns(selected);
+        return _.find(selected, (column) => errorFieldNames.indexOf(column) !== -1);
       };
 
       /** Save callbacks for work package */