Merge pull request #54 from miksto/feature/inline-image-using-data-sc…

…heme Treat URLs like data:image/svg+xml as absolute to support inlining images in html
claudetech · Dec 19, 2023 · 6d12536 · 6d12536
2 parents bc7403c + e8fa25f
commit 6d12536
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/lib/index.js b/lib/index.js
@@ -44,7 +44,7 @@ const defaults = {
   }
 };
 
-const absolutePathRegex = new RegExp('^(?:[a-z]+:)?//', 'i');
+const absolutePathRegex = new RegExp('^(?:[a-z]+:)?//|^data:image/[^;]+;', 'i');
 const conditionalCommentRegex = /(\s*\[if .*?\]\s*>\s*)(.*?)(\s*<!\s*\[endif\]\s*)/i;
 const closingTagRegex = /<\/.+?>/g;
 

diff --git a/test/data/index.html b/test/data/index.html
@@ -16,6 +16,7 @@
 </head>
 <body>
   <img id="abs-img" src="//foo.png" />
+  <img id="abs-img-data" src="data:image/svg+xml;base64,foo" />
   <img id="rel-img" src="foo.png" />
 
   <audio id="abs-audio" src="//foo.mp3"></audio>
@@ -26,10 +27,12 @@
 
   <picture>
     <source id="abs-source" src="//foo.jpg"></source>
+    <source id="abs-source-data" src="data:image/svg+xml;base64,foo"></source>
     <source id="rel-source" src="foo.jpg"></source>
   </picture>
 
   <div id="abs-style" style="background-image: url(//bg.jpg); background: url('//bg.jpg')"></div>
+  <div id="abs-style-data" style="background-image: url(data:image/svg+xml;base64,foo); background: url('data:image/svg+xml;base64,foo')"></div>
   <div id="rel-style" style="background-image: url(bg.jpg); background: url('bg.jpg')"></div>
 
   <!--[if lt IE 9]>

diff --git a/test/index-test.js b/test/index-test.js
@@ -227,6 +227,7 @@ describe('processor', function () {
 
       expect($('#rel-img').attr('src')).to.be('../foo.png');
       expect($('#abs-img').attr('src')).to.be('//foo.png');
+      expect($('#abs-img-data').attr('src')).to.be('data:image/svg+xml;base64,foo');
 
       expect($('#rel-audio').attr('src')).to.be('../foo.mp3');
       expect($('#abs-audio').attr('src')).to.be('//foo.mp3');
@@ -236,13 +237,17 @@ describe('processor', function () {
 
       expect($('#rel-source').attr('src')).to.be('../foo.jpg');
       expect($('#abs-source').attr('src')).to.be('//foo.jpg');
+      expect($('#abs-source-data').attr('src')).to.be('data:image/svg+xml;base64,foo');
 
       expect($('#rel-style').attr('style')).to.be(
         "background-image: url('../bg.jpg'); background: url('../bg.jpg')"
       );
       expect($('#abs-style').attr('style')).to.be(
         "background-image: url(//bg.jpg); background: url('//bg.jpg')"
       );
+      expect($('#abs-style-data').attr('style')).to.be(
+        "background-image: url(data:image/svg+xml;base64,foo); background: url('data:image/svg+xml;base64,foo')"
+      );
 
       $ = cheerio.load(fs.readFileSync(path.join(dir, 'index.html'), 'utf8'));
       expect($('#rel-script').attr('src')).to.be('foo.js');