Items view tests

src/components/ui/VnSearchBar.vue

@@ -71,6 +71,7 @@ onMounted(() => {
         is-outlined
         :clearable="false"
         class="searchbar"
+        data-testid="searchBar"
     >
         <template #prepend>
             <QIcon name="search" class="cursor-pointer" @click="search()" />

src/pages/Admin/ItemsView.vue

@@ -44,11 +44,13 @@ const onSearch = data => (items.value = data || []);
             empty-icon="refresh"
             :loading="loading"
             :rows="items"
+            data-testid="itemsViewList"
         >
             <CardList
                 v-for="(item, index) in items"
                 :key="index"
                 :clickable="false"
+                data-testid="itemsViewCard"
             >
                 <template #prepend>
                     <VnImg

src/test/cypress/integration/admin/ItemsView.spec.js

@@ -0,0 +1,26 @@
+describe('NewsView', () => {
+    beforeEach(() => {
+        cy.login('developer');
+        cy.visit('/#/admin/items');
+    });
+
+    it('shows empty state', () => {
+        cy.dataCy('itemsViewList').should('exist');
+        cy.dataCy('itemsViewList').should(
+            'contain',
+            'Introduce un término de búsqueda'
+        );
+        cy.dataCy('itemsViewCard').should('not.exist');
+    });
+
+    it('search for an item', () => {
+        cy.dataCy('searchBar').should('exist');
+        cy.get('input[data-testid="searchBar"]').type('Bolas de madera{enter}');
+        cy.dataCy('itemsViewList').should(
+            'not.contain',
+            'Introduce un término de búsqueda'
+        );
+        cy.dataCy('itemsViewCard').should('exist');
+        cy.dataCy('itemsViewCard').should('contain', 'Bolas de madera');
+    });
+});