From ec9d953bad2a65bd21828724b3573719d5e5f73a Mon Sep 17 00:00:00 2001
From: Susmitha Girumala <susmitha@hashicorp.com>
Date: Thu, 6 May 2021 17:36:30 -0400
Subject: [PATCH] test: Add Rose::Table::Row::Cell tests

---
 .../components/rose/table/row/cell/index.js   |  7 ++--
 .../addon/components/rose/table/row/index.hbs |  2 +-
 .../integration/components/rose/table-test.js |  5 +++
 .../components/rose/table/row-test.js         |  5 +++
 .../components/rose/table/row/cell-test.js    | 40 ++++++++++++-------
 5 files changed, 41 insertions(+), 18 deletions(-)

diff --git a/addons/rose/addon/components/rose/table/row/cell/index.js b/addons/rose/addon/components/rose/table/row/cell/index.js
index 0fc901f10..01bcb5fd7 100644
--- a/addons/rose/addon/components/rose/table/row/cell/index.js
+++ b/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}` : '';
   }),
 });
diff --git a/addons/rose/addon/components/rose/table/row/index.hbs b/addons/rose/addon/components/rose/table/row/index.hbs
index 7431132ea..5183c0746 100644
--- a/addons/rose/addon/components/rose/table/row/index.hbs
+++ b/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>
diff --git a/addons/rose/tests/integration/components/rose/table-test.js b/addons/rose/tests/integration/components/rose/table-test.js
index 06f2a5b8c..aa78b58eb 100644
--- a/addons/rose/tests/integration/components/rose/table-test.js
+++ b/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'));
+  });
 });
diff --git a/addons/rose/tests/integration/components/rose/table/row-test.js b/addons/rose/tests/integration/components/rose/table/row-test.js
index 94c57cd08..7e0774504 100644
--- a/addons/rose/tests/integration/components/rose/table/row-test.js
+++ b/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'));
+  });
 });
diff --git a/addons/rose/tests/integration/components/rose/table/row/cell-test.js b/addons/rose/tests/integration/components/rose/table/row/cell-test.js
index c58c9096c..48928d3d6 100644
--- a/addons/rose/tests/integration/components/rose/table/row/cell-test.js
+++ b/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'));
   });
 });