fix(utils): make SVGO not remove title

[erickzhao]

Motivation

By default, SVGR removes the <title> tag from SVG inputs. This hinders a11y since "the <title> element provides an accessible, short-text description of any SVG container element or graphics element."

See: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/title

The <title> tag can be set via the SVG React component's title prop, but it's unintuitive that existing <title> tags from the SVG files themselves get stripped beforehand.

This will not break behaviour for existing users since the title prop seems to override the image's default <title> tag if set according to the SVGR API docs:

If titleProp is set to true and no title is provided (title={undefined}) at render time, this will fallback to an existing title element in the svg if exists.

See: https://react-svgr.com/docs/options/#title

Have you read the Contributing Guidelines on pull requests?

Yes

Test Plan

Updated the existing test at packages/docusaurus-utils/src/__tests__/webpackUtils.test.ts.

Related PRs

N/A

[netlify]

✔️ [V2]
Built without sensitive environment variables

🔨 Explore the source changes: aa63e1c

🔍 Inspect the deploy log: https://app.netlify.com/sites/docusaurus-2/deploys/620b5512fb025d0008fd5ede

😎 Browse the preview: https://deploy-preview-6684--docusaurus-2.netlify.app

[github-actions]

⚡️ Lighthouse report for the changes in this PR:

Category	Score
🔴 Performance	49
🟢 Accessibility	100
🟢 Best practices	100
🟢 SEO	100
🟢 PWA	92

Lighthouse ran on https://deploy-preview-6684--docusaurus-2.netlify.app/

[Josh-Cena]

Was wondering, last time I checked, aria-labelledby is the one that helps with a11y, and title is more of a supplement; I guess it's just because title can be more ergonomically embeded in the SVG?

[erickzhao]

aria-labelledby is the one that helps with a11y, and title is more of a supplement;

Hope this isn't an anti-pattern, but I have a use-case where I'm displaying an SVG icon without an element that labels it, so aria-labelledby doesn't exactly work.

[Josh-Cena]

Yeah, I just checked, seems in SVG land title does help with a11y. All good then