Barista: [Filterfeld] zeigt keine Vorschläge in MS Edge an

Erstellt am 4. Sept. 2020  ·  13Kommentare  ·  Quelle: dynatrace-oss/barista

Fehlerbericht


Wenn Sie in der Nicht-Chrom-Version von MS Edge in das Filterfeld klicken, werden keine Filtervorschläge angezeigt. Außerdem wird beim Tippen die Schaltfläche "Alles löschen" nicht angezeigt. Stattdessen gibt es ein ziemlich schlecht aussehendes "X", das die Eingabe löscht (siehe Screenshot).

Dies geschieht jedoch nur, wenn die App mit View Engine anstelle von Ivy kompiliert wird.

Erwartetes Verhalten


Beim Klicken in das Filterfeld sollen Vorschläge wie in anderen Browsern in einer Dropdown-Komponente angezeigt werden.

Aktuelles Verhalten


Ein Klick in das Filterfeld in MS Edge öffnet keine Dropdown-Komponente mit den Filtervorschlägen. Anstelle des Dropdowns ist ein kleiner Rand zu sehen (siehe Screenshot).

Schritte zum Reproduzieren


  1. Deaktivieren Sie Angular Ivy in der tsconfig der App:
  "angularCompilerOptions": {
    "enableIvy": false
  }
  1. Klicken Sie in einer beliebigen Nicht-Chrom-Version von MS Edge in das Filterfeld.
  2. Es werden keine Vorschlagswerte angezeigt

Kontext (Umgebung)


Gebrauchte Versionen:

  • eckig : 10.0.9
  • @angular/cdk : 10.1.1
  • @dynatrace/barista-components : 8.0.0

Anhänge

Seltsames X statt "alles löschen"

image (5)

Kein Dropdown, aber Rahmen sichtbar

image (4)

Erwartetes Verhalten Firefox

image (7)

Tatsächliches Verhalten MS Edge

image (6)

bug filter-field has-pr

Hilfreichster Kommentar

Da es sich um einen IntersectionObserver Bug für Edge <=16 zu handeln scheint, überlege ich derzeit, die Hervorhebung für diese Browser zu deaktivieren. Damit wäre es zumindest brauchbar.
Bitte teilen Sie mir Ihre Gedanken zu dieser "Lösung" mit.

Alle 13 Kommentare

Habe eine Untersuchung zu Edge 16 auf einem Windows 10- Computer durchgeführt und kein FilterField zeigt etwas in der Autovervollständigung an:

image
image

@samuelfahrngruber dein Verhalten ist nicht reproduzierbar, da in Edge Version 18 die Autovervollständigung korrekt angezeigt wird.

@lukasholzer Verwenden Sie die Beispiele auf https://barista.dynatrace.com/? weil sie bei mir auch in Edge 18 gut funktionieren.
Das Problem tritt jedoch nur mit der neuen Version 8.0.0 der barista-Komponenten auf und die Beispiele auf https://barista.dynatrace.com/ verwenden nicht v8.0.0.

Ich bin derzeit nicht in der Lage, ein lokales Beispiel mit dem Filterfeld und barista 8.0.0 zu erstellen, da ich beim Erstellen eines neuen Projekts mit nur einem Filterfeld auf der Seite immer eine Fehlermeldung bekomme:

ERROR in node_modules/@dynatrace/barista-components/button-group/src/button-group.d.ts:35:9 - error TS2611: 'disabled' is defined as a property in class 'HasTabIndex & DtButtonGroupBase', but is overridden here in 'DtButtonGroup<T>' as an accessor.
35     get disabled(): boolean;
           ~~~~~~~~
node_modules/@dynatrace/barista-components/button-group/src/button-group.d.ts:76:9 - error TS2611: 'disabled' is defined as a property in class 'HasTabIndex & CanColor<DtButtonGroupThemePalette> & DtButtonGroupItemBase', but is overridden here in 'DtButtonGroupItem<T>' as an accessor.
76     get disabled(): boolean;
           ~~~~~~~~

Sollte ich einen weiteren Fehler für dieses Problem melden?

Außerdem kann ich kein Stackblitz-Beispiel bereitstellen, da es mit MS Edge überhaupt nicht funktioniert.

EDIT: Ich habe einen Fehler für dieses Problem erstellt #1577

Scheint ein Problem mit dt-highlight auf Edge zu sein.

Die Highlight-Komponente, die in jeder Option für die Autovervollständigung verwendet wird, rendert den hervorgehobenen Text nicht.

Es scheint mit dem 'IntersectionObserver' zusammenzuhängen, der in der Highlight-Komponente verwendet wird. Der Beobachter feuert nach dem anfänglichen Rendern nicht auf Kante, wenn die Überlagerung geöffnet wird und die ersten Optionen sichtbar werden.

Alle anderen Browser funktionieren wie vorgesehen.
Das Seltsame ist, dass IntersectionObserver seit Edge 15 unterstützt wird

Das Problem tritt nach dem Update von Version 7.5.1 auf 8.0.0 auf , vorher hatten wir keine Probleme.

Derzeit wird überprüft, ob dies irgendwie mit Problem Nr. 1420 (PR Nr. 1433) zusammenhängt, bei dem dieser Codebereich zuletzt berührt wurde.

Da es sich um einen IntersectionObserver Bug für Edge <=16 zu handeln scheint, überlege ich derzeit, die Hervorhebung für diese Browser zu deaktivieren. Damit wäre es zumindest brauchbar.
Bitte teilen Sie mir Ihre Gedanken zu dieser "Lösung" mit.

Klingt vernünftig für mich - ich stimme dafür.

Da es sich um einen IntersectionObserver Bug für Edge <=16 zu handeln scheint, überlege ich derzeit, die Hervorhebung für diese Browser zu deaktivieren. Damit wäre es zumindest brauchbar.
Bitte teilen Sie mir Ihre Gedanken zu dieser "Lösung" mit.

Vielleicht auch für andere Edge-Versionen ohne Chrom.
Bei mir tritt das Problem auch bei Edge 18 auf.

Genaue Version:

Microsoft Edge 44.19041.423.0
Microsoft EdgeHTML 18.19041

Guter Punkt - das gleiche in meinen Tests.

{browserName: MicrosoftEdge, browserVersion: 44.18362.449.0, javascriptEnabled: true, pageLoadStrategy: normal, platform: WINDOWS, platformName: WINDOWS, setWindowRect: false, timeouts: {implicit: 0, pageLoad: 300000, script: 30000}, , zal: Bildschirmauflösung : 1600x1200, zal:tz : Europa/Wien}

Ich frage mich, warum wir es verwendet haben, wenn wir keine Browserunterstützung dafür haben. 🤔 AFAIK müssen wir alle Edge-Versionen unterstützen oder?
https://caniuse.com/intersectionobserver

@thomaspink irgendwelche Updates zu diesem Fehler?

Nach weiterer Untersuchung tritt der Fehler nur auf, wenn die alte View Engine anstelle von Ivy verwendet wird.
Reproduzierbar durch Deaktivieren von Ivy

  "angularCompilerOptions": {
    "enableIvy": false
  }

und klicken Sie in das Filterfeld in MS Edge.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen