ryersondmp / sa11y

Sa11y is an accessibility quality assurance tool that visually highlights common accessibility and usability issues. Geared towards content authors, Sa11y straightforwardly identifies errors or warnings at the source with a simple tooltip on how to fix them.

Home Page:https://sa11y.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Outline text detection

brianteeman opened this issue · comments

How to reproduce

Create a basic html page as below and use the sa11y bookmark

<html lang="en">
    <head>
        <title>Language Check H1</title>
    </head>
    <body>
        <h1>
            <svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
                <style>
                  circle {
                    fill: gold;
                    stroke: maroon;
                    stroke-width: 2px;
                  }
                </style>
                <circle cx="5" cy="5" r="4" />
            </svg>
             test
	</h1>
    </body>
</html>

Expected Result

image

Actual Result

image

Huh. I thought I excluded <style> tags already, I should also test <noscript> too while I'm at it. Thanks for the bug report @brianteeman, I'll have this fixed shortly!

Fixed!