Vaadin-combo-box: Doppelter Artikel bei der Suche

Erstellt am 27. März 2017  ·  14Kommentare  ·  Quelle: vaadin/vaadin-combo-box

Beschreibung

Doppelter Artikel bei der Suche

Erwartetes Ergebnis

Sollte nur ein Element anzeigen

capture d ecran 2017-03-27 a 00 58 46

Tatsächliches Ergebnis

capture d ecran 2017-03-27 a 00 43 54

Schritte zum Reproduzieren

  1. Fügen Sie ein vaadin-combo-box Element in die Seite ein
        <vaadin-combo-box #searchSport no-label-float
        *ngIf="activitiesTypes"
          placeholder="Activité"
          [items]="activitiesTypes"
          item-label-path="name"
          item-value-path="$key"
          [value]="activitiesTypeUid"
          (selected-item-changed)="activitiesType=$event.detail.value">
        </vaadin-combo-box>

mit

    this.activitiesTypes = [
      {
        $key : 'tennis',
        name: 'tennis'
      },
      {
        $key : 'canoe',
        name: 'canoe'
      }
    ];
  1. Öffnen Sie die Seite in einem Webbrowser.
  2. Klicken Sie auf die Eingabe des Elements vaadin-combo-box und suchen Sie nach einem Element.

Betroffene Browser

  • [x] Chrome
  • [ ] Feuerfuchs
  • [ ] Safari
  • [ ] Kante
  • [ ] IE 11
  • [ ] iOS Safari
  • [x] Android-Chrome

Es scheint nur in Chrome und Android Chrome zu sein. Ich habe auf Firefox, Safari getestet und es funktioniert.

Es funktionierte mit der Version v1.2.0 und der Fehler begann in v1.3.0

bug

Hilfreichster Kommentar

Danke für die Hilfe, hier ist ein Ausschnitt, um das Problem zu reproduzieren:
https://jsfiddle.net/Saulis/we90kg2t/

Alle 14 Kommentare

Hi!

Ich kann das Problem in einer reinen Polymer-App nicht reproduzieren, daher vermute ich, dass es etwas mit Angular zu tun hat. Siehe https://jsfiddle.net/Saulis/6kooy6d8/

Bekommst du irgendwelche Fehler in der Konsole?

Ihre jsfiddle funktioniert in meinem Browser.

Du hast also recht, es liegt an eckig. Haben Sie eine Vorlage mit Angular und Polymer für jsfiddle, um diesen Fehler zu reproduzieren?

Keine Fehler in der Konsole.

Ich habe einen Plunker mit Winkel und Polymer erstellt, aber es gibt keinen Fehler: https://plnkr.co/edit/pGqa0MXftgpMCSaAXCIO?p=preview

Ich werde weiter forschen, um die Ursache des Fehlers zu finden.

Ich erlebe dies auch mit Polymer 1.8.1 und Chrome. Scheint bei anderen Browsern kein Problem zu sein. Ich fange an zu glauben, dass es eine Race Condition in Chrome für größere Apps gibt, die dies verursacht. Um es noch einmal zu bestätigen, funktioniert gut mit vaadin-combo-box 1.2.0 & funktioniert nicht richtig in 1.3.3

@flyweight können Sie eine jsfiddle erstellen, bei der das Problem auftritt?

Ich versuche auch zu untersuchen, wo dies passieren könnte, erhalte aber die gleichen Ergebnisse wie bei

Nur um @Saulis zu beachten: Wenn ich Ihre Vorlage für den hier gezeigten Artikel verwende, sehe ich das Problem nicht. Es wird nur für mich angezeigt, wenn ich keine benutzerdefinierte Vorlage einfüge.

Ich habe das gleiche Problem wie @florent1933 und ich glaube, ich weiß, was das Problem ist. Ich verwende eine Polymer-CLI-Vorlage, die einige Polymer-Konfigurationsoptionen in der Datei index.html erstellt. Standardmäßig sieht es so aus:

window.Polymer = {
  dom: 'shadow',
  lazyRegister: true,
};

Die DOM-Eigenschaft ist standardmäßig auf 'shadow' gesetzt, aber wenn Sie sie auf 'shady' ändern, ist das Problem gelöst. Das Element dupliziert keine Elemente bei der Suche. Gibt es eine Möglichkeit, es mit 'shadow' zum Laufen zu bringen oder soll das Element nur mit 'shady' funktionieren?

Bestätigen Sie, was @Andres0101 oben angegeben hat, und ändern Sie diese Eigenschaft, um das Problem auch für mich zu

@Andres0101 : Gute Arbeit, um das Problem dieses Problems zu finden 👍

Es wäre toll, wenn Combobox mit Shadow Dom arbeiten kann, da ich Shady Dom nicht verwenden kann.

Danke für die Hilfe, hier ist ein Ausschnitt, um das Problem zu reproduzieren:
https://jsfiddle.net/Saulis/we90kg2t/

Ich weiß nicht, ob Sie es gesehen haben, aber wenn wir suchen, ist es nicht möglich, ein doppeltes Element mit dem Abwärtspfeil der Tastatur auszuwählen. Wollte diesen Punkt genau.

@LM450N : Du hast Recht! Erstaunliche Neuigkeiten!

Danke für @LM450N für das

Ich werde diese Ausgabe mit v2.0.0-alpha1 als geschlossen stempeln und empfehle, diese Ausgabe zu verwenden.

Für diejenigen, die 1.3.x , habe ich den Fix für den Branch 1.x – aber Vorsicht, es gibt einige grundlegende Änderungen in diesem Branch bezüglich der Verwendung von benutzerdefinierten Symbolen – sie verwenden slot -Attribute statt Klassen.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

heruan picture heruan  ·  14Kommentare

joostdebruijn picture joostdebruijn  ·  6Kommentare

OlliTietavainenVaadin picture OlliTietavainenVaadin  ·  6Kommentare

osamamaruf picture osamamaruf  ·  4Kommentare

steffen-harbich-cognitum picture steffen-harbich-cognitum  ·  8Kommentare