Issue #2846428 by othermachines, michielnugter, vaplas, dagmar, John Cook, Lendude, droplet: Views add dialog filter searches on label instead of title

core/modules/views_ui/js/views-admin.js

@@ -483,18 +483,18 @@
      *   An array of all the filterable options.
      */
     getOptions: function ($allOptions) {
-      var $label;
+      var $title;
       var $description;
       var $option;
       var options = [];
       var length = $allOptions.length;
       for (var i = 0; i < length; i++) {
         $option = $($allOptions[i]);
-        $label = $option.find('label');
+        $title = $option.find('.title');
         $description = $option.find('.description');
         options[i] = {
-          // Search on the lowercase version of the label text + description.
-          searchText: $label.text().toLowerCase() + ' ' + $description.text().toLowerCase(),
+          // Search on the lowercase version of the title text + description.
+          searchText: $title.text().toLowerCase() + ' ' + $description.text().toLowerCase(),
           // Maintain a reference to the jQuery object for each row, so we don't
           // have to create a new object inside the performance-sensitive keyup
           // handler.

core/modules/views_ui/tests/modules/views_ui_test_field/views_ui_test_field.info.yml

@@ -0,0 +1,8 @@
+name: 'Views test field'
+type: module
+description: 'Add custom global field for testing purposes.'
+package: Testing
+version: VERSION
+core: 8.x
+dependencies:
+  - views_ui

core/modules/views_ui/tests/modules/views_ui_test_field/views_ui_test_field.module

@@ -0,0 +1,18 @@
+<?php
+
+/**
+ * @file
+ * ViewsUI Test field module.
+ */
+
+use Drupal\Core\Form\FormStateInterface;
+
+/**
+ * Implements hook_form_FORM_ID_alter() for views_ui_add_handler_form.
+ *
+ * Changes the label for one of the tests fields to validate this label is not
+ * searched on.
+ */
+function views_ui_test_field_form_views_ui_add_handler_form_alter(&$form, FormStateInterface $form_state) {
+  $form['options']['name']['#options']['views.views_test_field_1']['title']['data']['#title'] .= ' FIELD_1_LABEL';
+}

core/modules/views_ui/tests/modules/views_ui_test_field/views_ui_test_field.views.inc

@@ -0,0 +1,29 @@
+<?php
+
+/**
+ * @file
+ * Provide views data for testing purposes.
+ */
+
+/**
+ * Implements hook_views_data().
+ */
+function views_ui_test_field_views_data() {
+
+  $data['views']['views_test_field_1'] = [
+    'title' => t('Views test field 1 - FIELD_1_TITLE'),
+    'help' => t('Field 1 for testing purposes - FIELD_1_DESCRIPTION'),
+    'field' => [
+      'id' => 'views_test_field_1',
+    ],
+  ];
+  $data['views']['views_test_field_2'] = [
+    'title' => t('Views test field 2 - FIELD_2_TITLE'),
+    'help' => t('Field 2 for testing purposes - FIELD_2_DESCRIPTION'),
+    'field' => [
+      'id' => 'views_test_field_2',
+    ],
+  ];
+
+  return $data;
+}

core/modules/views_ui/tests/src/FunctionalJavascript/FilterOptionsTest.php

@@ -0,0 +1,76 @@
+<?php
+
+namespace Drupal\Tests\views_ui\FunctionalJavascript;
+
+use Drupal\FunctionalJavascriptTests\JavascriptTestBase;
+
+/**
+ * Tests the JavaScript filtering of options in add handler form.
+ *
+ * @group views_ui
+ */
+class FilterOptionsTest extends JavascriptTestBase {
+
+  /**
+   * {@inheritdoc}
+   */
+  public static $modules = ['node', 'views', 'views_ui', 'views_ui_test_field'];
+
+  /**
+   * {@inheritdoc}
+   */
+  public function setUp() {
+    parent::setUp();
+
+    $admin_user = $this->drupalCreateUser([
+      'administer views',
+    ]);
+    $this->drupalLogin($admin_user);
+  }
+
+  /**
+   * Tests filtering options in the 'Add fields' dialog.
+   */
+  public function testFilterOptionsAddFields() {
+    $this->drupalGet('admin/structure/views/view/content');
+
+    $session = $this->getSession();
+    $web_assert = $this->assertSession();
+    $page = $session->getPage();
+
+    // Open the dialog.
+    $page->clickLink('views-add-field');
+
+    // Wait for the popup to open and the search field to be available.
+    $options_search = $web_assert->waitForField('override[controls][options_search]');
+
+    // Test that the both special fields are visible.
+    $this->assertTrue($page->findField('name[views.views_test_field_1]')->isVisible());
+    $this->assertTrue($page->findField('name[views.views_test_field_2]')->isVisible());
+
+    // Test the ".title" field in search.
+    $options_search->setValue('FIELD_1_TITLE');
+    $page->waitFor(10, function () use ($page) {
+      return !$page->findField('name[views.views_test_field_2]')->isVisible();
+    });
+    $this->assertTrue($page->findField('name[views.views_test_field_1]')->isVisible());
+    $this->assertFalse($page->findField('name[views.views_test_field_2]')->isVisible());
+
+    // Test the ".description" field in search.
+    $options_search->setValue('FIELD_2_DESCRIPTION');
+    $page->waitFor(10, function () use ($page) {
+      return !$page->findField('name[views.views_test_field_1]')->isVisible();
+    });
+    $this->assertTrue($page->findField('name[views.views_test_field_2]')->isVisible());
+    $this->assertFalse($page->findField('name[views.views_test_field_1]')->isVisible());
+
+    // Test the "label" field not in search.
+    $options_search->setValue('FIELD_1_LABEL');
+    $page->waitFor(10, function () use ($page) {
+      return !$page->findField('name[views.views_test_field_2]')->isVisible();
+    });
+    $this->assertFalse($page->findField('name[views.views_test_field_2]')->isVisible());
+    $this->assertFalse($page->findField('name[views.views_test_field_1]')->isVisible());
+  }
+
+}