Bug with tables

[JoeWoodward]

I have the found an issue when sanitizing the innerHTML of a table element. I'm not sure if it's a bug or undocumented behavior.

Given the config

const config = {
  tags: {
    table: {}, thead: {}, tbody: {}, tfoot: {}, tr: {}, th: {}, td: {}
  }
}
const sanitizer = new HTMLJanitor(config)

When using the outerHTML of a table element everything works correctly

const outerHTML = '<table id="customers" style="box-sizing: inherit; font-family: arial, sans-serif; border-collapse: collapse; width: 919.656px; color: rgb(0, 0, 0); font-size: 15px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><tbody style="box-sizing: inherit;"><tr style="box-sizing: inherit;"><th style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Company</th><th style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Contact</th><th style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Country</th></tr><tr style="box-sizing: inherit; background-color: rgb(221, 221, 221);"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Alfreds Futterkiste</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Maria Anders</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Germany</td></tr><tr style="box-sizing: inherit;"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Centro comercial Moctezuma</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Francisco Chang</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Mexico</td></tr><tr style="box-sizing: inherit; background-color: rgb(221, 221, 221);"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Ernst Handel</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Roland Mendel</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Austria</td></tr><tr style="box-sizing: inherit;"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Island Trading</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Helen Bennett</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">UK</td></tr><tr style="box-sizing: inherit; background-color: rgb(221, 221, 221);"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Laughing Bacchus Winecellars</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Yoshi Tannamuri</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Canada</td></tr><tr style="box-sizing: inherit;"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Magazzini Alimentari Riuniti</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Giovanni Rovelli</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Italy</td></tr></tbody></table>'

sanitizer.clean(outerHTML)
// returns
'<table><tbody><tr><th>Company</th><th>Contact</th><th>Country</th></tr><tr><td>Alfreds Futterkiste</td><td>Maria Anders</td><td>Germany</td></tr><tr><td>Centro comercial Moctezuma</td><td>Francisco Chang</td><td>Mexico</td></tr><tr><td>Ernst Handel</td><td>Roland Mendel</td><td>Austria</td></tr><tr><td>Island Trading</td><td>Helen Bennett</td><td>UK</td></tr><tr><td>Laughing Bacchus Winecellars</td><td>Yoshi Tannamuri</td><td>Canada</td></tr><tr><td>Magazzini Alimentari Riuniti</td><td>Giovanni Rovelli</td><td>Italy</td></tr></tbody></table>'

However, if you pass in the innerHTML it only returns the text

const innerHTML = '<tbody style="box-sizing: inherit;"><tr style="box-sizing: inherit;"><th style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Company</th><th style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Contact</th><th style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Country</th></tr><tr style="box-sizing: inherit; background-color: rgb(221, 221, 221);"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Alfreds Futterkiste</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Maria Anders</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Germany</td></tr><tr style="box-sizing: inherit;"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Centro comercial Moctezuma</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Francisco Chang</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Mexico</td></tr><tr style="box-sizing: inherit; background-color: rgb(221, 221, 221);"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Ernst Handel</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Roland Mendel</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Austria</td></tr><tr style="box-sizing: inherit;"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Island Trading</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Helen Bennett</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">UK</td></tr><tr style="box-sizing: inherit; background-color: rgb(221, 221, 221);"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Laughing Bacchus Winecellars</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Yoshi Tannamuri</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Canada</td></tr><tr style="box-sizing: inherit;"><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Magazzini Alimentari Riuniti</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Giovanni Rovelli</td><td style="box-sizing: inherit; border: 1px solid rgb(221, 221, 221); text-align: left; padding: 8px;">Italy</td></tr></tbody>';

sanitizer.clean(innerHTML);
// returns
'CompanyContactCountryAlfreds FutterkisteMaria AndersGermanyCentro comercial MoctezumaFrancisco ChangMexicoErnst HandelRoland MendelAustriaIsland TradingHelen BennettUKLaughing Bacchus WinecellarsYoshi TannamuriCanadaMagazzini Alimentari RiunitiGiovanni RovelliItaly'