Page MenuHomeSoftware Heritage

Add directory view tests
ClosedPublic

Authored by kalpitk on Jun 19 2019, 2:15 PM.

Details

Summary

Related T1768

Diff Detail

Repository
rDWAPPS Web applications
Lint
Automatic diff as part of commit; lint not applicable.
Unit
Automatic diff as part of commit; unit tests not applicable.

Event Timeline

kalpitk retitled this revision from [WIP] Add directory view tests to Add directory view tests.Jun 20 2019, 12:20 PM
anlambert added a subscriber: anlambert.

Nice addition! I would like to improve those tests by dynamically getting the directory content through a call to the Software Heritage REST API.
This way we only need to hardcode the url to browse the directory to test.
I managed to implement this on top of your diff with the following changes:

diff --git a/cypress/integration/directory.spec.js b/cypress/integration/directory.spec.js
index c59e376c..944f2bc5 100644
--- a/cypress/integration/directory.spec.js
+++ b/cypress/integration/directory.spec.js
@@ -5,37 +5,56 @@
  * See top-level LICENSE file for more information
  */
 
-const url = 'browse/origin/https://github.com/memononen/libtess2/directory/';
-const numContent = 5;
-const numDirectory = 5;
-const firstSubDirectory = 'browse/origin/https://github.com/memononen/libtess2/directory/Bin/';
+import {httpGetJson} from './utils';
 
+const url = 'browse/origin/https://github.com/memononen/libtess2/directory/';
 const $ = Cypress.$;
 
+let dirs, files;
+
 describe('Directory Tests', function() {
-  beforeEach(function () {
+
+  before(function() {
+    cy.visit(url);
+    cy.window().then(async win => {
+      const metadata = win.swh.webapp.getBrowsedSwhObjectMetadata();
+      const apiUrl = Cypress.config().baseUrl + '/api/1/directory/' + metadata.directory;
+      let dirContent = await httpGetJson(apiUrl);
+      files = [];
+      dirs = [];
+      for (let entry of dirContent) {
+        if (entry.type === 'file') {
+          files.push(entry);
+        } else {
+          dirs.push(entry);
+        }
+      }
+    });
+  });
+
+  beforeEach(function() {
     cy.visit(url);
-  })
+  });
 
   it('should display all files and directories', function() {
     cy.get('.swh-directory')
-      .should('have.length', numDirectory)
+      .should('have.length', dirs.length)
       .and('be.visible');
     cy.get('.swh-content')
-      .should('have.length', numContent)
+      .should('have.length', files.length)
       .and('be.visible');
-  })
+  });
 
   it('should display sizes for files', function() {
     cy.get('.swh-content')
       .parent('tr')
       .then((rows) => {
-        for(let row of rows) {
+        for (let row of rows) {
           let text = $(row).children('td').eq(2).text();
           expect(text.trim()).to.not.be.empty;
         }
-      })
-  })
+      });
+  });
 
   it('should display readme when it is present', function() {
     cy.get('#readme-panel > .card-body')
@@ -43,7 +62,7 @@ describe('Directory Tests', function() {
       .and('have.class', 'swh-showdown')
       .and('not.be.empty')
       .and('not.contain', 'Readme bytes are not available');
-  })
+  });
 
   it('should open subdirectory when clicked', function() {
     cy.get('.swh-directory')
@@ -52,9 +71,9 @@ describe('Directory Tests', function() {
       .click();
 
     cy.url()
-      .should('include', firstSubDirectory);
+      .should('include', url + dirs[0]['name']);
 
     cy.get('.swh-directory-table')
       .should('exist');
-  })
-})
+  });
+});
diff --git a/cypress/integration/utils.js b/cypress/integration/utils.js
new file mode 100644
index 00000000..7ce558a8
--- /dev/null
+++ b/cypress/integration/utils.js
@@ -0,0 +1,6 @@
+import axios from 'axios';
+
+export async function httpGetJson(url) {
+  const response = await axios.get(url);
+  return response.data;
+}
diff --git a/package.json b/package.json
index 9cacd368..7403fac0 100644
--- a/package.json
+++ b/package.json
@@ -52,6 +52,7 @@
     "@babel/plugin-transform-runtime": "^7.4.4",
     "@babel/preset-env": "^7.4.5",
     "autoprefixer": "^9.6.0",
+    "axios": "^0.19.0",
     "babel-eslint": "^10.0.2",
     "babel-loader": "^8.0.6",
     "bootstrap-loader": "^3.0.4",
@@ -63,6 +64,7 @@
     "ejs": "^2.6.2",
     "eslint": "^5.15.3",
     "eslint-loader": "^2.1.2",
+    "eslint-plugin-chai-friendly": "^0.4.1",
     "eslint-plugin-import": "^2.17.3",
     "eslint-plugin-node": "^9.1.0",
     "eslint-plugin-promise": "^4.1.1",
diff --git a/swh/web/assets/config/.eslintrc b/swh/web/assets/config/.eslintrc
index f8dc1bfc..d92e6663 100644
--- a/swh/web/assets/config/.eslintrc
+++ b/swh/web/assets/config/.eslintrc
@@ -22,7 +22,8 @@
         "node",
         "promise",
         "standard",
-        "cypress"
+        "cypress",
+        "chai-friendly"
     ],
 
     "globals": {
@@ -209,11 +210,7 @@
         "no-unreachable": "error",
         "no-unsafe-finally": "error",
         "no-unsafe-negation": "error",
-        "no-unused-expressions": ["error", {
-            "allowShortCircuit": true,
-            "allowTernary": true,
-            "allowTaggedTemplates": true
-        }],
+        "no-unused-expressions": 0,
         "no-unused-vars": ["error", {
             "vars": "all",
             "args": "none",
@@ -305,6 +302,7 @@
         "standard/array-bracket-even-spacing": ["error", "either"],
         "standard/computed-property-even-spacing": ["error", "even"],
         "standard/no-callback-literal": "error",
-        "standard/object-curly-even-spacing": ["error", "either"]
+        "standard/object-curly-even-spacing": ["error", "either"],
+        "chai-friendly/no-unused-expressions": 2
     }
 }
\ No newline at end of file

Also, I noticed that your text editor is currently not configured to use the eslint configuration for swh-web.
We use the tool to enforce consistent styling for JavaScript code.
If you are using Visual Studio Code, you can activate eslint through the ESLint extension and adding this entry to your project configuration (adjust <path_to_swh_web> to your local setup):

"eslint.options": {
    "configFile": "<path_to_swh_web>/swh-web/swh/web/assets/config/.eslintrc",
    "ignorePath": "<path_to_swh_web>/swh-web/swh/web/assets/config/.eslintignore"
},

Can you add an extra commit fixing code style in spec files once you managed to configure eslint ?

This revision now requires changes to proceed.Jun 20 2019, 4:54 PM

@anlambert thank you very much.
Configured eslint on vscode. Will fix the spec codes in a separate diff.

This revision is now accepted and ready to land.Jun 21 2019, 10:25 AM
This revision was automatically updated to reflect the committed changes.