Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: prevent removing the namespace by svgr ([#475](https://github.co… #498

Merged
merged 1 commit into from
Nov 14, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/babel-preset/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ function replaceMapToValues(replaceMap) {
}

const plugin = (api, opts) => {
let toRemoveAttributes = ['xmlns', 'xmlnsXlink', 'version']
let toRemoveAttributes = ['version']
let toAddAttributes = []

if (opts.svgProps) {
Expand Down
109 changes: 85 additions & 24 deletions packages/cli/src/__snapshots__/index.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ exports[`cli should not override config with cli defaults 1`] = `
"import * as React from \\"react\\";

function SvgFile() {
return <svg viewBox=\\"0 0 48 1\\"><title>{\\"Rectangle 5\\"}</title><desc>{\\"Created with Sketch.\\"}</desc><defs /><g id=\\"Page-1\\" stroke=\\"none\\" strokeWidth={1} fill=\\"none\\" fillRule=\\"evenodd\\"><g id=\\"19-Separator\\" transform=\\"translate(-129.000000, -156.000000)\\" fill=\\"#063855\\"><g id=\\"Controls/Settings\\" transform=\\"translate(80.000000, 0.000000)\\"><g id=\\"Content\\" transform=\\"translate(0.000000, 64.000000)\\"><g id=\\"Group\\" transform=\\"translate(24.000000, 56.000000)\\"><g id=\\"Group-2\\"><rect id=\\"Rectangle-5\\" x={25} y={36} width={48} height={1} /></g></g></g></g></g></g></svg>;
return <svg viewBox=\\"0 0 48 1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlnsXlink=\\"http://www.w3.org/1999/xlink\\"><title>{\\"Rectangle 5\\"}</title><desc>{\\"Created with Sketch.\\"}</desc><defs /><g id=\\"Page-1\\" stroke=\\"none\\" strokeWidth={1} fill=\\"none\\" fillRule=\\"evenodd\\"><g id=\\"19-Separator\\" transform=\\"translate(-129.000000, -156.000000)\\" fill=\\"#063855\\"><g id=\\"Controls/Settings\\" transform=\\"translate(80.000000, 0.000000)\\"><g id=\\"Content\\" transform=\\"translate(0.000000, 64.000000)\\"><g id=\\"Group\\" transform=\\"translate(24.000000, 56.000000)\\"><g id=\\"Group-2\\"><rect id=\\"Rectangle-5\\" x={25} y={36} width={48} height={1} /></g></g></g></g></g></g></svg>;
}

export default SvgFile;
Expand All @@ -23,7 +23,12 @@ exports[`cli should support --prettier-config as file 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -39,7 +44,12 @@ exports[`cli should support --prettier-config as json 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -55,7 +65,7 @@ exports[`cli should support --svgo-config as file 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<title>{'Rectangle 5'}</title>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
Expand All @@ -72,7 +82,7 @@ exports[`cli should support --svgo-config as json 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<title>{'Rectangle 5'}</title>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
Expand Down Expand Up @@ -138,7 +148,7 @@ exports[`cli should support stdin filepath 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -154,7 +164,7 @@ exports[`cli should support various args: --expand-props none 1`] = `

function SvgFile() {
return (
<svg width={48} height={1}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\">
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -170,7 +180,7 @@ exports[`cli should support various args: --expand-props start 1`] = `

function SvgFile(props) {
return (
<svg {...props} width={48} height={1}>
<svg {...props} width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\">
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -186,7 +196,13 @@ exports[`cli should support various args: --icon 1`] = `

function SvgFile(props) {
return (
<svg width=\\"1em\\" height=\\"1em\\" viewBox=\\"0 0 48 1\\" {...props}>
<svg
width=\\"1em\\"
height=\\"1em\\"
viewBox=\\"0 0 48 1\\"
xmlns=\\"http://www.w3.org/2000/svg\\"
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -203,7 +219,7 @@ import Svg, { Path } from 'react-native-svg'

function SvgFile() {
return (
<Svg width={48} height={1}>
<Svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\">
<Path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</Svg>
)
Expand All @@ -220,7 +236,13 @@ import Svg, { Path } from 'react-native-svg'

function SvgFile(props) {
return (
<Svg width=\\"1em\\" height=\\"1em\\" viewBox=\\"0 0 48 1\\" {...props}>
<Svg
width=\\"1em\\"
height=\\"1em\\"
viewBox=\\"0 0 48 1\\"
xmlns=\\"http://www.w3.org/2000/svg\\"
{...props}
>
<Path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</Svg>
)
Expand All @@ -237,7 +259,13 @@ import Svg, { Path } from 'react-native-svg'

function SvgFile(props, svgRef) {
return (
<Svg width={48} height={1} ref={svgRef} {...props}>
<Svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
ref={svgRef}
{...props}
>
<Path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</Svg>
)
Expand All @@ -255,7 +283,7 @@ import Svg, { Path } from 'react-native-svg'

function SvgFile(props) {
return (
<Svg width={48} height={1} {...props}>
<Svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<Path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</Svg>
)
Expand All @@ -271,7 +299,7 @@ exports[`cli should support various args: --no-dimensions 1`] = `

function SvgFile(props) {
return (
<svg viewBox=\\"0 0 48 1\\" {...props}>
<svg viewBox=\\"0 0 48 1\\" xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -286,7 +314,7 @@ exports[`cli should support various args: --no-prettier 1`] = `
"import * as React from \\"react\\";

function SvgFile(props) {
return <svg width={48} height={1} {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;
return <svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;
}

export default SvgFile;
Expand All @@ -298,7 +326,14 @@ exports[`cli should support various args: --no-svgo 1`] = `

function SvgFile(props) {
return (
<svg width=\\"48px\\" height=\\"1px\\" viewBox=\\"0 0 48 1\\" {...props}>
<svg
width=\\"48px\\"
height=\\"1px\\"
viewBox=\\"0 0 48 1\\"
xmlns=\\"http://www.w3.org/2000/svg\\"
xmlnsXlink=\\"http://www.w3.org/1999/xlink\\"
{...props}
>
<title>{'Rectangle 5'}</title>
<desc>{'Created with Sketch.'}</desc>
<defs />
Expand Down Expand Up @@ -339,7 +374,13 @@ exports[`cli should support various args: --ref 1`] = `

function SvgFile(props, svgRef) {
return (
<svg width={48} height={1} ref={svgRef} {...props}>
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
ref={svgRef}
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -356,7 +397,7 @@ exports[`cli should support various args: --replace-attr-values "#063855=current

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"currentColor\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -372,7 +413,14 @@ exports[`cli should support various args: --svg-props "hidden={true},id=hello" 1

function SvgFile(props) {
return (
<svg width={48} height={1} hidden={true} id=\\"hello\\" {...props}>
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
hidden={true}
id=\\"hello\\"
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -388,7 +436,13 @@ exports[`cli should support various args: --title-prop 1`] = `

function SvgFile({ title, titleId, ...props }) {
return (
<svg width={48} height={1} aria-labelledby={titleId} {...props}>
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
aria-labelledby={titleId}
{...props}
>
{title ? <title id={titleId}>{title}</title> : null}
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
Expand All @@ -415,6 +469,7 @@ function SvgFile(
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
ref={svgRef}
aria-labelledby={titleId}
{...props}
Expand All @@ -439,7 +494,13 @@ function SvgFile(
svgRef?: React.Ref<SVGSVGElement>,
) {
return (
<svg width={48} height={1} ref={svgRef} {...props}>
<svg
width={48}
height={1}
xmlns=\\"http://www.w3.org/2000/svg\\"
ref={svgRef}
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -456,7 +517,7 @@ exports[`cli should support various args: --typescript 1`] = `

function SvgFile(props: React.SVGProps<SVGSVGElement>) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand Down Expand Up @@ -512,7 +573,7 @@ exports[`cli should work with a simple file 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -528,7 +589,7 @@ exports[`cli should work with stdin 1`] = `

function SvgComponent(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand Down
10 changes: 8 additions & 2 deletions packages/cli/src/__snapshots__/util.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ exports[`util #convertFile should convert a file 1`] = `

function SvgFile(props) {
return (
<svg width={48} height={1} {...props}>
<svg width={48} height={1} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand All @@ -20,7 +20,13 @@ exports[`util #convertFile should support a custom config path 1`] = `

function SvgFile(props) {
return (
<svg width=\\"1em\\" height=\\"1em\\" viewBox=\\"0 0 48 1\\" {...props}>
<svg
width=\\"1em\\"
height=\\"1em\\"
viewBox=\\"0 0 48 1\\"
xmlns=\\"http://www.w3.org/2000/svg\\"
{...props}
>
<path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
</svg>
)
Expand Down
Loading