INCOMPLETE: Waiting on PR svg/sax#3 or svg/sax#2

fix: avoid escaping numeric entities or predefined entities lt and amp Also allows .idea in .gitignore
brettz9 · Dec 23, 2021 · b6abbbb · b6abbbb
1 parent 79d4bab
commit b6abbbb
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 2 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
+.idea
 .pnp.*
 .yarn/*
 !.yarn/patches

diff --git a/lib/stringifier.js b/lib/stringifier.js
@@ -58,8 +58,8 @@ const defaults = {
  textStart: '',
  textEnd: '',
  indent: 4,
- regEntities: /[&'"<>]/g,
- regValEntities: /[&"<>]/g,
+ regEntities: /['"<>]|&(?!#x?[\da-f]+;)/gi,
+ regValEntities: /["<>]|&(?!(?:#x?[\da-f]+|lt|amp);)/gi,
  encodeEntity: encodeEntity,
  pretty: false,
  useShortTags: true,

diff --git a/test/svgo/_index.test.js b/test/svgo/_index.test.js
@@ -35,6 +35,53 @@ describe('svgo', () => {
  const result = optimize('<svg />', { input: 'file', path: 'input.svg' });
  expect(result.data).toEqual('<svg/>');
  });
+ it('should resolve and not escape numeric character references', async () => {
+ const result = optimize('<svg><text class="&#1234; &#xabcd;">&#xabcd; &#1234;</text></svg>', { input: 'file', path: 'input.svg' });
+ expect(result.data).toEqual('<svg><text class="\u04d2 \uabcd">\uabcd \u04d2</text></svg>');
+ });
+
+ it('should escape and not double-escape numeric character references representing <', async () => {
+ const result = optimize('<svg><text font-family="&#60; and &#x3c;">&#x3c; and &#60;</text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result5', result);
+ expect(result.data).toEqual('<svg><text font-family="&lt; and &lt;">&lt; and &lt;</text></svg>');
+ });
+ it('should escape and not double-escape numeric character references representing &', async () => {
+ const result = optimize('<svg><text font-family="&#38; and &#x26;">&#x26; and &#38;</text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result6', result);
+ expect(result.data).toEqual('<svg><text font-family="&amp; and &amp;">&amp; and &amp;</text></svg>');
+ });
+
+ // '<svg><text><![CDATA ]&#x3e; and ]&#62; ]></text></svg>'
+ // '<svg><text class="&#34; and &#39;">&#34; and &#39;</text></svg>',
+ // '<svg><text class="&#x22; and &#x27;">&#x22; and &#x27;</text></svg>',
+ it('should escape and not double-escape numeric character references representing >', async () => {
+ const result = optimize('<svg><text>CDATA1: <![CDATA[ ]&#x3e; and ]&#62; ]]></text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result7', result);
+ expect(result.data).toEqual('<svg><text>CDATA1: <![CDATA[ ]&#x3e; and ]&#62; ]]></text></svg>');
+ });
+ it('should escape and not double-escape numeric character references representing \'', async () => {
+ const result = optimize('<svg><text class="&#34; and &#39;">&#34; and &#39;</text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result8', result);
+ expect(result.data).toEqual('<svg><text class="&quot; and \'">&quot; and &apos;</text></svg>');
+ });
+ it('should escape and not double-escape numeric character references representing "', async () => {
+ const result = optimize('<svg><text class="&#x22; and &#x27;">&#x22; and &#x27;</text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result9', result);
+ expect(result.data).toEqual('<svg><text class="&quot; and \'">&quot; and &apos;</text></svg>');
+ });
+
+ it('should escape and not double-escape numeric character references representing \'', async () => {
+ const result = optimize('<svg><text class=\'&#34; and &#39;\'>&#34; and &#39;</text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result8', result);
+ expect(result.data).toEqual('<svg><text class="&quot; and \'">&quot; and &apos;</text></svg>');
+ });
+ it('should escape and not double-escape numeric character references representing "', async () => {
+ const result = optimize('<svg><text class="&#x22; and &#x27;">&#x22; and &#x27;</text></svg>', { input: 'file', path: 'input.svg' });
+ console.log('result9', result);
+ expect(result.data).toEqual('<svg><text class="&quot; and \'">&quot; and &apos;</text></svg>');
+ });
+
+
  it('should preserve style specifity over attributes', async () => {
  const [original, expected] = await parseFixture('style-specifity.svg');
  const result = optimize(original, {