close #38, update data uri regexp

highlight · Nov 21, 2020 · 555398d · 555398d
1 parent da182f4
commit 555398d
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 16 deletions.
diff --git a/src/snapshot.ts b/src/snapshot.ts
@@ -63,7 +63,7 @@ function extractOrigin(url: string): string {
 
 const URL_IN_CSS_REF = /url\((?:(')([^']*)'|(")([^"]*)"|([^)]*))\)/gm;
 const RELATIVE_PATH = /^(?!www\.|(?:http|ftp)s?:\/\/|[A-Za-z]:\\|\/\/).*/;
-const DATA_URI = /^(data:)([\w\/\+\-]+);(charset=[\w-]+|base64|utf-?8).*,(.*)/i;
+const DATA_URI = /^(data:)([^,]*),(.*)/i;
 export function absoluteToStylesheet(
   cssText: string | null,
   href: string,

diff --git a/test/snapshot.test.ts b/test/snapshot.test.ts
@@ -74,11 +74,21 @@ describe('absolute url to stylesheet', () => {
 
   it('preserves quotes around inline svgs with spaces', () => {
     expect(
-      absoluteToStylesheet("url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2328a745' d='M3'/%3E%3C/svg%3E\")", href),
-    ).to.equal("url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2328a745' d='M3'/%3E%3C/svg%3E\")");
+      absoluteToStylesheet(
+        "url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2328a745' d='M3'/%3E%3C/svg%3E\")",
+        href,
+      ),
+    ).to.equal(
+      "url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2328a745' d='M3'/%3E%3C/svg%3E\")",
+    );
     expect(
-      absoluteToStylesheet('url(\'data:image/svg+xml;utf8,<svg width="28" height="32" viewBox="0 0 28 32" xmlns="http://www.w3.org/2000/svg"><path d="M27 14C28" fill="white"/></svg>\')', href),
-    ).to.equal('url(\'data:image/svg+xml;utf8,<svg width="28" height="32" viewBox="0 0 28 32" xmlns="http://www.w3.org/2000/svg"><path d="M27 14C28" fill="white"/></svg>\')');
+      absoluteToStylesheet(
+        'url(\'data:image/svg+xml;utf8,<svg width="28" height="32" viewBox="0 0 28 32" xmlns="http://www.w3.org/2000/svg"><path d="M27 14C28" fill="white"/></svg>\')',
+        href,
+      ),
+    ).to.equal(
+      'url(\'data:image/svg+xml;utf8,<svg width="28" height="32" viewBox="0 0 28 32" xmlns="http://www.w3.org/2000/svg"><path d="M27 14C28" fill="white"/></svg>\')',
+    );
   });
   it('can handle empty path', () => {
     expect(absoluteToStylesheet(`url('')`, href)).to.equal(`url('')`);
@@ -87,24 +97,26 @@ describe('absolute url to stylesheet', () => {
 
 describe('isBlockedElement()', () => {
   const subject = (html: string, opt: any = {}) =>
-    _isBlockedElement(render(html), 'rr-block', opt.blockSelector)
+    _isBlockedElement(render(html), 'rr-block', opt.blockSelector);
 
   const render = (html: string): HTMLElement =>
-    JSDOM.fragment(html).querySelector('div')!
+    JSDOM.fragment(html).querySelector('div')!;
 
   it('can handle empty elements', () => {
-    expect(subject('<div />')).to.equal(false)
-  })
+    expect(subject('<div />')).to.equal(false);
+  });
 
   it('blocks prohibited className', () => {
-    expect(subject('<div class="foo rr-block bar" />')).to.equal(true)
-  })
+    expect(subject('<div class="foo rr-block bar" />')).to.equal(true);
+  });
 
   it('does not block random data selector', () => {
-    expect(subject('<div data-rr-block />')).to.equal(false)
-  })
+    expect(subject('<div data-rr-block />')).to.equal(false);
+  });
 
   it('blocks blocked selector', () => {
-    expect(subject('<div data-rr-block />', { blockSelector: '[data-rr-block]' })).to.equal(true)
-  })
-})
+    expect(
+      subject('<div data-rr-block />', { blockSelector: '[data-rr-block]' }),
+    ).to.equal(true);
+  });
+});