Skip to content

Commit

Permalink
Revert "feat(a11y): add attribute role="img" to the svg element (#750)"
Browse files Browse the repository at this point in the history
This reverts commit 8b9edc4.
  • Loading branch information
pachuka committed Oct 26, 2022
1 parent b385279 commit 1382232
Show file tree
Hide file tree
Showing 8 changed files with 60 additions and 258 deletions.
24 changes: 12 additions & 12 deletions packages/babel-preset/src/index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ describe('preset', () => {
).toMatchInlineSnapshot(`
"import * as React from \\"react\\";
const SvgComponent = () => <svg role=\\"img\\" foo=\\"bar\\" x={y} />;
const SvgComponent = () => <svg foo=\\"bar\\" x={y} />;
export default SvgComponent;"
`)
Expand All @@ -45,7 +45,7 @@ describe('preset', () => {
const SvgComponent = ({
title,
titleId
}) => <svg role=\\"img\\" aria-labelledby={titleId}>{title ? <title id={titleId}>{title}</title> : null}</svg>;
}) => <svg aria-labelledby={titleId}>{title ? <title id={titleId}>{title}</title> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -62,7 +62,7 @@ describe('preset', () => {
const SvgComponent = ({
title,
titleId
}) => <svg role=\\"img\\" aria-labelledby={titleId}>{title === undefined ? <title id={titleId}>Hello</title> : title ? <title id={titleId}>{title}</title> : null}</svg>;
}) => <svg aria-labelledby={titleId}>{title === undefined ? <title id={titleId}>Hello</title> : title ? <title id={titleId}>{title}</title> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -77,7 +77,7 @@ describe('preset', () => {
const SvgComponent = ({
title,
titleId
}) => <svg role=\\"img\\" aria-labelledby={titleId}>{title === undefined ? <title id={titleId}>{\\"Hello\\"}</title> : title ? <title id={titleId}>{title}</title> : null}</svg>;
}) => <svg aria-labelledby={titleId}>{title === undefined ? <title id={titleId}>{\\"Hello\\"}</title> : title ? <title id={titleId}>{title}</title> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -94,7 +94,7 @@ describe('preset', () => {
const SvgComponent = ({
desc,
descId
}) => <svg role=\\"img\\" aria-describedby={descId}>{desc ? <desc id={descId}>{desc}</desc> : null}</svg>;
}) => <svg aria-describedby={descId}>{desc ? <desc id={descId}>{desc}</desc> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -111,7 +111,7 @@ describe('preset', () => {
const SvgComponent = ({
desc,
descId
}) => <svg role=\\"img\\" aria-describedby={descId}>{desc === undefined ? <desc id={descId}>Hello</desc> : desc ? <desc id={descId}>{desc}</desc> : null}</svg>;
}) => <svg aria-describedby={descId}>{desc === undefined ? <desc id={descId}>Hello</desc> : desc ? <desc id={descId}>{desc}</desc> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -126,7 +126,7 @@ describe('preset', () => {
const SvgComponent = ({
desc,
descId
}) => <svg role=\\"img\\" aria-describedby={descId}>{desc === undefined ? <desc id={descId}>{\\"Hello\\"}</desc> : desc ? <desc id={descId}>{desc}</desc> : null}</svg>;
}) => <svg aria-describedby={descId}>{desc === undefined ? <desc id={descId}>{\\"Hello\\"}</desc> : desc ? <desc id={descId}>{desc}</desc> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -146,7 +146,7 @@ describe('preset', () => {
titleId,
desc,
descId
}) => <svg role=\\"img\\" aria-labelledby={titleId} aria-describedby={descId}>{desc ? <desc id={descId}>{desc}</desc> : null}{title ? <title id={titleId}>{title}</title> : null}</svg>;
}) => <svg aria-labelledby={titleId} aria-describedby={descId}>{desc ? <desc id={descId}>{desc}</desc> : null}{title ? <title id={titleId}>{title}</title> : null}</svg>;
export default SvgComponent;"
`)
Expand All @@ -163,7 +163,7 @@ describe('preset', () => {
).toMatchInlineSnapshot(`
"import * as React from \\"react\\";
const SvgComponent = () => <svg a=\\"black\\" b={props.white} role=\\"img\\" />;
const SvgComponent = () => <svg a=\\"black\\" b={props.white} />;
export default SvgComponent;"
`)
Expand All @@ -179,7 +179,7 @@ describe('preset', () => {
).toMatchInlineSnapshot(`
"import * as React from \\"react\\";
const SvgComponent = props => <svg a=\\"#000\\" b=\\"#fff\\" width=\\"1em\\" height=\\"1em\\" role=\\"img\\" {...props} />;
const SvgComponent = props => <svg a=\\"#000\\" b=\\"#fff\\" width=\\"1em\\" height=\\"1em\\" {...props} />;
export default SvgComponent;"
`)
Expand All @@ -195,7 +195,7 @@ describe('preset', () => {
).toMatchInlineSnapshot(`
"import * as React from \\"react\\";
const SvgComponent = props => <svg a=\\"#000\\" b=\\"#fff\\" width={24} height={24} role=\\"img\\" {...props} />;
const SvgComponent = props => <svg a=\\"#000\\" b=\\"#fff\\" width={24} height={24} {...props} />;
export default SvgComponent;"
`)
Expand All @@ -213,7 +213,7 @@ describe('preset', () => {
"import * as React from \\"react\\";
import Svg from \\"react-native-svg\\";
const SvgComponent = props => <Svg a=\\"#000\\" b=\\"#fff\\" width={24} height={24} accessibilityRole=\\"image\\" {...props} />;
const SvgComponent = props => <Svg a=\\"#000\\" b=\\"#fff\\" width={24} height={24} {...props} />;
export default SvgComponent;"
`)
Expand Down
12 changes: 1 addition & 11 deletions packages/babel-preset/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -49,17 +49,7 @@ function replaceMapToValues(replaceMap: { [key: string]: string }): Value[] {

const plugin = (_: ConfigAPI, opts: Options) => {
let toRemoveAttributes = ['version']
let toAddAttributes: Attribute[] = [
opts?.native === true
? {
name: 'accessibilityRole',
value: 'image',
}
: {
name: 'role',
value: 'img',
},
]
let toAddAttributes: Attribute[] = []

if (opts.svgProps) {
toAddAttributes = [...toAddAttributes, ...propsToAttributes(opts.svgProps)]
Expand Down
Loading

0 comments on commit 1382232

Please sign in to comment.