Datatables Header missalign when table hidden

Falco

When the table is hidden while .DataTable() is being called on it or if the window width changes while the table is hidden and then revealed the header is missaligned.
when removing scrollX: true, the table is then rendered correctly.

Here is a working example: http://jsfiddle.net/xpvt214o/533811/
how to reproduce the bug:
1. Hide the table with the hide button
2. resize the jsfiddle output window while the table is hidden
3. show the table with the show button
4. see the table headers are not 100% width and not aligned with the rest of the table.

a workaround is welcome. thank you.

Falco

Apparently calling draw() redoes the headers. now to find a way to make this automagic whenever the table gets unhidden without putting this in every thing that calles show() which might or might not reveal a datatable or not

I'm thinking about something like this: https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
but I don't know the performance cost clientside if I observer every single element and then call .DataTable().draw() on all .dataTable children whenever the hidden attribute changes.

Falco

I made a dirty workaround here: http://jsfiddle.net/xpvt214o/534754/
create an observer that checks for style changes, and if they occur, redraw all children with class .dataTable

var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
var DatatablesRedrawObserver = new MutationObserver(function (mutationsList) {
    mutationsList.forEach(function (mutation) {
        if (mutation.type === "attributes") {
            if (mutation.attributeName === "style") {
                $(mutation.target).find(".dataTable").DataTable().draw();
            }
        }
    });
});

when making your table, add all parents to an mutation observer:

$(tableObject).parents().each(function (idx) {
        DatatablesRedrawObserver.observe(this, { attributes: true });
    });

Falco

The workaround works in chrome and ms edge. Firefox really hates it and hangs up. IE doesn't even bother at all with datatables.
I'd love some suggestions.