Merge pull request #120 from caiquecastro/master

Assert Component use global settings

Author: sebastiandedeyne

tests/components/TableComponent.test.js

@@ -1,5 +1,6 @@
 import Vue from 'vue/dist/vue.js';
 import simulant from 'simulant';
+import TableComponent from '../../src/';
 
 describe('TableComponent', () => {
     beforeEach(() => {
@@ -177,6 +178,25 @@ describe('TableComponent', () => {
         expect(document.body.innerHTML).toMatchSnapshot();
     });
 
+    it('can display a custom message from global settings for no matching results', async () => {
+        TableComponent.settings({
+            filterNoResults: 'There are no matching results',
+        });
+
+        document.body.innerHTML = `
+            <div id="app">
+                <table-component
+                    :data="[]">
+                    <table-column show="firstName" label="First name"></table-column>
+                </table-component>
+            </div>
+        `;
+
+        await createVm();
+
+        expect(document.body.innerHTML).toMatchSnapshot();
+    });
+
     it('can display a custom placeholder in the filter field', async () => {
         document.body.innerHTML = `
             <div id="app">

tests/components/__snapshots__/TableComponent.test.js.snap

@@ -171,6 +171,53 @@ exports[`TableComponent can add extra classes to the table, the cells and the he
 
 `;
 
+exports[`TableComponent can display a custom message from global settings for no matching results 1`] = `
+
+<div id="app">
+  <div class="table-component">
+    <div class="table-component__filter">
+      <input type="text"
+             placeholder="Filter table…"
+             class="table-component__filter__field"
+      >
+      <!---->
+    </div>
+    <div class="table-component__table-wrapper">
+      <table class="table-component__table">
+        <caption role="alert"
+                 aria-live="polite"
+                 class="table-component__table__caption"
+        >
+          Table not sorted
+        </caption>
+        <thead class="table-component__table__head">
+          <tr>
+            <th role="columnheader"
+                aria-sort="none"
+                class="table-component__th table-component__th--sort"
+            >
+              First name
+            </th>
+          </tr>
+        </thead>
+        <tbody class="table-component__table__body">
+        </tbody>
+        <tfoot>
+        </tfoot>
+      </table>
+    </div>
+    <div class="table-component__message">
+      There are no matching results
+    </div>
+    <div style="display: none;">
+      <!---->
+    </div>
+    <!---->
+  </div>
+</div>
+
+`;
+
 exports[`TableComponent can display a custom message when filtering results in no results 1`] = `
 
 <div id="app">