Support other image types.

README.md

@@ -2,7 +2,7 @@
 
 Base64 images are generally a [bad idea](https://sendgrid.com/blog/embedding-images-emails-facts/) because they aren't supported in most email clients. This Nodemailer plugin will take base64 images in your email html in the form:
 
-    <img src="data:image/png;base64,...">
+    <img src="data:image/*;base64,...">
 
 and replace it with a CID-referenced attachment that works in all email clients.
 
@@ -39,10 +39,6 @@ transporter.sendMail({
 });
 ```
 
-## TODO
-
-* Extend to GIFs
-
 ## License
 
 **MIT**

src/plugin.js

@@ -11,13 +11,13 @@ var plugin = function(mail, done) {
 
     var attachments = {};
 
-    html = replaceBase64Images(html, function(base64) {
+    html = replaceBase64Images(html, function(mimeType, base64) {
       if (attachments[base64]) return attachments[base64].cid;
 
       var randomCid = crypto.randomBytes(8).toString('hex');
 
       attachments[base64] = {
-        contentType: 'image/png',
+        contentType: mimeType,
         cid: randomCid,
         content: base64,
         encoding: 'base64',

src/replaceBase64Images.js

@@ -1,6 +1,6 @@
  var replaceBase64Images = function(html, getCid) {
-   return html.replace(/(<img[\s\S]*? src=")data:image\/png;base64,([\s\S]*?)("[\s\S]*?>)/g, function(g, start, base64, end) {
-     return start + 'cid:' + getCid(base64) + end;
+   return html.replace(/(<img[\s\S]*? src=")data:(image\/(?:png|jpe?g|gif));base64,([\s\S]*?)("[\s\S]*?>)/g, function(g, start, mimeType, base64, end) {
+     return start + 'cid:' + getCid(mimeType, base64) + end;
    });
  };
 

test/replaceBase64ImagesSpec.js

@@ -1,25 +1,44 @@
 var replaceBase64Images = require('../src/replaceBase64Images');
 
 describe('replaceBase64Images', function() {
-  var replacer = function(contents) {
-    return contents.split('').reverse().join('');
+  var replacer = function(mimeType, contents) {
+    // Make up a fake string to very parameters were passed correctly.
+    return mimeType + '-' + contents.split('').reverse().join('');
   };
 
   it('should replace a single source', function() {
     var html = '<img src="data:image\/png;base64,abc">';
-    var expected = '<img src="cid:cba">';
+    var expected = '<img src="cid:image\/png-cba">';
+    expect(replaceBase64Images(html, replacer)).toBe(expected);
+  });
+
+  it('should handle gifs', function() {
+    var html = '<img src="data:image\/png;base64,abc">';
+    var expected = '<img src="cid:image\/png-cba">';
+    expect(replaceBase64Images(html, replacer)).toBe(expected);
+  });
+
+  it('should handle jpegs', function() {
+    var html = '<img src="data:image\/jpg;base64,abc">';
+    var expected = '<img src="cid:image\/jpg-cba">';
     expect(replaceBase64Images(html, replacer)).toBe(expected);
   });
 
   it('should handle attributes on the HTML tag', function() {
     var html = '<img style="test" src="data:image\/png;base64,abc" width="100%">';
-    var expected = '<img style="test" src="cid:cba" width="100%">';
+    var expected = '<img style="test" src="cid:image\/png-cba" width="100%">';
     expect(replaceBase64Images(html, replacer)).toBe(expected);
   });
 
   it('should replace multiple sources', function() {
-    var html = '<img src="data:image\/png;base64,abc"><br><img src="data:image\/png;base64,def">';
-    var expected = '<img src="cid:cba"><br><img src="cid:fed">';
+    var html = '<img src="data:image\/png;base64,abc"><br><img src="data:image\/jpeg;base64,def">';
+    var expected = '<img src="cid:image\/png-cba"><br><img src="cid:image\/jpeg-fed">';
+    expect(replaceBase64Images(html, replacer)).toBe(expected);
+  });
+
+  it('should ignore other mimetypes', function() {
+    var html = '<img src="data:image\/bad;base64,abc">';
+    var expected = '<img src="data:image\/bad;base64,abc">';
     expect(replaceBase64Images(html, replacer)).toBe(expected);
   });