test: check order of items in folder with non-existing item in ordering

graasp · Jun 23, 2021 · 62a898d · 62a898d
1 parent 5876947
commit 62a898d
Show file tree

Hide file tree

Showing 4 changed files with 109 additions and 23 deletions.
diff --git a/cypress/fixtures/items.js b/cypress/fixtures/items.js
@@ -267,3 +267,62 @@ export const ITEM_REORDER_ITEMS = {
     },
   ],
 };
+
+export const ORDERED_ITEMS = {
+  parent: {
+    ...DEFAULT_FOLDER_ITEM,
+    id: 'ecafbd2a-5688-11eb-ae93-0242ac130002',
+    name: 'parent',
+    path: 'ecafbd2a_5688_11eb_ae93_0242ac130002',
+    extra: {
+      image: 'someimageurl',
+      folder: {
+        childrenOrder: [
+          'adf09f5a-5688-11eb-ae93-0242ac130005',
+          'adf09f5a-5688-11eb-ae93-0242ac130003',
+          // item id below does not belong to any item
+          'adf09f5a-5688-11eb-ae93-0242ac130006',
+          'adf09f5a-5688-11eb-ae93-0242ac130004',
+        ],
+      },
+    },
+  },
+  children: [
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'adf09f5a-5688-11eb-ae93-0242ac130003',
+      name: 'child1',
+      path:
+        'ecafbd2a_5688_11eb_ae93_0242ac130002.adf09f5a_5688_11eb_ae93_0242ac130003',
+      extra: {
+        image: 'someimageurl',
+      },
+    },
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'adf09f5a-5688-11eb-ae93-0242ac130004',
+      name: 'child2',
+      path:
+        'ecafbd2a_5688_11eb_ae93_0242ac130002.adf09f5a_5688_11eb_ae93_0242ac130004',
+      extra: {
+        image: 'someimageurl',
+      },
+    },
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'adf09f5a-5688-11eb-ae93-0242ac130005',
+      name: 'child3',
+      path:
+        'ecafbd2a_5688_11eb_ae93_0242ac130002.adf09f5a_5688_11eb_ae93_0242ac130005',
+      extra: {
+        image: 'someimageurl',
+      },
+    },
+  ],
+  // The order below is the order in which the existing children should appear
+  existingChildrenOrder: [
+    'adf09f5a-5688-11eb-ae93-0242ac130005',
+    'adf09f5a-5688-11eb-ae93-0242ac130003',
+    'adf09f5a-5688-11eb-ae93-0242ac130004',
+  ],
+};
diff --git a/cypress/integration/item/order/reorderItems.spec.js b/cypress/integration/item/order/reorderItems.spec.js
@@ -1,6 +1,9 @@
 import { buildItemPath } from '../../../../src/config/paths';
-import { ITEM_REORDER_ITEMS } from '../../../fixtures/items';
-import { buildItemsTableRowId } from '../../../../src/config/selectors';
+import { ITEM_REORDER_ITEMS, ORDERED_ITEMS } from '../../../fixtures/items';
+import {
+  buildItemsTableRowId,
+  ITEMS_TABLE_BODY,
+} from '../../../../src/config/selectors';
 import { ROW_HEIGHT } from '../../../support/constants';
 
 const reorderAndCheckItem = (id, currentPosition, newPosition) => {
@@ -20,37 +23,58 @@ const reorderAndCheckItem = (id, currentPosition, newPosition) => {
 };
 
 describe('Order Items', () => {
-  beforeEach(() => {
-    cy.setUpApi({
-      items: [ITEM_REORDER_ITEMS.parent, ...ITEM_REORDER_ITEMS.children],
+  describe('Move Item', () => {
+    beforeEach(() => {
+      cy.setUpApi({
+        items: [ITEM_REORDER_ITEMS.parent, ...ITEM_REORDER_ITEMS.children],
+      });
+      cy.visit(buildItemPath(ITEM_REORDER_ITEMS.parent.id));
     });
-    cy.visit(buildItemPath(ITEM_REORDER_ITEMS.parent.id));
-  });
 
-  it('move item to a spot below', () => {
-    const currentPosition = 0;
-    const newPosition = 1;
+    it('move item to a spot below', () => {
+      const currentPosition = 0;
+      const newPosition = 1;
 
-    const { id: childId } = ITEM_REORDER_ITEMS.children[currentPosition];
+      const { id: childId } = ITEM_REORDER_ITEMS.children[currentPosition];
 
-    reorderAndCheckItem(childId, currentPosition, newPosition);
-  });
+      reorderAndCheckItem(childId, currentPosition, newPosition);
+    });
+
+    it('move first item to last spot', () => {
+      const currentPosition = 0;
+      const newPosition = 2;
+
+      const { id: childId } = ITEM_REORDER_ITEMS.children[currentPosition];
 
-  it('move first item to last spot', () => {
-    const currentPosition = 0;
-    const newPosition = 2;
+      reorderAndCheckItem(childId, currentPosition, newPosition);
+    });
+
+    it('move middle item to top spot', () => {
+      const currentPosition = 1;
+      const newPosition = 0;
 
-    const { id: childId } = ITEM_REORDER_ITEMS.children[currentPosition];
+      const { id: childId } = ITEM_REORDER_ITEMS.children[currentPosition];
 
-    reorderAndCheckItem(childId, currentPosition, newPosition);
+      reorderAndCheckItem(childId, currentPosition, newPosition);
+    });
   });
 
-  it('move middle item to top spot', () => {
-    const currentPosition = 1;
-    const newPosition = 0;
+  describe('Check Order', () => {
+    it('check item order in folder with non-existing item in ordering', () => {
+      cy.setUpApi({
+        items: [ORDERED_ITEMS.parent, ...ORDERED_ITEMS.children],
+      });
 
-    const { id: childId } = ITEM_REORDER_ITEMS.children[currentPosition];
+      cy.visit(buildItemPath(ORDERED_ITEMS.parent.id));
 
-    reorderAndCheckItem(childId, currentPosition, newPosition);
+      const tableBody = `#${ITEMS_TABLE_BODY}`;
+
+      ORDERED_ITEMS.existingChildrenOrder.forEach((id, index) => {
+        cy.get(tableBody)
+          .children()
+          .eq(index)
+          .should('have.id', buildItemsTableRowId(id));
+      });
+    });
   });
 });
diff --git a/src/components/main/ItemsTable.js b/src/components/main/ItemsTable.js
@@ -23,6 +23,7 @@ import ShareButton from '../common/ShareButton';
 import DeleteButton from '../common/DeleteButton';
 import {
   buildItemsTableRowId,
+  ITEMS_TABLE_BODY,
   ITEMS_TABLE_EMPTY_ROW_ID,
   ITEMS_TABLE_ROW_CHECKBOX_CLASS,
 } from '../../config/selectors';
@@ -298,6 +299,7 @@ const ItemsTable = ({ items: rows, tableTitle, id: tableId }) => {
             />
             <TableBody
               component={itemId ? DroppableTableBody(onDragEnd) : TableBody}
+              id={ITEMS_TABLE_BODY}
             >
               {mappedRows.map((row, index) => {
                 const isItemSelected = isSelected(row.id);

diff --git a/src/config/selectors.js b/src/config/selectors.js
@@ -32,6 +32,7 @@ export const MODE_LIST_BUTTON_ID = 'modeListButton';
 export const MODE_GRID_BUTTON_ID = 'modeCardButton';
 export const SHARED_ITEMS_ID = 'sharedItems';
 export const OWNED_ITEMS_ID = 'ownedItems';
+export const ITEMS_TABLE_BODY = 'itemsTableBody';
 export const buildItemsTableRowId = (id) => `itemsTableRow-${id}`;
 export const ITEMS_TABLE_EMPTY_ROW_ID = 'itemsTableEmptyRow';
 export const ITEMS_TABLE_DELETE_SELECTED_ITEMS_ID =