public-ui / kolibri

The accessible HTML-Standard
https://public-ui.github.io
European Union Public License 1.2
162 stars 33 forks source link

🐞 Bug: Fokussetzung innerhalb einer KoliBri-Komponente wird durch display: "none" verhindert #6817

Open mweiershaeuser opened 2 weeks ago

mweiershaeuser commented 2 weeks ago

Link to the code that reproduces this issue:

https://stackblitz.com/edit/vitejs-vite-fy7pct?file=src%2FApp.tsx

Can you categorise where the error occurs?

React

Which browser or operating system do you used to test KoliBri?

Chrome

How to reproduce issue?

  1. Ref auf Element setzen (useRef), das in einer KoliBri-Komponente liegt (z. B. Inhalte in KolAlert).
    1. Fokus programmatisch auf das Element setzen.

Current vs. Expected:

Erwartet: Fokus wird gesetzt. Beobachtet: Fokus wird nicht gesetzt. Dies scheint dadurch verhindert zu werden, dass die KoliBri-Komponente eine display: "none" inne hat, bis sie bereit ist zu rendern, wodurch der Fokus ins Leere läuft.

Environment informations:

bash StackBlitz, Chrome, Windows

Hinweis: Hier ist zu prüfen, ob eine Anpassung im adopted-style-sheets-Package vorgenommen werden muss.

mweiershaeuser commented 2 weeks ago

Wir haben als Workaround in der CoP ausprobiert, den display-Style des Ref-Elements per Hand zu setzen, um display: "none" zu überschreiben. Im StackBlitz-Beispiel klappt das. Leider funktioniert der Workaround in der von uns entwickelten Anwendung aus bislang unerklärlichen Gründen nicht.