Merge pull request #591 from gregberge/upgrade-deps

Upgrade to SVGO v2
gregberge · Sep 6, 2021 · 7e890a9 · 7e890a9 · vercel · Sep 6, 2021
2 parents 3a2f5e3 + ae47269
commit 7e890a9
Show file tree

Hide file tree

Showing 22 changed files with 853 additions and 2,129 deletions.
diff --git a/__fixtures__/withSvgoYml/file.svg → __fixtures__/withSvgoConfig/file.svg b/__fixtures__/withSvgoYml/file.svg → __fixtures__/withSvgoConfig/file.svg
diff --git a/__fixtures__/withSvgoConfig/svgo.config.js b/__fixtures__/withSvgoConfig/svgo.config.js
@@ -0,0 +1,12 @@
+module.exports = {
+  plugins: [
+    {
+      name: 'preset-default',
+      params: {
+        overrides: {
+          removeTitle: false,
+        },
+      },
+    },
+  ]
+}
diff --git a/__fixtures__/withSvgoYml/.svgo.json b/__fixtures__/withSvgoYml/.svgo.json
diff --git a/__fixtures__/withSvgoYml/.svgo.yml b/__fixtures__/withSvgoYml/.svgo.yml
diff --git a/packages/cli/src/__snapshots__/index.test.js.snap b/packages/cli/src/__snapshots__/index.test.js.snap
@@ -545,7 +545,7 @@ __fixtures__/numeric/2.file.svg -> __fixtures_build__/whole/numeric/2file.js
 __fixtures__/numeric/file.svg -> __fixtures_build__/whole/numeric/file.js
 __fixtures__/simple/file.svg -> __fixtures_build__/whole/simple/file.js
 __fixtures__/withprettierrc/file.svg -> __fixtures_build__/whole/withprettierrc/file.js
-__fixtures__/withsvgoyml/file.svg -> __fixtures_build__/whole/withsvgoyml/file.js
+__fixtures__/withsvgoconfig/file.svg -> __fixtures_build__/whole/withsvgoconfig/file.js
 __fixtures__/withsvgrrc/file.svg -> __fixtures_build__/whole/withsvgrrc/file.js"
 `;
 
@@ -564,7 +564,7 @@ __fixtures__/numeric/2.file.svg -> __fixtures_build__/whole/numeric/2file.tsx
 __fixtures__/numeric/file.svg -> __fixtures_build__/whole/numeric/file.tsx
 __fixtures__/simple/file.svg -> __fixtures_build__/whole/simple/file.tsx
 __fixtures__/withprettierrc/file.svg -> __fixtures_build__/whole/withprettierrc/file.tsx
-__fixtures__/withsvgoyml/file.svg -> __fixtures_build__/whole/withsvgoyml/file.tsx
+__fixtures__/withsvgoconfig/file.svg -> __fixtures_build__/whole/withsvgoconfig/file.tsx
 __fixtures__/withsvgrrc/file.svg -> __fixtures_build__/whole/withsvgrrc/file.tsx"
 `;
 

diff --git a/packages/cli/src/index.js b/packages/cli/src/index.js
@@ -28,22 +28,23 @@ function parseObjectList(arg, accumulation = {}) {
   return args.reduce((acc, arg) => parseObject(arg, acc), accumulation)
 }
 
-function isFile(filePath) {
-  try {
-    const stats = fs.statSync(filePath)
-    return stats.isFile()
-  } catch (error) {
-    return false
-  }
-}
-
 const parseConfig = (name) => (arg) => {
-  const json = isFile(arg) ? fs.readFileSync(arg) : arg
   try {
-    return JSON.parse(json)
+    if (arg.endsWith('rc')) {
+      const content = fs.readFileSync(arg, 'utf-8')
+      return JSON.parse(content)
+    }
+
+    const ext = path.extname(arg)
+    if (ext === '.js' || ext === '.json') {
+      // eslint-disable-next-line import/no-dynamic-require, global-require
+      return require(path.join(process.cwd(), arg))
+    }
+
+    return JSON.parse(arg)
   } catch (error) {
     exitError(
-      `"${name}" is not valid, please specify a file or use inline JSON.`,
+      `"${name}" is not valid, please specify a valid file or use a inline JSON.`,
     )
     return null
   }

diff --git a/packages/cli/src/index.test.js b/packages/cli/src/index.test.js
@@ -100,14 +100,14 @@ describe('cli', () => {
 
   it('should support --svgo-config as json', async () => {
     const result = await cli(
-      `--svgo-config '{"plugins": [{"removeTitle": false}]}' __fixtures__/simple/file.svg`,
+      `--svgo-config '{"plugins":[{"name":"preset-default","params":{"overrides":{"removeTitle":false}}}]}' __fixtures__/simple/file.svg`,
     )
     expect(result).toMatchSnapshot()
   }, 10000)
 
   it('should support --svgo-config as file', async () => {
     const result = await cli(
-      `--svgo-config __fixtures__/withSvgoYml/.svgo.json __fixtures__/simple/file.svg`,
+      `--svgo-config __fixtures__/withSvgoConfig/svgo.config.js __fixtures__/simple/file.svg`,
     )
     expect(result).toMatchSnapshot()
   }, 10000)

diff --git a/packages/core/src/__fixtures__/svgo/.svgo.yml b/packages/core/src/__fixtures__/svgo/.svgo.yml
diff --git a/packages/core/src/__fixtures__/svgo/svgo.config.js b/packages/core/src/__fixtures__/svgo/svgo.config.js
@@ -0,0 +1,12 @@
+module.exports = {
+  plugins: [
+    {
+      name: 'preset-default',
+      params: {
+        overrides: {
+          removeDesc: false,
+        },
+      },
+    },
+  ]
+}
diff --git a/packages/core/src/__snapshots__/convert.test.js.snap b/packages/core/src/__snapshots__/convert.test.js.snap
@@ -13,7 +13,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -36,7 +36,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -59,7 +59,7 @@ function SvgComponent() {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -88,7 +88,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -111,7 +111,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -135,7 +135,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -159,7 +159,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <Svg.Path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <Svg.Path d=\\"M51 37 37 51M51 51 37 37\\" />
       </Svg.G>
     </Svg>
   )
@@ -183,7 +183,7 @@ function SvgComponent() {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <Path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <Path d=\\"M51 37 37 51M51 51 37 37\\" />
       </G>
     </Svg>
   )
@@ -213,7 +213,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <Path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <Path d=\\"M51 37 37 51M51 51 37 37\\" />
       </G>
     </Svg>
   )
@@ -243,7 +243,7 @@ function SvgComponent(props, svgRef) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <Path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <Path d=\\"M51 37 37 51M51 51 37 37\\" />
       </G>
     </Svg>
   )
@@ -268,7 +268,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <Path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <Path d=\\"M51 37 37 51M51 51 37 37\\" />
       </G>
     </Svg>
   )
@@ -282,7 +282,7 @@ exports[`convert config should support options {"prettier":false} 1`] = `
 "import * as React from \\"react\\";
 
 function SvgComponent(props) {
-  return <svg width={88} height={88} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}><g stroke=\\"#063855\\" strokeWidth={2} fill=\\"none\\" fillRule=\\"evenodd\\" strokeLinecap=\\"square\\"><path d=\\"M51 37L37 51M51 51L37 37\\" /></g></svg>;
+  return <svg width={88} height={88} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}><g stroke=\\"#063855\\" strokeWidth={2} fill=\\"none\\" fillRule=\\"evenodd\\" strokeLinecap=\\"square\\"><path d=\\"M51 37 37 51M51 51 37 37\\" /></g></svg>;
 }
 
 export default SvgComponent;"
@@ -307,7 +307,7 @@ function SvgComponent(props, svgRef) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -331,7 +331,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -354,7 +354,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -384,7 +384,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -451,7 +451,7 @@ function SvgComponent({ title, titleId, ...props }) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -505,7 +505,7 @@ function SvgComponent(props) {
         fillRule=\\"evenodd\\"
         strokeLinecap=\\"square\\"
       >
-        <path d=\\"M51 37L37 51M51 51L37 37\\" />
+        <path d=\\"M51 37 37 51M51 51 37 37\\" />
       </g>
     </svg>
   )
@@ -528,18 +528,27 @@ function SvgComponent(props) {
       {...props}
     >
       <g transform=\\"translate(0 -1004.362)\\">
-        <g id=\\"prefix__a\\" color=\\"#000\\" fill=\\"#a3a3a3\\" strokeWidth={8}>
+        <g id=\\"prefix__a\\">
           <rect
             style={{
+              color: '#000',
+              fill: '#a3a3a3',
+              fillOpacity: 1,
+              fillRule: 'nonzero',
+              stroke: 'none',
+              strokeWidth: 8,
               marker: 'none',
+              visibility: 'visible',
+              display: 'inline',
+              overflow: 'visible',
+              enableBackground: 'accumulate',
             }}
             width={4}
             height={4}
             x={4}
             y={1010.362}
             rx={0.2}
             ry={0.2}
-            overflow=\\"visible\\"
           />
           <rect
             ry={0.2}
@@ -549,9 +558,18 @@ function SvgComponent(props) {
             height={4}
             width={32}
             style={{
+              color: '#000',
+              fill: '#a3a3a3',
+              fillOpacity: 1,
+              fillRule: 'nonzero',
+              stroke: 'none',
+              strokeWidth: 8,
               marker: 'none',
+              visibility: 'visible',
+              display: 'inline',
+              overflow: 'visible',
+              enableBackground: 'accumulate',
             }}
-            overflow=\\"visible\\"
           />
         </g>
         <use xlinkHref=\\"#prefix__a\\" />
@@ -599,9 +617,8 @@ function SvgComponent(props) {
         strokeLinecap=\\"square\\"
       >
         <g id=\\"prefix__Dismiss\\" stroke=\\"#063855\\" strokeWidth={2}>
-          <path d=\\"M51 37L37 51M51 51L37 37\\" id=\\"prefix__Shape\\" />
+          <path d=\\"M51 37 37 51M51 51 37 37\\" id=\\"prefix__Shape\\" />
         </g>
-        <style />
       </g>
     </svg>
   )
@@ -616,12 +633,23 @@ exports[`convert should remove null characters 1`] = `
 
 function SvgComponent(props) {
   return (
-    <svg xmlns=\\"http://www.w3.org/2000/svg\\" width={25} height={25} {...props}>
+    <svg
+      xmlns=\\"http://www.w3.org/2000/svg\\"
+      width={25}
+      height={25}
+      style={{
+        enableBackground: 'new 0 0 25 25',
+      }}
+      xmlSpace=\\"preserve\\"
+      {...props}
+    >
       <path
         d=\\"M19.4 24.5H5.6c-2.8 0-5.1-2.3-5.1-5.1V5.6C.5 2.8 2.8.5 5.6.5h13.8c2.8 0 5.1 2.3 5.1 5.1v13.8c0 2.8-2.3 5.1-5.1 5.1z\\"
-        fill=\\"#fff\\"
-        stroke=\\"#434a54\\"
-        strokeMiterlimit={10}
+        style={{
+          fill: '#fff',
+          stroke: '#434a54',
+          strokeMiterlimit: 10,
+        }}
       />
     </svg>
   )
@@ -637,12 +665,18 @@ exports[`convert should remove style tags 1`] = `
 function SvgComponent(props) {
   return (
     <svg width={88} height={88} xmlns=\\"http://www.w3.org/2000/svg\\" {...props}>
-      <g fill=\\"red\\" fillRule=\\"evenodd\\" strokeLinecap=\\"square\\">
+      <style />
+      <g
+        fill=\\"none\\"
+        fillRule=\\"evenodd\\"
+        strokeLinecap=\\"square\\"
+        style={{
+          fill: 'red',
+        }}
+      >
         <g id=\\"prefix__Dismiss\\" stroke=\\"#063855\\" strokeWidth={2}>
-          <path d=\\"M51 37L37 51\\" id=\\"prefix__Shape\\" />
-          <path d=\\"M51 51L37 37\\" />
+          <path d=\\"M51 37 37 51M51 51 37 37\\" id=\\"prefix__Shape\\" />
         </g>
-        <style />
       </g>
     </svg>
   )