What Happened

If using autocomplete in a textfield, on Drupal titles (article and page titles etc), then when you start typing in the text field, and select a suggestion, the textfield is populated as expected, but with double quotes either side of the chosen string.

Expected

I expect the textfield, in the example above, to be populated without double quotes.

To Reproduce

I did a clean install of 8.4 using the git / composer method, i.e.:

  1. git clone --branch 8.4.x https://git.drupal.org/project/drupal.git drupal_autocomplete
  2. composer install

I then proceeded to run the install via a web browser.

I tested the autocomplete with my own custom module, which creates a custom form with the autocomplete field set up. In 8.2 the issue doesn't occur (no double quotes), but in 8.4 the double quote issue occurs.

The build form function in my module is as follows:

    public function buildForm(array $form, FormStateInterface $form_state)
    {
        $form = array();

        $form['input_fields']['nid'] = array
        (
            '#type' => 'textfield',
            '#title' => t('Location'),
            '#autocomplete_route_name' => 'test_autocomplete.autocomplete',
            //'#description' => t('Node Add/Edit type block'),
            '#default' => ($form_state->isValueEmpty('nid')) ? null : (Xss::filter($form_state->getValue('nid'))),
            '#required' => true,
            '#placeholder' => 'e.g. Type a search term',
        );

        $form['submit'] = array
        (
            '#type' => 'submit',
            '#value' => t('Search'),
        );

        return $form;
    }

The autocomplete callback in my other custom module, is part of the controller class:

  public function autocomplete(request $request)
  {
    $matches = array();
    $search_string = $request->query->get('q');
    if ($search_string)
    {
      $matches = array();
      $query = \Drupal::entityQuery('node')
      ->condition('status', 1)
      ->condition('title', '%'.db_like($search_string).'%', 'LIKE');
      //->condition('field_tags.entity.name', 'node_access');
      $nids = $query->execute();
      $result = entity_load_multiple('node', $nids);
      // IMPORTANT: the indices of $matches must be sequential, i.e. 0, 1, 2, 3
      // and not 5, 103, 12, 14 or even 5, 12, 14, 103. If the indices are
      // not sequential, JsonResponse() will return a Json object and not
      // a string, which will break the autocomplete when the form field
      // receives it.
      $index = 0;
      foreach ($result as $row)
      {
        $found_text = $row->title->value;
        // Sanitise the text for security purposes.
        $matches[$index++] = Xss::filter($found_text);
      }
    }
    return new JsonResponse($matches);
  }

So just to confirm, it works in 8.2 but not in 8.4.

Comments

CatsFromStonehenge created an issue. See original summary.

cilefen’s picture

Issue summary: View changes
FileSize
32.96 KB

Does the tag have commas in its name? If so, that is how it is supposed to work. Again, if so, I tested in 8.2.x and 8.4.x and the behavior is identical.

cilefen’s picture

Issue summary: View changes
FileSize
41.59 KB

Oh, I see now:

The last one was autocompleted and has extra quotes. I'm going to check more carefully against 8.2.x now.

cilefen’s picture

8.2.x definitely does the same thing in my tests but not 7.x. I may have just found a new/old bug in taxonomy, something like #1000736: Term reference autocomplete widget having problems handling terms with commas. Your situation could be different. Please comment, we may need yet another issue.

droplet’s picture

Component: other » entity_reference.module
Priority: Normal » Major
Issue tags: +JavaScript, +Needs JS testing, +JavaScriptTest

wow. We introduced this bug as early as the first rewrite this script to jQuery UI Autocomplete.
#675446: Use jQuery UI Autocomplete

start from this patch:
https://www.drupal.org/node/675446#comment-6239496

It seems ONE comma and TWO commas have given different result on different versions when you publish a node with re-tagging (I need some more testing)
"Apple, Orange"
"Mammals, Apes, Monkeys"

(May not only the FRONTEND issue.)

CatsFromStonehenge’s picture

Hi again!

I've done some more testing, and you're right about the commas.

This problem occurs on 8.2 as well as 8.4 after all.

So the testing needs to include titles with and without commas, such as:

  • Mammals, Apes, Monkeys
  • Hello - Adele

If you select Mammals, Apes, Monkeys then the double quotes are inserted about the text when the textfield is populated. If you select Hello - Adele the quotes are correctly omitted. This doesn't seem to originate in the autocomplete functionality, but from outside... I'm not sure where!

Apologies for not spotting this earlier. I had different sample data in the two projects, but when I used the same sample test data (a better approach let's face it!)... then the problem occurred consistently in 8.2 and 8.4. I was thrown off the scent as I had initially been modifying the autocomplete code for a usability upgrade.

Let me know if I can be of any assistance, I'll do by best to help out.

droplet’s picture

To fix the problem from frontend is quite simple.

Needs to ensure we have never done any BACKEND hack for it between v8.0.x ~ v8.4.x

droplet’s picture

amateescu’s picture

Component: entity_reference.module » ajax system
Status: Active » Reviewed & tested by the community
Issue tags: -Needs JS testing, -JavaScriptTest
FileSize
1.03 KB

I tried to write a JS test for this but I couldn't reproduce the problem in it, even though I manually tested the patch and I can confirm the issue and the fix in two browsers, Firefox and Chromium.

The fix is correct because we already enclose autocomplete terms with quotes on the PHP side with \Drupal\Component\Utility\Tags::encode() everywhere.

Rerolled the patch to take #2809281: Use ES6 for core JavaScript development into account.