17500: Allows Cypress tests to navigate using the app's router.

* Provides direct access to the browser's history so tests can push new URLs
  instead of using cy.visit() that makes the entire app to reload.
* Also, sets larger timeout on cy.loginAs() command as sometimes the first time
  it's used takes more than 4000ms to respond, making tests fail.
* Updates tests that use visit() or doSearch() so that they use the quicker and
  more reliable goToPath() command.

Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas@di-pentima.com.ar>

diff --git a/cypress/integration/collection.spec.js b/cypress/integration/collection.spec.js
index 841197abcfdc5a0b130ce9759e7760bc93d48584..05cd097dcbdaaae34e7efa74edf61d11859f1acb 100644 (file)
--- a/cypress/integration/collection.spec.js
+++ b/cypress/integration/collection.spec.js
@@ -36,7 +36,7 @@ describe('Collection panel tests', function () {
         })
             .as('testCollection').then(function () {
                 cy.loginAs(activeUser);
-                cy.doSearch(`${this.testCollection.uuid}`);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                 // Key: Color (IDTAGCOLORS) - Value: Magenta (IDVALCOLORS3)
                 cy.get('[data-cy=resource-properties-form]').within(() => {
@@ -89,7 +89,7 @@ describe('Collection panel tests', function () {
                             head_uuid: this.sharedGroup.uuid,
                             tail_uuid: activeUser.user.uuid
                         })
-                        cy.doSearch(`${this.testCollection.uuid}`);
+                        cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                         // Check that name & uuid are correct.
                         cy.get('[data-cy=collection-info-panel]')
@@ -185,7 +185,7 @@ describe('Collection panel tests', function () {
         })
             .as('testCollection').then(function () {
                 cy.loginAs(activeUser);
-                cy.doSearch(`${this.testCollection.uuid}`);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                 const names = [
                     'bar', // initial name already set
@@ -238,7 +238,7 @@ describe('Collection panel tests', function () {
         })
             .as('testCollection').then(function () {
                 cy.loginAs(activeUser);
-                cy.doSearch(`${this.testCollection.uuid}`);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                 ['subdir', 'G%C3%BCnter\'s%20file', 'table%&?*2'].forEach((subdir) => {
                     cy.get('[data-cy=collection-files-panel]')
@@ -295,7 +295,7 @@ describe('Collection panel tests', function () {
         })
             .as('testCollection').then(function () {
                 cy.loginAs(activeUser);
-                cy.doSearch(`${this.testCollection.uuid}`);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                 const illegalNamesFromUI = [
                     ['.', "Name cannot be '.' or '..'"],
@@ -371,7 +371,7 @@ describe('Collection panel tests', function () {
                 });
                 // Check the old version displays as what it is.
                 cy.loginAs(activeUser)
-                cy.doSearch(`${oldVersionUuid}`);
+                cy.goToPath(`/collections/${oldVersionUuid}`);
 
                 cy.get('[data-cy=collection-info-panel]').should('contain', 'This is an old version');
                 cy.get('[data-cy=read-only-icon]').should('exist');
@@ -394,7 +394,7 @@ describe('Collection panel tests', function () {
             .as('collection').then(function () {
                 // Visit collection, check basic information
                 cy.loginAs(activeUser)
-                cy.doSearch(`${this.collection.uuid}`);
+                cy.goToPath(`/collections/${this.collection.uuid}`);
 
                 cy.get('[data-cy=collection-info-panel]').should('not.contain', 'This is an old version');
                 cy.get('[data-cy=read-only-icon]').should('not.exist');
@@ -510,7 +510,7 @@ describe('Collection panel tests', function () {
 
     it('creates new collection on home project', function () {
         cy.loginAs(activeUser);
-        cy.doSearch(`${activeUser.user.uuid}`);
+        cy.goToPath(`/projects/${activeUser.user.uuid}`);
         cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
         cy.get('[data-cy=breadcrumb-last]').should('not.exist');
         // Create new collection

diff --git a/cypress/integration/delete-multiple-files.spec.js b/cypress/integration/delete-multiple-files.spec.js
index f9e87117d804e42837dad267d85ccc41f55a36b4..deb56f66e72a0bc69a8e137fb7efc2b635d8eff2 100644 (file)
--- a/cypress/integration/delete-multiple-files.spec.js
+++ b/cypress/integration/delete-multiple-files.spec.js
@@ -32,7 +32,7 @@ describe('Multi-file deletion tests', function () {
         })
             .as('testCollection').then(function () {
                 cy.loginAs(activeUser);
-                cy.doSearch(`${this.testCollection.uuid}`);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                 cy.get('[data-cy=collection-files-panel]').within(() => {
                     cy.get('[type="checkbox"]').first().check();
@@ -55,7 +55,7 @@ describe('Multi-file deletion tests', function () {
         })
             .as('testCollection').then(function () {
                 cy.loginAs(activeUser);
-                cy.doSearch(`${this.testCollection.uuid}`);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
 
                 cy.get('[data-cy=virtual-file-tree] > div > i').first().click();
                 cy.get('[data-cy=collection-files-panel]')

diff --git a/cypress/integration/favorites.spec.js b/cypress/integration/favorites.spec.js
index c745e267174050a4c901d323d37ac0bf90921f90..b0feb30b86472c283d13b61cbbe993c2ae3af48b 100644 (file)
--- a/cypress/integration/favorites.spec.js
+++ b/cypress/integration/favorites.spec.js
@@ -131,8 +131,6 @@ describe('Favorites tests', function () {
             .then(function ([mySharedWritableProject, mySharedReadonlyProject, myProject1, testCollection]) {
                 cy.loginAs(activeUser);
 
-                cy.doSearch(`${activeUser.user.uuid}`);
-
                 cy.contains(testCollection.name).rightclick();
                 cy.get('[data-cy=context-menu]').within(() => {
                     cy.contains('Move to').click();
@@ -148,7 +146,7 @@ describe('Favorites tests', function () {
                     cy.get('[data-cy=form-submit-btn]').click();
                 });
 
-                cy.doSearch(`${mySharedWritableProject.uuid}`);
+                cy.goToPath(`/projects/${mySharedWritableProject.uuid}`);
                 cy.get('main').contains(testCollection.name);
             });
     });
@@ -176,8 +174,6 @@ describe('Favorites tests', function () {
 
         cy.getAll('@mySharedWritableProject', '@mySharedReadonlyProject', '@myProject1')
             .then(function ([mySharedWritableProject, mySharedReadonlyProject, myProject1]) {
-                cy.loginAs(activeUser);
-
                 cy.createWorkflow(adminUser.token, {
                     name: `TestWorkflow${Math.floor(Math.random() * 999999)}.cwl`,
                     definition: "{\n    \"$graph\": [\n        {\n            \"class\": \"Workflow\",\n            \"doc\": \"Reverse the lines in a document, then sort those lines.\",\n            \"hints\": [\n                {\n                    \"acrContainerImage\": \"99b0201f4cade456b4c9d343769a3b70+261\",\n                    \"class\": \"http://arvados.org/cwl#WorkflowRunnerResources\"\n                }\n            ],\n            \"id\": \"#main\",\n            \"inputs\": [\n                {\n                    \"default\": null,\n                    \"doc\": \"The input file to be processed.\",\n                    \"id\": \"#main/input\",\n                    \"type\": \"File\"\n                },\n                {\n                    \"default\": true,\n                    \"doc\": \"If true, reverse (decending) sort\",\n                    \"id\": \"#main/reverse_sort\",\n                    \"type\": \"boolean\"\n                }\n            ],\n            \"outputs\": [\n                {\n                    \"doc\": \"The output with the lines reversed and sorted.\",\n                    \"id\": \"#main/output\",\n                    \"outputSource\": \"#main/sorted/output\",\n                    \"type\": \"File\"\n                }\n            ],\n            \"steps\": [\n                {\n                    \"id\": \"#main/rev\",\n                    \"in\": [\n                        {\n                            \"id\": \"#main/rev/input\",\n                            \"source\": \"#main/input\"\n                        }\n                    ],\n                    \"out\": [\n                        \"#main/rev/output\"\n                    ],\n                    \"run\": \"#revtool.cwl\"\n                },\n                {\n                    \"id\": \"#main/sorted\",\n                    \"in\": [\n                        {\n                            \"id\": \"#main/sorted/input\",\n                            \"source\": \"#main/rev/output\"\n                        },\n                        {\n                            \"id\": \"#main/sorted/reverse\",\n                            \"source\": \"#main/reverse_sort\"\n                        }\n                    ],\n                    \"out\": [\n                        \"#main/sorted/output\"\n                    ],\n                    \"run\": \"#sorttool.cwl\"\n                }\n            ]\n        },\n        {\n            \"baseCommand\": \"rev\",\n            \"class\": \"CommandLineTool\",\n            \"doc\": \"Reverse each line using the `rev` command\",\n            \"hints\": [\n                {\n                    \"class\": \"ResourceRequirement\",\n                    \"ramMin\": 8\n                }\n            ],\n            \"id\": \"#revtool.cwl\",\n            \"inputs\": [\n                {\n                    \"id\": \"#revtool.cwl/input\",\n                    \"inputBinding\": {},\n                    \"type\": \"File\"\n                }\n            ],\n            \"outputs\": [\n                {\n                    \"id\": \"#revtool.cwl/output\",\n                    \"outputBinding\": {\n                        \"glob\": \"output.txt\"\n                    },\n                    \"type\": \"File\"\n                }\n            ],\n            \"stdout\": \"output.txt\"\n        },\n        {\n            \"baseCommand\": \"sort\",\n            \"class\": \"CommandLineTool\",\n            \"doc\": \"Sort lines using the `sort` command\",\n            \"hints\": [\n                {\n                    \"class\": \"ResourceRequirement\",\n                    \"ramMin\": 8\n                }\n            ],\n            \"id\": \"#sorttool.cwl\",\n            \"inputs\": [\n                {\n                    \"id\": \"#sorttool.cwl/reverse\",\n                    \"inputBinding\": {\n                        \"position\": 1,\n                        \"prefix\": \"-r\"\n                    },\n                    \"type\": \"boolean\"\n                },\n                {\n                    \"id\": \"#sorttool.cwl/input\",\n                    \"inputBinding\": {\n                        \"position\": 2\n                    },\n                    \"type\": \"File\"\n                }\n            ],\n            \"outputs\": [\n                {\n                    \"id\": \"#sorttool.cwl/output\",\n                    \"outputBinding\": {\n                        \"glob\": \"output.txt\"\n                    },\n                    \"type\": \"File\"\n                }\n            ],\n            \"stdout\": \"output.txt\"\n        }\n    ],\n    \"cwlVersion\": \"v1.0\"\n}",
@@ -192,9 +188,7 @@ describe('Favorites tests', function () {
                 })
                     .as('testWorkflow2');
 
-                cy.contains('Shared with me').click();
-
-                cy.doSearch(`${activeUser.user.uuid}`);
+                cy.loginAs(activeUser);
 
                 cy.get('main').contains(myProject1.name).click();
 

diff --git a/cypress/integration/page-not-found.spec.js b/cypress/integration/page-not-found.spec.js
index 3dd15a67970668fdb2772352185b170138d0e36c..5d6a26b7d654ee0d2adc7c8f8fbdbccca9dc344b 100644 (file)
--- a/cypress/integration/page-not-found.spec.js
+++ b/cypress/integration/page-not-found.spec.js
@@ -19,12 +19,9 @@ describe('Page not found tests', function() {
     });
 
     it('shows not found page', function() {
-        // given
-        const invalidUUID = '1212r12r12r12r12r12r21r'
-
         // when
         cy.loginAs(adminUser);
-        cy.visit(`/collections/${invalidUUID}`);
+        cy.goToPath(`/this/is/an/invalid/route`);
 
         // then
         cy.get('[data-cy=not-found-page]').should('exist');
@@ -38,10 +35,10 @@ describe('Page not found tests', function() {
 
         // when
         cy.loginAs(adminUser);
-        cy.visit(`/projects/${notExistingUUID}`);
+        cy.goToPath(`/projects/${notExistingUUID}`);
 
         // then
-        cy.get('[data-cy=not-found-page]').should('not.exist');
         cy.get('[data-cy=not-found-content]').should('exist');
+        cy.get('[data-cy=not-found-page]').should('not.exist');
     });
 })
\ No newline at end of file

diff --git a/cypress/integration/project.spec.js b/cypress/integration/project.spec.js
index 69809b260e9be53a892fa6acc616fa0b33e8f449..76a6d0fff6373bfd09044742b03856d8b22ab340 100644 (file)
--- a/cypress/integration/project.spec.js
+++ b/cypress/integration/project.spec.js
@@ -88,7 +88,7 @@ describe('Project tests', function() {
         }
 
         cy.loginAs(activeUser);
-        cy.doSearch(`${activeUser.user.uuid}`);
+        cy.goToPath(`/projects/${activeUser.user.uuid}`);
         cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
         cy.get('[data-cy=breadcrumb-last]').should('not.exist');
         // Create new project

diff --git a/cypress/integration/side-panel.spec.js b/cypress/integration/side-panel.spec.js
index 8100a0e48135be15563a2a9e5f6d2eef6b26633b..8882494bf81c69e501d3a50092b558c502d2c5ac 100644 (file)
--- a/cypress/integration/side-panel.spec.js
+++ b/cypress/integration/side-panel.spec.js
@@ -30,7 +30,6 @@ describe('Side panel tests', function() {
 
     it('enables the +NEW side panel button on users home project', function() {
         cy.loginAs(activeUser);
-        cy.doSearch(`${activeUser.user.uuid}`);
         cy.get('[data-cy=side-panel-button]')
             .should('exist')
             .and('not.be.disabled');
@@ -49,7 +48,7 @@ describe('Side panel tests', function() {
                     head_uuid: this.sharedGroup.uuid,
                     tail_uuid: activeUser.user.uuid
                 })
-                cy.doSearch(`${this.sharedGroup.uuid}`);
+                cy.goToPath(`/projects/${this.sharedGroup.uuid}`);
                 cy.get('[data-cy=side-panel-button]')
                     .should('exist')
                     .and(`${isWritable ? 'not.' : ''}be.disabled`);
@@ -67,7 +66,7 @@ describe('Side panel tests', function() {
             {url: '/all_processes', label: 'All Processes'},
             {url: '/trash', label: 'Trash'},
         ].map(function(section) {
-            cy.visit(section.url);
+            cy.goToPath(section.url);
             cy.get('[data-cy=breadcrumb-first]')
                 .should('contain', section.label);
             cy.get('[data-cy=side-panel-button]')
@@ -84,7 +83,7 @@ describe('Side panel tests', function() {
             properties: {filters: []},
         }).as('myFavoriteFilterGroup').then(function (myFavoriteFilterGroup) {
             cy.contains('Refresh').click();
-            cy.doSearch(`${myFavoriteFilterGroup.uuid}`);
+            cy.goToPath(`/projects/${myFavoriteFilterGroup.uuid}`);
             cy.get('[data-cy=breadcrumb-last]').should('contain', 'my-favorite-filter-group');
 
             cy.get('[data-cy=side-panel-button]')

diff --git a/cypress/support/commands.js b/cypress/support/commands.js
index 2a7f350ae90e5a16b717f2a99aa72a6066af5c09..53099d37bf2a6e9d9a42172fdf76ff9b10df4062 100644 (file)
--- a/cypress/support/commands.js
+++ b/cypress/support/commands.js
@@ -176,7 +176,7 @@ Cypress.Commands.add(
 Cypress.Commands.add(
     "loginAs", (user) => {
         cy.visit(`/token/?api_token=${user.token}`);
-        cy.url().should('contain', '/projects/');
+        cy.url({timeout: 10000}).should('contain', '/projects/');
         cy.get('div#root').should('contain', 'Arvados Workbench (zzzzz)');
         cy.get('div#root').should('not.contain', 'Your account is inactive');
     }
@@ -188,6 +188,12 @@ Cypress.Commands.add(
     }
 )
 
+Cypress.Commands.add(
+    "goToPath", (path) => {
+        return cy.window().its('appHistory').invoke('push', path);
+    }
+)
+
 Cypress.Commands.add('getAll', (...elements) => {
     const promise = cy.wrap([], { log: false })
 

diff --git a/src/index.tsx b/src/index.tsx
index 43cfb5fb03e31513e7689561760a4246ec3a35d6..e691c5d2433d8ee4f9ec40a0783a7b8943ede938 100644 (file)
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -104,6 +104,13 @@ storeRedirects();
 fetchConfig()
     .then(({ config, apiHost }) => {
         const history = createBrowserHistory();
+
+        // Provide browser's history access to Cypress to allow programmatic
+        // navigation.
+        if ((window as any).Cypress) {
+            (window as any).appHistory = history;
+        }
+
         const services = createServices(config, {
             progressFn: (id, working) => {
                 store.dispatch(progressIndicatorActions.TOGGLE_WORKING({ id, working }));