From 138c493b2ae0c5c1cef488cf9ff7f94827dc2aa5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Greg=20Berg=C3=A9?= Date: Wed, 1 Dec 2021 22:45:33 +0100 Subject: [PATCH] feat(native): automatically convert inline style in native Closes #588 --- .../src/__snapshots__/index.test.ts.snap | 14 +++++---- packages/plugin-svgo/src/config.test.ts | 13 ++++++--- packages/plugin-svgo/src/config.ts | 29 +++++++++++-------- packages/plugin-svgo/src/index.test.ts | 12 ++++---- 4 files changed, 41 insertions(+), 27 deletions(-) diff --git a/packages/plugin-svgo/src/__snapshots__/index.test.ts.snap b/packages/plugin-svgo/src/__snapshots__/index.test.ts.snap index dba0696d..6879d759 100644 --- a/packages/plugin-svgo/src/__snapshots__/index.test.ts.snap +++ b/packages/plugin-svgo/src/__snapshots__/index.test.ts.snap @@ -1,13 +1,15 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`svgo does not load runtime configuration with \`runtimeConfig: false\` 1`] = `""`; +exports[`svgo does not load runtime configuration with \`runtimeConfig: false\` 1`] = `""`; -exports[`svgo does not remove viewBox with \`icon\` option 1`] = `""`; +exports[`svgo does not remove viewBox with \`icon\` option 1`] = `""`; -exports[`svgo does not remove viewBox with when \`dimensions\` is false 1`] = `""`; +exports[`svgo does not remove viewBox with when \`dimensions\` is false 1`] = `""`; -exports[`svgo optimizes svg 1`] = `""`; +exports[`svgo does remove style when \`native\` is true 1`] = `""`; -exports[`svgo supports \`config.svgoConfig\` 1`] = `"Created with Sketch."`; +exports[`svgo optimizes svg 1`] = `""`; -exports[`svgo uses \`state.filePath\` to detect configuration 1`] = `""`; +exports[`svgo supports \`config.svgoConfig\` 1`] = `"Created with Sketch."`; + +exports[`svgo uses \`state.filePath\` to detect configuration 1`] = `""`; diff --git a/packages/plugin-svgo/src/config.test.ts b/packages/plugin-svgo/src/config.test.ts index 2ab3f2e9..0d74c671 100644 --- a/packages/plugin-svgo/src/config.test.ts +++ b/packages/plugin-svgo/src/config.test.ts @@ -1,12 +1,19 @@ import { getSvgoConfig } from './config' +const state = { componentName: 'Icon' } + describe('#getSvgoConfig', () => { describe('with no specific config', () => { it('returns config with `prefixIds: true`', async () => { const config = {} - const state = {} expect(await getSvgoConfig(config, state)).toEqual({ - plugins: ['preset-default', 'prefixIds'], + plugins: [ + { + name: 'preset-default', + params: { overrides: {} }, + }, + 'prefixIds', + ], }) }) }) @@ -14,7 +21,6 @@ describe('#getSvgoConfig', () => { describe('with `config.icons` enabled', () => { it('returns config with `removeViewBox: false`', async () => { const config = { icon: true } - const state = {} expect(await getSvgoConfig(config, state)).toEqual({ plugins: [ { @@ -30,7 +36,6 @@ describe('#getSvgoConfig', () => { describe('with `config.dimensions` disabled', () => { it('returns config with `removeViewBox: false`', async () => { const config = { dimensions: false } - const state = {} expect(await getSvgoConfig(config, state)).toEqual({ plugins: [ { diff --git a/packages/plugin-svgo/src/config.ts b/packages/plugin-svgo/src/config.ts index 755b6e2c..2212b4df 100644 --- a/packages/plugin-svgo/src/config.ts +++ b/packages/plugin-svgo/src/config.ts @@ -17,19 +17,24 @@ const explorer = cosmiconfigSync('svgo', { }) const getSvgoConfigFromSvgrConfig = (config: Config): any => { - const preset = - config.icon || config.dimensions === false - ? { - name: 'preset-default', - params: { - overrides: { - removeViewBox: false, - }, - }, - } - : 'preset-default' + const params = { overrides: {} as any } + if (config.icon || config.dimensions === false) { + params.overrides.removeViewBox = false + } + if (config.native) { + params.overrides.inlineStyles = { + onlyMatchedOnce: false, + } + } + return { - plugins: [preset, 'prefixIds'], + plugins: [ + { + name: 'preset-default', + params, + }, + 'prefixIds', + ], } } diff --git a/packages/plugin-svgo/src/index.test.ts b/packages/plugin-svgo/src/index.test.ts index a18ef84f..63e2c712 100644 --- a/packages/plugin-svgo/src/index.test.ts +++ b/packages/plugin-svgo/src/index.test.ts @@ -9,10 +9,11 @@ const baseSvg = ` Dismiss Created with Sketch. + - - + + @@ -47,7 +48,6 @@ describe('svgo', () => { }, state, ) - expect(result).toMatchSnapshot() }) @@ -67,19 +67,21 @@ describe('svgo', () => { { svgo: true, runtimeConfig: false }, { ...state, filePath: path.join(__dirname, '../__fixtures__/svgo') }, ) - expect(result).toMatchSnapshot() }) it('does not remove viewBox with `icon` option', () => { const result = svgo(baseSvg, { svgo: true, icon: true }, state) - expect(result).toMatchSnapshot() }) it('does not remove viewBox with when `dimensions` is false', () => { const result = svgo(baseSvg, { svgo: true, dimensions: false }, state) + expect(result).toMatchSnapshot() + }) + it('does remove style when `native` is true', () => { + const result = svgo(baseSvg, { svgo: true, native: true }, state) expect(result).toMatchSnapshot() }) })