Feature/3887 maned ed required for new group

cms/sass/main.scss

@@ -69,6 +69,7 @@
   "pages/search",
   "pages/sponsors",
   "pages/uploadmetadata",
+  "pages/editorgroup",
 
   "themes/dashboard",
   "themes/editorial-form",

cms/sass/pages/_editorgroup.scss

@@ -0,0 +1,20 @@
+.editor_group_form {
+  &--error {
+    margin-top: -1.5rem; //move visually into question-container
+    margin-bottom: $spacing-04;
+
+      color: $sanguine;
+
+      &:before {
+        display: inline-block;
+        margin-right: $spacing-01;
+        content: '';
+        background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 4.6V7M7 9.4H7.006M4.516 1H9.484L13 4.516V9.484L9.484 13H4.516L1 9.484V4.516L4.516 1Z' stroke='%23982E0A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
+        background-repeat: no-repeat;
+        height: 14px;
+        width: 14px;
+      }
+
+  }
+
+}

doajtest/testbook/administrative_search/editor_groups.yml

@@ -80,4 +80,43 @@ tests:
     - The name is not editable.
   - step: Do any other changes and the save the changes
     results:
-    - Changes saved successfully
+    - Changes saved successfully
+- title: Test New Editor Group Form
+  context:
+    role: admin
+  steps:
+    - step: go to a new Editor Group form at /admin/editor_group
+      results:
+      - An Editor group form is rendered with 4 fields - "Group Name", "Managin Editor", "Editor" and "Associate Editors"
+    - step: without putting any data click "Save group" button
+      results:
+      - First input "Group name" is focused and the message "Please fill in this field" is displayed
+    - step: add a name to the Group Name field
+    - step: click "Save group" button
+      results:
+      - Error is displayed under "Managing Editor" field and "Editor" group
+    - step:  click on the "Managing Editor" field
+      results:
+      - a search input is displayed with "Please enter 1 or more character" prompt under the input
+    - step: start typing a name in the input
+      results:
+      - a list of matching names is display in a dropdown below the input
+    - step: choose one of the names
+    - step: click "Save group" button
+      results:
+      - The error under the "Managing Editor" field dissapears
+      - The error under the "Editor" field is still displayed
+    - step: choose and editor
+    - step: click "Save group" button
+      results:
+      - Group is successfully created
+    - step: Open new form at /admin/editor_group
+    - step: click on the "Associate Editors"
+      results:
+      - The "Please enter 1 or more character" prompt is displayed
+    - step: type a name and choose one account from the list
+      results:
+      - the name is added to the "Associate Editors" input
+    - step: add another name to the input
+      results:
+      - it is possible to add more than one account to the "Associate Editors" input

portality/templates-v2/management/admin/editor_group.html

@@ -8,7 +8,8 @@
             {% include "includes/_error_header.html" %}
             {% from "includes/_formhelpers.html" import render_field_horizontal %}
 
-            <form method="post" action="{{ url_for('admin.editor_group') }}{% if form.group_id.data and form.group_id.data != '' %}/{{form.group_id.data}}{% endif %}" class="form form--compact" id="editor_group_form">
+            <!-- form requires novalidate to prevent the browser from trying to focus invalid fields - hidden by select2; validation handled by WTForm at the backend -->
+            <form method="post" action="{{ url_for('admin.editor_group') }}{% if form.group_id.data and form.group_id.data != '' %}/{{form.group_id.data}}{% endif %}" class="form form--compact editor_group_form" id="editor_group_form"  novalidate>
                 <fieldset>
                     {{ form.group_id }}
                     {% if form.name.data %}
@@ -17,7 +18,13 @@
                     {% endif %}
                     {{ render_field_horizontal(form.name, placeholder="Enter a unique group name") }}
                     {{ render_field_horizontal(form.maned, placeholder="Managing Editor’s user ID") }}
+                    {% if form.maned_error %}
+                            <p class="editor_group_form--error">Please provide a managing editor for the group.</p>
+                    {% endif %}
                     {{ render_field_horizontal(form.editor, placeholder="Editor’s user ID") }}
+                    {% if form.editor_error %}
+                            <p class="editor_group_form--error">Please provide an editor for the group.</p>
+                    {% endif %}
                     {{ render_field_horizontal(form.associates, placeholder="Associate editor user IDs") }}
                     <button class="button button--primary" type="submit">Save Group</button>
                 </fieldset>
@@ -55,6 +62,7 @@
         });
 
         $("#editor").select2({
+            allowClear: true,
             minimumInputLength: 1,
             query : function(query) {
                 userAutocomplete(query.term, query.callback)

portality/view/forms.py

@@ -94,7 +94,7 @@ class EditorGroupForm(Form):
     """
     group_id = HiddenField("Group ID", [validators.Optional()])
     name = StringField("Group Name", [validators.DataRequired(), UniqueGroupName()])
-    maned = StringField("Managing Editor", [validators.Optional(), MustHaveRole("admin")])
+    maned = StringField("Managing Editor", [validators.DataRequired(), MustHaveRole("admin")])
     editor = StringField("Editor", [validators.DataRequired(), NotRole("publisher")])
     associates = StringField("Associate Editors", [validators.Optional(), NotRole("publisher")])