Table size calculation breaks when you let words wrap in a td

[timkpaine]

If you let a td be taller than regular-table expects, the scroll position miscalculates.

table.addStyleListener(() => {
  for (const td of table.querySelectorAll("td")) {
    td.style["white-space"] = "normal";
    td.style["word-wrap"] = "break-word";
  }
});

[telamonian]

I've been getting bit by a similar bug lately while working with "fancy" th column headers that contain several children in a vertical layout.

So it seems like bug will trigger whenever the height of any table cell element (ie any th or td) is greater than the expected height. The default expected height appears to be 19px:

https://github.com/jpmorganchase/regular-table/blob/f23d782550a0fbfa2ec1c14fdf968683d98371b1/src/js/scroll_panel.js#L145-L158

[telamonian]

@texodus Had asked me for a repro of this issue a while back. So here's a simple repro that shows how having a "fat" row in the column header breaks the calculation of number of rows to render:

https://bl.ocks.org/telamonian/a1475279ed2586c02f172fecf11ea681

Interestingly, it does render correctly on the very first draw() call (which in this example is invoked as part of window.init()). This suggests that the problem is fixable.