@iamproperty/components 3.5.0 → 3.7.0

package/assets/ts/tests/table.spec.ts

@@ -9,6 +9,9 @@ const basicTable = `<thead>
     <th>Heading 1</th>
     <th>Heading 2</th>
     <th>Heading 3</th>
+    <th>Heading 4</th>
+    <th>Heading 5</th>
+    <th>Heading 6</th>
   </tr>
 </thead>
 <tbody>
@@ -16,21 +19,33 @@ const basicTable = `<thead>
     <td>Cell 1</td>
     <td>Low</td>
     <td>Cell 3</td>
+    <td>Cell 4</td>
+    <td>Cell 5</td>
+    <td>Cell 6</td>
   </tr>
   <tr>
     <td>Cell 1</td>
     <td>Low</td>
     <td><a href="/link">View information</a></td>
+    <td>Cell 4</td>
+    <td>Cell 5</td>
+    <td>Cell 6</td>
   </tr>
   <tr>
     <td>Different Cell 1</td>
     <td>Medium</td>
     <td><a href="/link">View information</a></td>
+    <td>Cell 4</td>
+    <td>Cell 5</td>
+    <td>Cell 6</td>
   </tr>
   <tr>
     <td>Different Cell 1</td>
     <td>High</td>
     <td><a href="/link">View information</a></td>
+    <td>Cell 4</td>
+    <td>Cell 5</td>
+    <td>Cell 6</td>
   </tr>
 </tbody>`;
 
@@ -168,17 +183,14 @@ describe('populateDataQueries', () => {
   const table = document.createElement('table');
   table.innerHTML = basicTable;
   const form = document.createElement('form');
-  form.innerHTML += `<div><span data-query="total"></span><span data-query="Heading 2 == Low"></span></div>`;
+  form.innerHTML += `<div><input name="heading" value="Low" data-filter="Heading 2" /><span data-query="total"></span><span data-query="Heading 2 == Low"></span></div>`;
 
   tableModule.addDataAttributes(table);
   tableModule.filterTable(table, form, document.createElement('div'));
   tableModule.populateDataQueries(table, form);
 
-console.log(table.outerHTML)
-
   test('should populate elements with the data-query attribute with the result of the corresponding query', () => {
 
-
     expect(form.querySelector('[data-query="total"]').textContent).toEqual('4');
     expect(form.querySelector('[data-query="Heading 2 == Low"]').textContent).toEqual('2');
   });