feat: update mode button, refactor (#1030)

* refactor: update mode button, refactor * refactor: apply PR requested changes * refactor: update cypress * refactor: mock item layout in commands * refactor: import automatically env in cypress * refactor: env in cypress * refactor: import VITE_GRAASP_REDIRECTION_HOST * refactor: use cypress baseurl
graasp · Feb 29, 2024 · 1ee57ef · 1ee57ef
1 parent 3a9ca9d
commit 1ee57ef
Show file tree

Hide file tree

Showing 76 changed files with 531 additions and 567 deletions.
diff --git a/.github/workflows/cypress.yml b/.github/workflows/cypress.yml
@@ -3,7 +3,7 @@ name: Cypress CI
 on:
   push:
     branches:
-      - "main"
+      - 'main'
   merge_group:
   pull_request:
 
@@ -45,11 +45,11 @@ jobs:
           VITE_GRAASP_LIBRARY_HOST: ${{ vars.VITE_GRAASP_LIBRARY_HOST }}
           VITE_GRAASP_ANALYZER_HOST: ${{ vars.VITE_GRAASP_ANALYZER_HOST }}
           VITE_SHOW_NOTIFICATIONS: ${{ vars.VITE_SHOW_NOTIFICATIONS }}
-          VITE_GRAASP_REDIRECTION_HOST:  ${{ vars.VITE_GRAASP_REDIRECTION_HOST }}
+          VITE_GRAASP_REDIRECTION_HOST: ${{ vars.VITE_GRAASP_REDIRECTION_HOST }}
 
       #  use the Cypress GitHub Action to run Cypress tests within the chrome browser
       - name: Cypress run
-        uses: cypress-io/github-action@v5
+        uses: cypress-io/github-action@v6
         with:
           install: false
           # we launch the app in preview mode to avoid issues with hmr websockets from vite polluting the mocks

diff --git a/cypress.config.ts b/cypress.config.ts
@@ -9,13 +9,15 @@ export default defineConfig({
   chromeWebSecurity: false,
   e2e: {
     env: {
-      API_HOST: process.env.VITE_GRAASP_API_HOST,
-      AUTH_HOST: process.env.VITE_GRAASP_AUTH_HOST,
-      BUILDER_HOST: `http://localhost:${process.env.VITE_PORT}`,
-      PLAYER_HOST: process.env.VITE_GRAASP_PLAYER_HOST,
-      ANALYZER_HOST: process.env.VITE_GRAASP_ANALYZER_HOST,
-      LIBRARY_HOST: process.env.VITE_GRAASP_LIBRARY_HOST,
-      REDIRECTION_HOST: process.env.VITE_GRAASP_REDIRECTION_HOST,
+      VITE_GRAASP_REDIRECTION_HOST: process.env.VITE_GRAASP_REDIRECTION_HOST,
+      VITE_GRAASP_DOMAIN: process.env.VITE_GRAASP_DOMAIN,
+      VITE_GRAASP_API_HOST: process.env.VITE_GRAASP_API_HOST,
+      VITE_SHOW_NOTIFICATIONS: false,
+      VITE_GRAASP_AUTH_HOST: process.env.VITE_GRAASP_AUTH_HOST,
+      VITE_GRAASP_PLAYER_HOST: process.env.VITE_GRAASP_PLAYER_HOST,
+      VITE_GRAASP_ANALYZER_HOST: process.env.VITE_GRAASP_ANALYZER_HOST,
+      VITE_GRAASP_LIBRARY_HOST: process.env.VITE_GRAASP_LIBRARY_HOST,
+      VITE_GRAASP_ACCOUNT_HOST: process.env.VITE_GRAASP_ACCOUNT_HOST,
     },
     // We've imported your old cypress plugins here.
     // You may want to clean this up later by importing these.

diff --git a/cypress/e2e/item/copy/gridCopyItem.cy.ts b/cypress/e2e/item/copy/gridCopyItem.cy.ts
@@ -6,7 +6,7 @@ import {
   buildItemMenu,
   buildItemMenuButtonId,
 } from '../../../../src/config/selectors';
-import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
+import { ItemLayoutMode } from '../../../../src/enums';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 
 const copyItem = ({
@@ -28,7 +28,7 @@ describe('Copy Item in Grid', () => {
   it('copy item on Home', () => {
     cy.setUpApi(SAMPLE_ITEMS);
     cy.visit(HOME_PATH);
-    cy.switchMode(ITEM_LAYOUT_MODES.GRID);
+    cy.switchMode(ItemLayoutMode.Grid);
 
     // copy
     const { id: copyItemId } = SAMPLE_ITEMS.items[0];
@@ -47,7 +47,7 @@ describe('Copy Item in Grid', () => {
 
     // go to children item
     cy.visit(buildItemPath(id));
-    cy.switchMode(ITEM_LAYOUT_MODES.GRID);
+    cy.switchMode(ItemLayoutMode.Grid);
 
     // copy
     const { id: copyItemId } = SAMPLE_ITEMS.items[2];
@@ -67,7 +67,7 @@ describe('Copy Item in Grid', () => {
 
     // go to children item
     cy.visit(buildItemPath(id));
-    cy.switchMode(ITEM_LAYOUT_MODES.GRID);
+    cy.switchMode(ItemLayoutMode.Grid);
 
     // copy
     const { id: copyItemId } = SAMPLE_ITEMS.items[2];

diff --git a/cypress/e2e/item/copy/listCopyItem.cy.ts b/cypress/e2e/item/copy/listCopyItem.cy.ts
@@ -6,7 +6,7 @@ import {
   buildItemMenuButtonId,
   buildItemsTableRowIdAttribute,
 } from '../../../../src/config/selectors';
-import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+import ItemLayoutMode from '../../../../src/enums/itemLayoutMode';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 
 const copyItem = ({
@@ -27,7 +27,7 @@ describe('Copy Item in List', () => {
   it('copy item on Home', () => {
     cy.setUpApi(SAMPLE_ITEMS);
     cy.visit(HOME_PATH);
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // copy
     const { id: copyItemId } = SAMPLE_ITEMS.items[0];
@@ -46,7 +46,7 @@ describe('Copy Item in List', () => {
 
     // go to children item
     cy.visit(buildItemPath(id));
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // copy
     const { id: copyItemId } = SAMPLE_ITEMS.items[2];
@@ -66,7 +66,7 @@ describe('Copy Item in List', () => {
 
     // go to children item
     cy.visit(buildItemPath(id));
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // copy
     const { id: copyItemId } = SAMPLE_ITEMS.items[2];

diff --git a/cypress/e2e/item/copy/listCopyMultiple.cy.ts b/cypress/e2e/item/copy/listCopyMultiple.cy.ts
@@ -4,7 +4,7 @@ import {
   MY_GRAASP_ITEM_PATH,
   buildItemsTableRowIdAttribute,
 } from '../../../../src/config/selectors';
-import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+import ItemLayoutMode from '../../../../src/enums/itemLayoutMode';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 
 const copyItems = ({
@@ -30,7 +30,7 @@ describe('Copy items in List', () => {
     cy.setUpApi(SAMPLE_ITEMS);
     cy.visit(HOME_PATH);
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     const itemIds = [SAMPLE_ITEMS.items[0].id, SAMPLE_ITEMS.items[5].id];
     const { path: toItemPath } = SAMPLE_ITEMS.items[1];
@@ -50,7 +50,7 @@ describe('Copy items in List', () => {
 
     // go to children item
     cy.visit(buildItemPath(start));
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // copy
     const itemIds = [SAMPLE_ITEMS.items[2].id, SAMPLE_ITEMS.items[4].id];
@@ -72,7 +72,7 @@ describe('Copy items in List', () => {
 
     // go to children item
     cy.visit(buildItemPath(start));
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // copy
     const itemIds = [SAMPLE_ITEMS.items[2].id, SAMPLE_ITEMS.items[4].id];

diff --git a/cypress/e2e/item/create/createApp.cy.ts b/cypress/e2e/item/create/createApp.cy.ts
@@ -1,5 +1,5 @@
 import { HOME_PATH, buildItemPath } from '../../../../src/config/paths';
-import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+import ItemLayoutMode from '../../../../src/enums/itemLayoutMode';
 import {
   GRAASP_APP_ITEM,
   GRAASP_CUSTOM_APP_ITEM,
@@ -14,7 +14,7 @@ describe('Create App', () => {
       cy.setUpApi();
       cy.visit(HOME_PATH);
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createApp(GRAASP_APP_ITEM, { id: APPS_LIST[0].id });
@@ -29,7 +29,7 @@ describe('Create App', () => {
       cy.setUpApi();
       cy.visit(HOME_PATH);
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createApp(GRAASP_APP_ITEM, { custom: true });
@@ -49,7 +49,7 @@ describe('Create App', () => {
       // go to children item
       cy.visit(buildItemPath(id));
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createApp(GRAASP_APP_ITEM, { id: APPS_LIST[0].id });
@@ -67,7 +67,7 @@ describe('Create App', () => {
       // go to children item
       cy.visit(buildItemPath(id));
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createApp(GRAASP_CUSTOM_APP_ITEM, { custom: true });

diff --git a/cypress/e2e/item/create/createDocument.cy.ts b/cypress/e2e/item/create/createDocument.cy.ts
@@ -1,7 +1,7 @@
 import { ITEM_FORM_CONFIRM_BUTTON_ID } from '@/config/selectors';
 
 import { HOME_PATH, buildItemPath } from '../../../../src/config/paths';
-import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+import ItemLayoutMode from '../../../../src/enums/itemLayoutMode';
 import {
   GRAASP_DOCUMENT_BLANK_NAME_ITEM,
   GRAASP_DOCUMENT_ITEM,
@@ -14,7 +14,7 @@ describe('Create Document', () => {
     cy.setUpApi();
     cy.visit(HOME_PATH);
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // create
     createDocument(GRAASP_DOCUMENT_ITEM);
@@ -32,7 +32,7 @@ describe('Create Document', () => {
     // go to children item
     cy.visit(buildItemPath(id));
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // create
     createDocument(GRAASP_DOCUMENT_ITEM);
@@ -47,7 +47,7 @@ describe('Create Document', () => {
     cy.setUpApi();
     cy.visit(HOME_PATH);
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
     createDocument(GRAASP_DOCUMENT_BLANK_NAME_ITEM, { confirm: false });
 
     cy.get(`#${ITEM_FORM_CONFIRM_BUTTON_ID}`).should(

diff --git a/cypress/e2e/item/create/createFile.cy.ts b/cypress/e2e/item/create/createFile.cy.ts
@@ -1,5 +1,5 @@
 // import { HOME_PATH, buildItemPath } from '../../../../src/config/paths';
-// import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+// import ItemLayoutMode from '../../../../src/enums/itemLayoutModes';
 // import { IMAGE_ITEM_DEFAULT, IMAGE_ITEM_S3 } from '../../../fixtures/files';
 // import { SAMPLE_ITEMS } from '../../../fixtures/items';
 // import { CREATE_ITEM_PAUSE } from '../../../support/constants';
@@ -12,7 +12,7 @@
 //     cy.setUpApi();
 //     cy.visit(HOME_PATH);
 
-//     cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+//     cy.switchMode(ItemLayoutMode.List);
 
 //     // create
 //     createFile(IMAGE_ITEM_DEFAULT);
@@ -32,7 +32,7 @@
 //     // go to children item
 //     cy.visit(buildItemPath(id));
 
-//     cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+//     cy.switchMode(ItemLayoutMode.List);
 
 //     // create
 //     createFile(IMAGE_ITEM_S3);

diff --git a/cypress/e2e/item/create/createFolder.cy.ts b/cypress/e2e/item/create/createFolder.cy.ts
@@ -5,7 +5,7 @@ import {
   ITEM_FORM_NAME_INPUT_ID,
   buildItemsTableRowIdAttribute,
 } from '../../../../src/config/selectors';
-import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+import ItemLayoutMode from '../../../../src/enums/itemLayoutMode';
 import {
   CREATED_BLANK_NAME_ITEM,
   CREATED_ITEM,
@@ -19,7 +19,7 @@ describe('Create Folder', () => {
       cy.setUpApi();
       cy.visit(HOME_PATH);
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createFolder(CREATED_ITEM);
@@ -34,7 +34,7 @@ describe('Create Folder', () => {
       // go to children item
       cy.visit(buildItemPath(id));
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createFolder(CREATED_ITEM);
@@ -58,7 +58,7 @@ describe('Create Folder', () => {
     it('create folder on Home', () => {
       cy.setUpApi();
       cy.visit(HOME_PATH);
-      cy.switchMode(ITEM_LAYOUT_MODES.GRID);
+      cy.switchMode(ItemLayoutMode.Grid);
 
       // create
       createFolder(CREATED_ITEM);
@@ -77,7 +77,7 @@ describe('Create Folder', () => {
 
       // go to children item
       cy.visit(buildItemPath(id));
-      cy.switchMode(ITEM_LAYOUT_MODES.GRID);
+      cy.switchMode(ItemLayoutMode.Grid);
 
       // create
       createFolder(CREATED_ITEM);
@@ -97,7 +97,7 @@ describe('Create Folder', () => {
       // go to children item
       cy.visit(buildItemPath(id));
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createFolder(CREATED_ITEM);

diff --git a/cypress/e2e/item/create/createLink.cy.ts b/cypress/e2e/item/create/createLink.cy.ts
@@ -1,6 +1,6 @@
 import { HOME_PATH, buildItemPath } from '../../../../src/config/paths';
 import { ITEM_FORM_CONFIRM_BUTTON_ID } from '../../../../src/config/selectors';
-import ITEM_LAYOUT_MODES from '../../../../src/enums/itemLayoutModes';
+import ItemLayoutMode from '../../../../src/enums/itemLayoutMode';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 import {
   GRAASP_LINK_ITEM,
@@ -15,7 +15,7 @@ describe('Create Link', () => {
     cy.setUpApi();
     cy.visit(HOME_PATH);
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // create
     createLink(GRAASP_LINK_ITEM);
@@ -33,7 +33,7 @@ describe('Create Link', () => {
     cy.setUpApi();
     cy.visit(HOME_PATH);
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // create
     createLink(GRAASP_LINK_ITEM_NO_PROTOCOL);
@@ -54,7 +54,7 @@ describe('Create Link', () => {
     // go to children item
     cy.visit(buildItemPath(id));
 
-    cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    cy.switchMode(ItemLayoutMode.List);
 
     // create
     createLink(GRAASP_LINK_ITEM);
@@ -76,7 +76,7 @@ describe('Create Link', () => {
       // go to children item
       cy.visit(buildItemPath(id));
 
-      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+      cy.switchMode(ItemLayoutMode.List);
 
       // create
       createLink(INVALID_LINK_ITEM, {