fix: dont trim pre elements

svg · Sep 25, 2023 · 0ea773d · 0ea773d
1 parent 82593c6
commit 0ea773d
Show file tree

Hide file tree

Showing 7 changed files with 108 additions and 9 deletions.
diff --git a/lib/parser.js b/lib/parser.js
@@ -15,7 +15,7 @@
 
 // @ts-ignore sax will be replaced with something else later
 const SAX = require('@trysound/sax');
-const { textElems } = require('../plugins/_collections.js');
+const { spaceSensitiveElems } = require('./svgo/tools');
 
 class SvgoParserError extends Error {
   /**
@@ -213,7 +213,7 @@ const parseSvg = (data, from) => {
   sax.ontext = (text) => {
     if (current.type === 'element') {
       // prevent trimming of meaningful whitespace inside textual tags
-      if (textElems.includes(current.name)) {
+      if (spaceSensitiveElems.includes(current.name)) {
         /**
          * @type {XastText}
          */

diff --git a/lib/stringifier.js b/lib/stringifier.js
@@ -12,7 +12,7 @@
  * @typedef {import('./types').StringifyOptions} StringifyOptions
  */
 
-const { textElems } = require('../plugins/_collections.js');
+const { spaceSensitiveElems } = require('./svgo/tools');
 
 /**
  * @typedef {{
@@ -239,7 +239,7 @@ const stringifyElement = (node, config, state) => {
       tagCloseStart = defaults.tagCloseStart;
       tagCloseEnd = defaults.tagCloseEnd;
       openIndent = '';
-    } else if (textElems.includes(node.name)) {
+    } else if (spaceSensitiveElems.includes(node.name)) {
       tagOpenEnd = defaults.tagOpenEnd;
       tagCloseStart = defaults.tagCloseStart;
       closeIndent = '';

diff --git a/lib/svgo/tools.js b/lib/svgo/tools.js
@@ -1,10 +1,20 @@
 'use strict';
 
+const { textElems } = require('../../plugins/_collections');
+
 /**
  * @typedef {import('../types').PathDataCommand} PathDataCommand
  * @typedef {import('../types').DataUri} DataUri
  */
 
+/**
+ * Elements where adding or removing spaces from either end of the content
+ * may effect semantic meaning or rendering.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre
+ */
+exports.spaceSensitiveElems = [...textElems, 'pre'];
+
 /**
  * Encode plain SVG data string into Data URI string.
  *

diff --git a/plugins/_collections.js b/plugins/_collections.js
@@ -97,9 +97,9 @@ exports.textElems = exports.elemsGroups.textContent.concat('title');
 
 exports.pathElems = ['path', 'glyph', 'missing-glyph'];
 
-// https://www.w3.org/TR/SVG11/intro.html#Definitions
 /**
  * @type {Record<string, Array<string>>}
+ * @see https://www.w3.org/TR/SVG11/intro.html#Definitions
  */
 exports.attrsGroups = {
   animationAddition: ['additive', 'accumulate'],
@@ -304,7 +304,6 @@ exports.attrsGroupsDefaults = {
   },
 };
 
-// https://www.w3.org/TR/SVG11/eltindex.html
 /**
  * @type {Record<string, {
  *   attrsGroups: Array<string>,
@@ -313,6 +312,7 @@ exports.attrsGroupsDefaults = {
  *   contentGroups?: Array<string>,
  *   content?: Array<string>,
  * }>}
+ * @see https://www.w3.org/TR/SVG11/eltindex.html
  */
 exports.elems = {
   a: {
@@ -1889,7 +1889,9 @@ exports.editorNamespaces = [
   'http://www.vector.evaxdesign.sk',
 ];
 
-// https://www.w3.org/TR/SVG11/linking.html#processingIRI
+/**
+ * @see https://www.w3.org/TR/SVG11/linking.html#processingIRI
+ */
 exports.referencesProps = [
   'clip-path',
   'color-profile',
@@ -1903,7 +1905,9 @@ exports.referencesProps = [
   'style',
 ];
 
-// https://www.w3.org/TR/SVG11/propidx.html
+/**
+ * @see https://www.w3.org/TR/SVG11/propidx.html
+ */
 exports.inheritableAttrs = [
   'clip-rule',
   'color',
@@ -2157,7 +2161,9 @@ exports.colorsShortNames = {
   '#f5deb3': 'wheat',
 };
 
-// https://www.w3.org/TR/SVG11/single-page.html#types-DataTypeColor
+/**
+ * @see https://www.w3.org/TR/SVG11/single-page.html#types-DataTypeColor
+ */
 exports.colorsProps = [
   'color',
   'fill',

diff --git a/test/svgo/_index.test.js b/test/svgo/_index.test.js
@@ -69,4 +69,19 @@ describe('svgo', () => {
     });
     expect(normalize(result.data)).toEqual(expected);
   });
+  it('should not trim whitespace at start and end of pre element', async () => {
+    const [original, expected] = await parseFixture('pre-element.svg');
+    const result = optimize(original, {
+      path: 'input.svg',
+    });
+    expect(normalize(result.data)).toEqual(expected);
+  });
+  it('should not add whitespace in pre element', async () => {
+    const [original, expected] = await parseFixture('pre-element-pretty.svg');
+    const result = optimize(original, {
+      path: 'input.svg',
+      js2svg: { pretty: true },
+    });
+    expect(normalize(result.data)).toEqual(expected);
+  });
 });
diff --git a/test/svgo/pre-element-pretty.svg b/test/svgo/pre-element-pretty.svg
diff --git a/test/svgo/pre-element.svg b/test/svgo/pre-element.svg