Barista: [Поле фильтра] не отображаются предложения в MS Edge

Созданный на 4 сент. 2020  ·  13Комментарии  ·  Источник: dynatrace-oss/barista

Сообщение об ошибке


При нажатии на поле фильтра в версии MS Edge без использования хрома предложения по фильтрам не отображаются. Кроме того, при вводе не появляется кнопка «Очистить все». Вместо этого есть довольно неприятный «X», очищающий ввод (см. Снимок экрана).

Это происходит только тогда, когда приложение скомпилировано с помощью View Engine, а не Ivy.

Ожидаемое поведение


При нажатии на поле фильтра предложения должны отображаться в раскрывающемся компоненте, как и в других браузерах.

Текущее поведение


При нажатии на поле фильтра в MS Edge не открывается раскрывающийся компонент с предложениями фильтров. Вместо раскрывающегося списка можно увидеть небольшую рамку (см. Снимок экрана).

Действия по воспроизведению


  1. Отключите Angular Ivy в tsconfig приложения:
  "angularCompilerOptions": {
    "enableIvy": false
  }
  1. Щелкните поле фильтра в любой версии MS Edge, отличной от хрома.
  2. Предлагаемые значения не отображаются

Контекст (среда)


Используемые версии:

  • угловой : 10.0.9
  • @ угловой / cdk : 10.1.1
  • @ dynatrace / бариста-компоненты : 8.0.0

Вложения

Странный X вместо «очистить все»

image (5)

Нет раскрывающегося списка, но граница видна

image (4)

Ожидаемое поведение Firefox

image (7)

Актуальное поведение MS Edge

image (6)

bug filter-field has-pr

Самый полезный комментарий

Поскольку это кажется ошибкой IntersectionObserver для Edge <= 16, я сейчас думаю об отключении выделения для этих браузеров. Это сделало бы его, по крайней мере, пригодным для использования.
Пожалуйста, дайте мне знать, что вы думаете об этом «решении».

Все 13 Комментарий

Провел расследование Edge 16 на компьютере с Windows 10, и ни один FilterField ничего не отображает в автозаполнении:

image
image

@samuelfahrngruber ваше поведение не воспроизводится, так как в Edge версии 18 автозаполнение отображается правильно.

@lukasholzer Вы используете образцы на https://barista.dynatrace.com/? потому что они отлично работают и в Edge 18.
Однако проблема возникает только с новой версией 8.0.0 компонентов barista, а примеры на https://barista.dynatrace.com/ не используют v8.0.0.

В настоящее время я не могу создать локальный пример с полем фильтра и barista 8.0.0, так как я всегда получаю сообщение об ошибке при создании нового проекта только с полем фильтра на странице:

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;
           ~~~~~~~~

Должен ли я сообщить об этой проблеме еще раз?

Кроме того, я не могу предоставить пример stackblitz, потому что он вообще не работает с MS Edge.

РЕДАКТИРОВАТЬ: я создал ошибку для этой проблемы # 1577

Кажется, проблема с dt-highlight на Edge.

Компонент выделения, который используется внутри каждой опции автозаполнения, не отображает выделенный текст.

Похоже, это связано с IntersectionObserver, который используется в компоненте выделения. Наблюдатель не стреляет по краю после первоначального рендеринга, когда открывается оверлей и становятся видимыми первые параметры.

Все остальные браузеры работают по назначению.
Странно то, что IntersectionObserver поддерживается начиная с Edge 15.

Проблема возникает после обновления с версии 7.5.1 до 8.0.0 , ранее у нас не было никаких проблем.

В настоящее время проверяется, связано ли это каким-либо образом с проблемой № 1420 (PR № 1433), где эта область кода была затронута последней.

Поскольку это кажется ошибкой IntersectionObserver для Edge <= 16, я сейчас думаю об отключении выделения для этих браузеров. Это сделало бы его, по крайней мере, пригодным для использования.
Пожалуйста, дайте мне знать, что вы думаете об этом «решении».

Для меня это звучит разумно - я голосую за это.

Поскольку это кажется ошибкой IntersectionObserver для Edge <= 16, я сейчас думаю об отключении выделения для этих браузеров. Это сделало бы его, по крайней мере, пригодным для использования.
Пожалуйста, дайте мне знать, что вы думаете об этом «решении».

Возможно, также для других версий Edge без хрома.
У меня проблема также возникает с Edge 18.

Точная версия:

Microsoft Edge 44.19041.423.0
Microsoft EdgeHTML 18.19041

Хороший момент - то же самое в моих тестах.

{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: screenResolution : 1600x1200, Zal: TZ : Европа / Вена}

Я спрашиваю, почему мы использовали его, если у нас нет поддержки браузера. 🤔 AFAIK мы должны поддерживать все версии Edge или?
https://caniuse.com/intersectionobserver

@thomaspink есть ли обновления по этой ошибке?

После дальнейшего исследования ошибка возникает только тогда, когда вместо Ivy используется старый View Engine.
Воспроизводится при отключении плюща

  "angularCompilerOptions": {
    "enableIvy": false
  }

и щелкнув поле фильтра в MS Edge.

Была ли эта страница полезной?
0 / 5 - 0 рейтинги