test: Add Rose::Table::Row::Cell tests

addons/rose/addon/components/rose/table/row/cell/index.js

@@ -4,13 +4,14 @@ import { computed } from '@ember/object';
 
 export default Component.extend({
   layout,
-  classNameBindings: ['cellStyle', 'cellSizeStyle'],
-  cellStyle: computed(function () {
+  tagName: 'td',
+  classNameBindings: ['cellTypeStyle', 'cellStyle'],
+  cellTypeStyle: computed(function () {
     return this.tagName.match('th')
       ? `rose-table-header-cell`
       : 'rose-table-cell';
   }),
-  cellSizeStyle: computed(function () {
+  cellStyle: computed(function () {
     return this.style ? `rose-table-cell-${this.style}` : '';
   }),
 });

addons/rose/addon/components/rose/table/row/index.hbs

@@ -1,6 +1,6 @@
 <tr ...attributes class='rose-table-row {{if @hidden (concat "rose-table-row-visually-hidden")}}'>
   {{yield (hash
-    cell=(component 'rose/table/row/cell' tagName='td')
+    cell=(component 'rose/table/row/cell')
     headerCell=(component 'rose/table/row/cell' tagName='th')
   )}}
 </tr>

addons/rose/tests/integration/components/rose/table-test.js

@@ -43,4 +43,9 @@ module('Integration | Component | rose/table', function (hooks) {
     </Rose::Table>`);
     assert.ok(find('tfoot'));
   });
+
+  test('it supports a style class', async function (assert) {
+    await render(hbs`<Rose::Table @style="condensed" />`);
+    assert.ok(find('.rose-table-condensed'));
+  });
 });

addons/rose/tests/integration/components/rose/table/row-test.js

@@ -32,4 +32,9 @@ module('Integration | Component | rose/table/row', function (hooks) {
     assert.ok(find('th'));
     assert.ok(find('.rose-table-header-cell'));
   });
+
+  test('it can be hidden', async function (assert) {
+    await render(hbs`<Rose::Table::Row @hidden=true />`);
+    assert.ok(find('.rose-table-row-visually-hidden'));
+  });
 });

addons/rose/tests/integration/components/rose/table/row/cell-test.js

@@ -1,26 +1,38 @@
 import { module, test } from 'qunit';
 import { setupRenderingTest } from 'ember-qunit';
-import { render } from '@ember/test-helpers';
-import { hbs } from 'ember-cli-htmlbars';
+import { render, find } from '@ember/test-helpers';
+import hbs from 'htmlbars-inline-precompile';
 
 module('Integration | Component | rose/table/row/cell', function (hooks) {
   setupRenderingTest(hooks);
 
   test('it renders', async function (assert) {
-    // Set any properties with this.set('myProperty', 'value');
-    // Handle any actions with this.set('myAction', function(val) { ... });
+    assert.expect(2);
+    await render(hbs`<Rose::Table::Row::Cell>
+      content
+    </Rose::Table::Row::Cell>`);
+    assert.ok(find('td'));
+    assert.equal(find('.rose-table-cell').textContent.trim(), 'content');
+  });
 
-    await render(hbs`<Rose::Table::Row::Cell />`);
+  test('it renders with attributes', async function (assert) {
+    assert.expect(1);
+    await render(hbs`<Rose::Table::Row::Cell id="cell"/>`);
+    assert.ok(find('#cell'));
+  });
 
-    assert.equal(this.element.textContent.trim(), '');
+  test('it renders as header cell', async function (assert) {
+    assert.expect(4);
+    await render(hbs`<Rose::Table::Row::Cell @tagName='th'/>`);
+    assert.ok(find('th'));
+    assert.ok(find('.rose-table-header-cell'));
+    assert.notOk(find('td'));
+    assert.notOk(find('.rose-table-cell'));
+  });
 
-    // Template block usage:
-    await render(hbs`
-      <Rose::Table::Row::Cell>
-        template block text
-      </Rose::Table::Row::Cell>
-    `);
-
-    assert.equal(this.element.textContent.trim(), 'template block text');
+  test('it adds a style class', async function (assert) {
+    assert.expect(1);
+    await render(hbs`<Rose::Table::Row::Cell @style='expand' />`);
+    assert.ok(find('.rose-table-cell-expand'));
   });
 });