Fix dropdown position when loading remote data

Also fixes flaky spec

app/assets/javascripts/gl_dropdown.js

@@ -335,6 +335,10 @@ GitLabDropdown = (function() {
               _this.fullData = data;
               _this.parseData(_this.fullData);
               _this.focusTextInput();
+
+              // Update dropdown position since remote data may have changed dropdown size
+              _this.dropdown.find('.dropdown-menu-toggle').dropdown('update');
+
               if (
                 _this.options.filterable &&
                 _this.filter &&

app/assets/stylesheets/framework/dropdowns.scss

@@ -570,10 +570,10 @@
 }
 
 .dropdown-menu-close {
-  right: 5px;
+  top: $gl-padding-4;
+  right: $gl-padding-8;
   width: 20px;
   height: 20px;
-  top: -1px;
 }
 
 .dropdown-menu-close-icon {

changelogs/unreleased/61639-flaky-spec-issue-boards-labels-creates-project-label-spec-features-boards-sidebar_spec-rb-350.yml

+---
+title: Fix dropdown position when loading remote data
+merge_request: 28526
+author:
+type: fixed

spec/features/boards/sidebar_spec.rb

@@ -352,6 +352,8 @@ describe 'Issue Boards', :js do
 
       page.within('.labels') do
         click_link 'Edit'
+        wait_for_requests
+
         click_link 'Create project label'
         fill_in 'new_label_name', with: 'test label'
         first('.suggest-colors-dropdown a').click
@@ -368,6 +370,8 @@ describe 'Issue Boards', :js do
 
       page.within('.labels') do
         click_link 'Edit'
+        wait_for_requests
+
         click_link 'Create project label'
         fill_in 'new_label_name', with: 'test label'
         first('.suggest-colors-dropdown a').click