display: table CSS styling causing an a11y error

[swese44]

Describe the bug We're seeing a11y error "An Element of the the given control type must support the Grid Pattern and Table Pattern". More info on that here: https://docs.microsoft.com/en-us/windows/win32/winauto/uiauto-controlpatternmapping

To Reproduce Steps to reproduce the behavior:

1. Inspect the DOM of SimpleBar
2. See display: block on 2 pseudo-elements

Expected behavior Elements should fully support control patterns their "role" describes. Display "table" being the table role in this case.

Additional context Replacing display: table with display: block seems to work fine. Is there a reason this style is using display: table? It almost looks like an old-school clearfix, but it's not actually clearing anything.

CSS styles here: https://github.com/Grsmto/simplebar/blob/master/packages/simplebar/src/simplebar.css#L66-L70

Your environment

Software	Version(s)
SimpleBar	simplebar-react 2.3.0
Browser	Edge 99.0.1150.55
Operating System	Mac OS Monterey