Microsoft Edge - Outline not applied to SVG elements

Issue #12527853 • Assigned to Bogdan B.

Details

Author
Joshua F.
Created
Jun 28, 2017
Privacy
This issue is public.
Found in
  • Microsoft Edge
  • Internet Explorer
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

Issue

Edge (found in v40.15063.0.0) doesn’t render CSS outlines around SVG elements.
This is also an issue in IE11.

Steps to Reproduce

Open Codepen in Edge: https://codepen.io/anon/pen/bRYyEQ

Expected

Red outline around rectangle

Actual

No outline

If you open the Codepen in Chrome or Firefox the outline is rendered.

Why this matters to me

Accessibility.
We adopt Highcharts which uses SVG to render complex charts.
They’ve added an accessibility module allowing keyboard users to navigate to individual chart elements. Those elements render outlines on focus in all browsers except IE and Edge.
Here’s an example chart. Just tab through the document. You’ll see outlines around the pie slices in Chrome/Firefox but not in IE/Edge.

Attachments

0 attachments

    Comments and activity

    • Changed Steps to Reproduce

    • Microsoft Edge Team

      Changed Assigned To to “Bogdan B.”

    • Any update here? My team is continuing to see bugs filed against us for this issue.

    You need to sign in to your Microsoft account to add a comment.

    Sign in