test: add tests for import zip feature

cypress/fixtures/files.js

@@ -65,6 +65,11 @@ export const PDF_ITEM_DEFAULT = {
   filepath: 'files/doc.pdf',
 };
 
+export const ZIP_DEFAULT = {
+  type: ITEM_TYPES.ZIP,
+  filepath: 'files/graasp.zip',
+};
+
 export const IMAGE_ITEM_S3 = {
   id: 'ad5519a2-5ba9-4305-b221-185facbe6a99',
   name: 'icon.png',

cypress/integration/item/create/importZip.spec.js

@@ -0,0 +1,56 @@
+import { DEFAULT_ITEM_LAYOUT_MODE } from '../../../../src/config/constants';
+import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
+import { SAMPLE_ITEMS } from '../../../fixtures/items';
+import { ZIP_DEFAULT } from '../../../fixtures/files';
+import { buildItemPath, HOME_PATH } from '../../../../src/config/paths';
+import { createItem } from './utils';
+
+describe('Import Zip', () => {
+  it('import zip on Home', () => {
+    cy.setUpApi();
+    cy.visit(HOME_PATH);
+
+    if (DEFAULT_ITEM_LAYOUT_MODE !== ITEM_LAYOUT_MODES.LIST) {
+      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    }
+
+    // create
+    createItem(ZIP_DEFAULT);
+
+    cy.wait('@importZip');
+  });
+
+  it('create file in item', () => {
+    cy.setUpApi(SAMPLE_ITEMS);
+    const { id } = SAMPLE_ITEMS.items[0];
+    cy.visit(buildItemPath(id));
+
+    if (DEFAULT_ITEM_LAYOUT_MODE !== ITEM_LAYOUT_MODES.LIST) {
+      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    }
+
+    // create
+    createItem(ZIP_DEFAULT);
+
+    cy.wait('@importZip').then(({ response: { url } }) => {
+      expect(url).to.contain(id);
+    });
+  });
+
+  it.only('catch error', () => {
+    cy.setUpApi({ ...SAMPLE_ITEMS, importZipError: true });
+    const { id } = SAMPLE_ITEMS.items[0];
+    cy.visit(buildItemPath(id));
+
+    if (DEFAULT_ITEM_LAYOUT_MODE !== ITEM_LAYOUT_MODES.LIST) {
+      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    }
+
+    // create
+    createItem(ZIP_DEFAULT);
+
+    cy.wait('@importZip').then(({ response: { url } }) => {
+      expect(url).to.contain(id);
+    });
+  });
+});

cypress/integration/item/create/utils.js

@@ -7,6 +7,8 @@ import {
   CREATE_ITEM_FILE_ID,
   CREATE_ITEM_LINK_ID,
   DASHBOARD_UPLOADER_ID,
+  CREATE_ITEM_ZIP_ID,
+  ZIP_DASHBOARD_UPLOADER_ID,
 } from '../../../../src/config/selectors';
 import { getS3FileExtra } from '../../../../src/utils/itemExtra';
 
@@ -37,6 +39,19 @@ export const createItem = (payload, options) => {
       }
       break;
     }
+    case ITEM_TYPES.ZIP: {
+      const file = [payload?.filepath];
+      cy.get(`#${CREATE_ITEM_ZIP_ID}`).click();
+
+      // drag-drop a file in the uploader
+      cy.get(`#${ZIP_DASHBOARD_UPLOADER_ID} .uppy-Dashboard-input`).attachFile(
+        file,
+        {
+          subjectType: 'drag-n-drop',
+        },
+      );
+      break;
+    }
     case ITEM_TYPES.DOCUMENT:
       cy.get(`#${CREATE_ITEM_DOCUMENT_ID}`).click();
       cy.fillDocumentModal(payload, options);

cypress/support/commands.js

@@ -65,6 +65,7 @@ import {
   mockGetAvatar,
   mockPostItemThumbnail,
   mockPostAvatar,
+  mockImportZip,
 } from './server';
 import './commands/item';
 import './commands/navigation';
@@ -110,6 +111,7 @@ Cypress.Commands.add(
     getAvatarError = false,
     postItemThumbnailError = false,
     postAvatarError = false,
+    importZipError = false,
   } = {}) => {
     const cachedItems = JSON.parse(JSON.stringify(items));
     const cachedMembers = JSON.parse(JSON.stringify(members));
@@ -227,6 +229,8 @@ Cypress.Commands.add(
     mockPostItemThumbnail(postItemThumbnailError);
 
     mockPostAvatar(postAvatarError);
+
+    mockImportZip(importZipError);
   },
 );
 

cypress/support/server.js

@@ -76,6 +76,7 @@ const {
   buildGetMembersRoute,
   buildUploadItemThumbnailRoute,
   buildUploadAvatarRoute,
+  buildImportZipRoute,
 } = API_ROUTES;
 
 const API_HOST = Cypress.env('API_HOST');
@@ -724,6 +725,24 @@ export const mockUploadItem = (items, shouldThrowError) => {
   ).as('uploadItem');
 };
 
+export const mockImportZip = (shouldThrowError) => {
+  cy.intercept(
+    {
+      method: DEFAULT_POST.method,
+      url: new RegExp(
+        `${API_HOST}/${parseStringToRegExp(buildImportZipRoute())}`,
+      ),
+    },
+    ({ reply }) => {
+      if (shouldThrowError) {
+        return reply({ statusCode: StatusCodes.BAD_REQUEST });
+      }
+
+      return reply(false);
+    },
+  ).as('importZip');
+};
+
 export const mockDefaultDownloadFile = (items, shouldThrowError) => {
   cy.intercept(
     {

src/components/main/ImportZip.js

@@ -29,7 +29,7 @@ const ImportZip = () => {
     notifier({ type: routines.importZipRoutine.FAILURE });
   };
 
-  const onFilesAdded = () => {
+  const onFileAdded = () => {
     notifier({ type: routines.importZipRoutine.REQUEST });
   };
 
@@ -39,7 +39,7 @@ const ImportZip = () => {
         itemId,
         onComplete,
         onError,
-        onFilesAdded,
+        onFileAdded,
       }),
     );
 

src/utils/uppy.js

@@ -118,7 +118,6 @@ export const configureAvatarUppy = ({
     onUpload,
     onComplete,
     onError,
-    // autoProceed: false,
     fieldName: 'file',
     restrictions: {
       maxNumberOfFiles: 1,

yarn.lock

@@ -2168,7 +2168,7 @@ __metadata:
 
 "@graasp/query-client@git://github.com/graasp/graasp-query-client.git#102/importZip":
   version: 0.1.0
-  resolution: "@graasp/query-client@git://github.com/graasp/graasp-query-client.git#commit=610c7ff002170511103446cd34e760fea30a109b"
+  resolution: "@graasp/query-client@git://github.com/graasp/graasp-query-client.git#commit=16aa03493ba2a3d914a15aa330ebbb837a962c9e"
   dependencies:
     axios: 0.24.0
     http-status-codes: 2.1.4
@@ -2179,7 +2179,7 @@ __metadata:
     uuid: 8.3.2
   peerDependencies:
     react: ^17.0.0
-  checksum: 7cec90bd113a7d809ab4ce413c30f222afb71fdeae7b9e38d94288f9812a18ba8ce3fb57b667d9308fc540944957ac759e7ba63a9a739a41ede717f47d4c0443
+  checksum: 2a7585ea4327e8d4b91a381ee6b3f9be504a087b43ad44e9506c8d79a1759d211e08a5a1789df31646af3cf4514c0b631a0c0160f5ece77194ed8b74a5469ad5
   languageName: node
   linkType: hard