Add test for inline creation of versions from within WP view && adapt tests to new component

frontend/src/app/modules/boards/board/add-list-modal/add-list-modal.html

@@ -19,9 +19,11 @@
             <div class="form--select-container">
               <label class="form--label" [textContent]="actionService.localizedName"></label>
               <ndc-dynamic [ndcDynamicComponent]="autocompleterComponent()"
-                           [ndcDynamicInputs]="{ availableValues: availableValues, appendTo: 'body', model: '' }"
-                           [ndcDynamicOutputs]="referenceOutputs"
-                           [ndcDynamicAttributes]="{ class: 'new-list--action-select' }">
+                           [ndcDynamicInputs]="{ availableValues: availableValues,
+                                                 appendTo: 'body',
+                                                 model: '',
+                                                 classes: 'new-list--action-select' }"
+                           [ndcDynamicOutputs]="referenceOutputs">
               </ndc-dynamic>
             </div>
           </div>

frontend/src/app/modules/common/autocomplete/create-autocompleter.component.ts

@@ -40,6 +40,7 @@ import {HalResource} from "core-app/modules/hal/resources/hal-resource";
                #addActionAttributeSelect
                [(ngModel)]="model"
                [items]="availableValues"
+               [ngClass]="classes"
                [addTag]="createNewElement.bind(this)"
                [virtualScroll]="true"
                [required]="required"
@@ -61,6 +62,7 @@ import {HalResource} from "core-app/modules/hal/resources/hal-resource";
                #actionAttributeSelect
                [(ngModel)]="model"
                [items]="availableValues"
+               [ngClass]="classes"
                [virtualScroll]="true"
                [required]="required"
                [clearable]="!required"
@@ -86,6 +88,7 @@ export class CreateAutocompleterComponent implements AfterViewInit {
   @Input() public required:boolean = false;
   @Input() public disabled:boolean = false;
   @Input() public id:string = '';
+  @Input() public classes:string = '';
   @Input() public set createAllowed(val:boolean) {
     this._createAllowed = val;
     setTimeout(() => {

frontend/src/app/modules/common/autocomplete/version-autocompleter.component.ts

@@ -43,6 +43,10 @@ import {I18nService} from "core-app/modules/common/i18n/i18n.service";
                           [createAllowed]="createAllowed"
                           [appendTo]="appendTo"
                           [model]="model"
+                          [required]="required"
+                          [disabled]="disabled"
+                          [id]="id"
+                          [classes]="classes"
                           (create)="createNewVersion($event)"
                           (onChange)="changeModel($event)"
                           (onOpen)="opened()"

frontend/src/app/modules/fields/edit/field-types/select-edit-field.component.html

@@ -5,7 +5,7 @@
                                    required: required,
                                    disabled: inFlight,
                                    id: handler.htmlId,
-                                   createAllowed: false }"
-             [ndcDynamicOutputs]="referenceOutputs"
-             [ndcDynamicAttributes]="{ class: 'wp-inline-edit--field' }">
+                                   createAllowed: false,
+                                   classes: 'wp-inline-edit--field' }"
+             [ndcDynamicOutputs]="referenceOutputs">
 </ndc-dynamic>

spec/features/custom_fields/multi_user_custom_field_spec.rb

@@ -17,7 +17,7 @@ describe "multi select custom values", js: true do
 
   let(:cf_edit_field) do
     field = wp_page.edit_field "customField#{custom_field.id}"
-    field.field_type = 'ng-select'
+    field.field_type = 'create-autocompleter'
     field
   end
 

spec/features/custom_fields/multi_value_custom_field_spec.rb

@@ -23,7 +23,7 @@ describe "multi select custom values", clear_cache: true, js: true do
 
   def table_edit_field(work_package)
     field = wp_table.edit_field work_package, "customField#{custom_field.id}"
-    field.field_type = 'ng-select'
+    field.field_type = 'create-autocompleter'
     field
   end
 
@@ -65,7 +65,7 @@ describe "multi select custom values", clear_cache: true, js: true do
     describe 'in single view' do
       let(:edit_field) do
         field = wp_page.edit_field "customField#{custom_field.id}"
-        field.field_type = 'ng-select'
+        field.field_type = 'create-autocompleter'
         field
       end
 

spec/features/work_packages/details/custom_fields/custom_field_spec.rb

@@ -76,12 +76,12 @@ describe 'custom field inplace editor', js: true do
     let(:custom_fields) { [custom_field1, custom_field2] }
     let(:field1) do
       f = wp_page.custom_edit_field(custom_field1)
-      f.field_type = 'ng-select'
+      f.field_type = 'create-autocompleter'
       f
     end
     let(:field2) do
       f = wp_page.custom_edit_field(custom_field2)
-      f.field_type = 'ng-select'
+      f.field_type = 'create-autocompleter'
       f
     end
     let(:initial_custom_values) { {} }

spec/features/work_packages/details/inplace_editor/version_editor_spec.rb

@@ -31,24 +31,59 @@ describe 'subject inplace editor', js: true, selenium: true do
   let(:property_name) { :version }
   let(:work_package) { FactoryBot.create :work_package, project: project }
   let(:user) { FactoryBot.create :admin }
+  let(:second_user) { FactoryBot.create :user, member_in_project: project, member_through_role: role }
+  let(:role) { FactoryBot.create(:role, permissions: %i[view_work_packages edit_work_packages]) }
   let(:work_package_page) { Pages::FullWorkPackage.new(work_package) }
 
-  before do
-    login_as(user)
-  end
+  context 'with admin permissions' do
+    before do
+      login_as(user)
+    end
+
+    it 'renders hierarchical versions' do
+      work_package_page.visit!
+      work_package_page.ensure_page_loaded
+
+      field = work_package_page.work_package_field(:version)
+      field.activate!
+
+      options = field.all(".ng-option-label")
+
+      expect(options.map(&:text)).to eq(['-', version3.name, version2.name, version.name])
 
-  it 'renders hierarchical versions' do
-    work_package_page.visit!
-    work_package_page.ensure_page_loaded
+      options[1].select_option
+      field.expect_state_text(version3.name)
+    end
+
+    it 'allows creating versions from within the WP view' do
+      work_package_page.visit!
+      work_package_page.ensure_page_loaded
+
+      field = work_package_page.work_package_field(:version)
+      field.activate!
+
+      field.set_new_value 'Super cool new release'
+      field.expect_state_text 'Super cool new release'
+
+      visit settings_project_path(project, tab: 'versions')
+      expect(page).to have_content 'Super cool new release'
+    end
+  end
 
-    field = work_package_page.work_package_field(:version)
-    field.activate!
+  context 'without the permission to manage versions' do
+    before do
+      login_as(second_user)
+    end
 
-    options = field.all(".ng-option-label")
+    it 'does not allow creating versions from within the WP view' do
+      work_package_page.visit!
+      work_package_page.ensure_page_loaded
 
-    expect(options.map(&:text)).to eq(['-', version3.name, version2.name, version.name])
+      field = work_package_page.work_package_field(:version)
+      field.activate!
 
-    options[1].select_option
-    field.expect_state_text(version3.name)
+      field.input_element.find('input').set 'Version that does not exist'
+      expect(page).not_to have_selector('.ng-option', text: 'Create new: Version that does not exist')
+    end
   end
 end

spec/features/work_packages/new/new_work_package_spec.rb

@@ -186,6 +186,7 @@ describe 'new work package', js: true do
           expect(page).to have_selector(".customField#{ids.last} ng-select")
 
           cf = wp_page.edit_field "customField#{ids.last}"
+          cf.field_type = 'create-autocompleter'
           cf.openSelectField
           cf.set_value 'foo'
           save_work_package!(false)

spec/features/work_packages/table/edit_work_packages_spec.rb

@@ -181,7 +181,7 @@ describe 'Inline editing work packages', js: true do
       cf_text.update('my custom text', expect_failure: true)
 
       cf_list = wp_table.edit_field(work_package, "customField#{custom_fields.first.id}")
-      cf_list.field_type = 'ng-select'
+      cf_list.field_type = 'create-autocompleter'
       cf_list.openSelectField
       cf_list.set_value('bar')
 

spec/features/work_packages/table/switch_types_spec.rb

@@ -299,7 +299,7 @@ describe 'Switching types in work package table', js: true do
 
     let(:cf_edit_field) do
       field = wp_page.edit_field "customField#{custom_field.id}"
-      field.field_type = 'select'
+      field.field_type = 'create-autocompleter'
       field
     end
 

spec/support/pages/work_packages/abstract_work_package.rb

@@ -59,7 +59,7 @@ module Pages
     def custom_edit_field(custom_field)
       edit_field("customField#{custom_field.id}").tap do |field|
         if custom_field.list?
-          field.field_type = :select
+          field.field_type = 'create-autocompleter'
         end
       end
     end

spec/support/work_packages/work_package_field.rb

@@ -121,8 +121,7 @@ class WorkPackageField
   # For fields of type select, will check for an option with that value.
   def set_value(content)
     scroll_to_element(input_element)
-
-    if input_element.tag_name == 'ng-select'
+    if field_type == 'create-autocompleter'
       page.find('.ng-dropdown-panel .ng-option', text: content).click
     else
       input_element.set(content)
@@ -135,7 +134,7 @@ class WorkPackageField
   def unset_value(content, multi=false)
     scroll_to_element(input_element)
 
-    if input_element.tag_name == 'ng-select'
+    if field_type == 'create-autocompleter'
       if multi
         page.find('.ng-value-label', text: content).sibling('.ng-value-icon').click
       else
@@ -146,6 +145,15 @@ class WorkPackageField
     end
   end
 
+  ##
+  # Use option of ng-select field to create new element from within the autocompleter
+  def set_new_value(content)
+    scroll_to_element(input_element)
+    input_element.find('input').set content
+
+    page.find('.ng-option', text: 'Create new: ' + content).click
+  end
+
   def type(text)
     scroll_to_element(input_element)
     input_element.send_keys text
@@ -162,13 +170,13 @@ class WorkPackageField
       set_value value
 
       # select fields are saved on change
-      save! if save && field_type != 'ng-select'
+      save! if save && field_type != 'create-autocompleter'
       expect_state! open: expect_failure
     end
   end
 
   def submit_by_enter
-    if field_type == 'ng-select'
+    if field_type == 'create-autocompleter'
       autocomplete_selector.send_keys :return
     else
       input_element.native.send_keys :return
@@ -176,7 +184,7 @@ class WorkPackageField
   end
 
   def cancel_by_escape
-    if field_type == 'ng-select'
+    if field_type == 'create-autocompleter'
       autocomplete_selector.send_keys :escape
     else
       input_element.native.send_keys :escape
@@ -210,7 +218,7 @@ class WorkPackageField
            'type',
            'version',
            'category'
-        'ng-select'
+        'create-autocompleter'
       else
         :input
       end.to_s

spec/support/work_packages/work_package_multi_select_field.rb

@@ -19,7 +19,7 @@ class WorkPackageMultiSelectField < WorkPackageField
   end
 
   def field_type
-    'ng-select'
+    'create-autocompleter'
   end
 
   def control_link(action = :save)