microsoft
FilterBar flickers and doesnt actually open if embedded in material ui
I am trying to embed the sarif component in material UI full-screen dialog. However every time I click on anything in the filter bar it flickers open and closed.
I tried looking at azure-devops-ui package, however, the GitHub repo is private and only the package is published.
@jeffersonking, would love if you might be able to point me in the right direction on how I can debug and then potentially send a fix.
My guess based on looking at code in the node_modues folder is that DropdownCallout has a setTimeout that is doing funky things.
I haven't had a chance to investigate yet, but if the root cause is DropdownCallout then that's something I don't have direct control over (even though that team is also inside Microsoft).
@jeffersonking, is there any reason the repo is private while the npm module is published? would you be able to ask them?
also would you be open to me submitting using a different dropdown filter which doesn't depend on az-devops-ui?
My contacts might be out-of-date, but @nkirchem works on that project and may be able to answer.
Regarding "submitting using a different dropdown filter", we use this internally as a DevOps Extension and thus would prefer to keep the current component(s). We have also done accessibility testing for this set of components. Switching to a new one (even if visually compatible) would require re-testing.
Any ways we could workaround this issue?
@jeffersonking, what if we made an optional param that allows swapping out the dropdown?
@nkirchem if the code for azure-devops-ui could be opened up on GitHub (the npm module makes it available anyway) then ti would be easier to contribute a fix
fwiw, it isnt rreally a flicker, but basically the filter box doesn't open at all.
it opens and closes immediately
@roopakv I'd recommend exhausting other options before adding (and forward-maintaining) a dropdown option. Do you happen to have a repro I could look at? If you already have Material UI set up that could help me out. Thanks.
@jeffersonking it is in a private repo, but I can try to make a minimal repro.
FWIW it happens only when opened in a fullscreen dialog, otherwise, it works fine on material.
https://material-ui.com/components/dialogs/#full-screen-dialogs
I thought it was z-index related but it didn't seem to be