Newly added cells are not visible when using "*-slack" size constraints

[daniellubovich]

I noticed an issue using gte-container-slack size constraint. New cells are not visible after a column added dynamically to the end of the column list. If you add a new column to the end of the column list, the cell has the correct width, minWidth, etc. that is expected by the new column. But it also has the following styles:

padding-left: 0px;
padding-right: 0px;
display: none;

As far as I can tell, this is because the slack cell element is being reused for new cells as columns are added and we aren't removing the previously applied slack styles (the ones I posted above). Here is where the styles are set:

ember-table/addon/components/-private/base-table-cell.js

Lines 71 to 75 in cafec13

	if (this.get('isSlack')) {
	this.element.style.paddingLeft = 0;
	this.element.style.paddingRight = 0;
	this.element.style.display = width === '0px' ? 'none' : 'table-cell';
	}

I haven't dug in too deep to see if this reuse is truly the cause or if I'm overlooking something - but the following change does seem to fix the issue 🤷

if (this.get('isSlack')) {
	this.element.style.paddingLeft = 0;
	this.element.style.paddingRight = 0;
	this.element.style.display = width === '0px' ? 'none' : 'table-cell';
} else {
	this.element.style.paddingLeft = null;
	this.element.style.paddingRight = null;
	this.element.style.display = null;
}

Does this seem reasonable? Maybe I'm misunderstanding the issue? If this seems like the right way to go I can prep a PR 👌