feat(transformers): add default extra attributes

maizzle · Apr 21, 2020 · b36201c · b36201c
1 parent db3c3c9
commit b36201c
Show file tree

Hide file tree

Showing 9 changed files with 35 additions and 24 deletions.
diff --git a/src/transformers/extra-attributes.js b/src/transformers/extra-attributes.js
@@ -1,24 +1,35 @@
 const cheerio = require('cheerio')
-const {isEmptyObject} = require('../utils/helpers')
+const {isObject} = require('../utils/helpers')
 
 module.exports = async (html, config) => {
-  if (config.extraAttributes && !isEmptyObject(config.extraAttributes)) {
-    const $ = cheerio.load(html, {decodeEntities: false})
+  let attributes = {
+    table: {
+      cellpadding: 0,
+      cellspacing: 0,
+      role: 'presentation'
+    },
+    img: {
+      alt: ''
+    }
+  }
 
-    Object.entries(config.extraAttributes).forEach(([element, attrs]) => {
-      Object.entries(attrs).forEach(attr => {
-        const $element = $(element)
-        const [name, value] = attr
-        if (name === 'class') {
-          return $element.addClass(value)
-        }
+  if (isObject(config.extraAttributes)) {
+    attributes = {...attributes, ...config.extraAttributes}
+  }
 
-        return $element.attr(name, value)
-      })
-    })
+  const $ = cheerio.load(html, {decodeEntities: false})
 
-    return $.html()
-  }
+  Object.entries(attributes).forEach(([element, attrs]) => {
+    Object.entries(attrs).forEach(attr => {
+      const $element = $(element)
+      const [name, value] = attr
+      if (name === 'class') {
+        return $element.addClass(value)
+      }
+
+      return $element.attr(name, value)
+    })
+  })
 
-  return html
+  return $.html()
 }
diff --git a/test/expected/base-image-url.html b/test/expected/base-image-url.html
@@ -4,7 +4,7 @@
 
 <div style="background-image: url(https://example.com/test.jpg)">Test</div>
 
-<table background="https://example.com/test.jpg">
+<table background="https://example.com/test.jpg" cellpadding="0" cellspacing="0" role="presentation">
   <tr>
     <td>Test</td>
   </tr>

diff --git a/test/expected/email-comb.html b/test/expected/email-comb.html
@@ -17,7 +17,7 @@
   </head>
 <body>
   <!-- An HTML comment to preserve -->
-  <table class="w-full">
+  <table class="w-full" cellpadding="0" cellspacing="0" role="presentation">
     <tr>
       <td class="preserve-it text-center">Test</td>
     </tr>

diff --git a/test/expected/inline.html b/test/expected/inline.html
@@ -17,7 +17,7 @@
 }</style>
   </head>
 <body>
-  <table class="w-full cursor-move text-center" style="text-align: center; width: 100%;" width="100%" align="center">
+  <table class="w-full cursor-move text-center" style="text-align: center; width: 100%;" width="100%" align="center" cellpadding="0" cellspacing="0" role="presentation">
     <tr>
       <td class="h-full align-middle" style="height: 100%; vertical-align: middle;" height="100%">Test</td>
     </tr>

diff --git a/test/expected/minify.html b/test/expected/minify.html
@@ -1,2 +1,2 @@
 <!DOCTYPE html><html><head><style>.table{display:table}.w-full{width:100%}</style></head><body>
-<table class="w-full"><tr><td>Test</td></tr></table></body></html>
+<table class="w-full" cellpadding="0" cellspacing="0" role="presentation"><tr><td>Test</td></tr></table></body></html>
diff --git a/test/expected/prettify.html b/test/expected/prettify.html
@@ -15,7 +15,7 @@
   </head>
 
   <body>
-    <table class="w-full">
+    <table class="w-full" cellpadding="0" cellspacing="0" role="presentation">
       <tr>
         <td>Test</td>
       </tr>

diff --git a/test/expected/remove-inline-bgcolor-tags.html b/test/expected/remove-inline-bgcolor-tags.html
@@ -5,7 +5,7 @@
 
   </head>
 <body>
-  <table class="bg-blue-500" style="background-color: #4299e1;" bgcolor="#4299e1">
+  <table class="bg-blue-500" style="background-color: #4299e1;" bgcolor="#4299e1" cellpadding="0" cellspacing="0" role="presentation">
     <tr>
       <td class="bg-blue-500" bgcolor="#4299e1">Test</td>
     </tr>

diff --git a/test/expected/remove-inline-bgcolor.html b/test/expected/remove-inline-bgcolor.html
@@ -5,7 +5,7 @@
 
   </head>
 <body>
-  <table class="bg-blue-500" bgcolor="#4299e1">
+  <table class="bg-blue-500" bgcolor="#4299e1" cellpadding="0" cellspacing="0" role="presentation">
     <tr>
       <td class="bg-blue-500" bgcolor="#4299e1">Test</td>
     </tr>

diff --git a/test/expected/remove-inline-sizes.html b/test/expected/remove-inline-sizes.html
@@ -5,7 +5,7 @@
 
   </head>
 <body>
-  <table class="w-full" width="100%">
+  <table class="w-full" width="100%" cellpadding="0" cellspacing="0" role="presentation">
     <tr>
       <td class="h-full" height="100%">Test</td>
     </tr>
-Original file line number
+Diff line change
@@ Expand Up / @@ -15,7 +15,7 @@ @@
       </head>
       <body>
-        <table class="w-full">
+        <table class="w-full" cellpadding="0" cellspacing="0" role="presentation">
           <tr>
             <td>Test</td>
           </tr>
@@ Expand Down @@