Dev danilo

.github/workflows/test.yaml

@@ -13,15 +13,15 @@ jobs:
           browser: chrome
           start: npm start
           wait-on: 'http://localhost:3000'
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
         if: failure()
         with:
           name: cypress-screenshots
           path: cypress/screenshots
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
         if: always()
         with:
           name: cypress-videos
           path: cypress/videos
       - name: upload coverage to Codecov
-        uses: codecov/codecov-action@v4
+        uses: codecov/codecov-action@v4

cypress.config.js → cypress.config.mjs

@@ -1,6 +1,6 @@
-const { defineConfig } = require('cypress')
+import { defineConfig } from 'cypress'
 
-module.exports = defineConfig({
+export default defineConfig({
   e2e: {
     // We've imported your old cypress plugins here.
     // You may want to clean this up later by importing these.

cypress/e2e/deciphon.test.js

@@ -1,11 +1,3 @@
-Cypress.Commands.add('assertValueCopiedToClipboard', expected => {
-  cy.window().then(win => {
-    win.navigator.clipboard.readText().then(text => {
-      expect(text).to.contains(expected)
-    })
-  })
-})
-
 describe("Deciphon website tests", () => {
   beforeEach(() => {
     cy.intercept("GET", "http://api/dbs", { fixture: "dbs.json" });
@@ -24,10 +16,12 @@ describe("Deciphon website tests", () => {
       fixture: "prod_alignments.txt",
     }).as("alignments");
     cy.intercept("GET", "http://api/scans/*/snap.dcs/gff", {
-      fixture: "prod_gff.txt" }
+      fixture: "prod_gff.txt"
+    }
     ).as("gff");
     cy.intercept("GET", "http://api/scans/*/snap.dcs/queries", {
-      fixture: "prod_queries.txt" }
+      fixture: "prod_queries.txt"
+    }
     ).as("queries");
     cy.intercept("GET", "http://api/scans/*/snap.dcs/aminos", {
       fixture: "prod_amino.txt",
@@ -48,15 +42,6 @@ describe("Deciphon website tests", () => {
       fixture: "scan_new.json",
     });
 
-    cy.wrap(
-      Cypress.automation("remote:debugger:protocol", {
-        command: "Browser.grantPermissions",
-        params: {
-          permissions: ["clipboardReadWrite", "clipboardSanitizedWrite"],
-          origin: "http://localhost:3000",
-        },
-      })
-    );
     cy.window().focus();
   });
 
@@ -106,9 +91,11 @@ describe("Deciphon website tests", () => {
     cy.contains("Job is pending").should("be.visible");
     cy.contains("There are 10 jobs ahead").should("be.visible");
     cy.get("a").first().focus();
-    cy.get(".icon-copy").click();
+    cy.get(`button:has(i.icon-copy):enabled`, { timeout: 100 })
+      .find(".icon-copy")
+      .realClick();
     cy.contains("👍").should("be.visible");
-    cy.assertValueCopiedToClipboard("http://localhost:3000/jobs/100");
+    cy.clipboard().then((x) => x.readText()).then(x => expect(x).to.contain("http://localhost:3000/jobs/100"));
   });
 
   it("shows running query", () => {
@@ -132,35 +119,33 @@ describe("Deciphon website tests", () => {
     cy.contains("Results files from your search").should("be.visible");
 
     const titleToProds = {
-      "GFF": { clip: "##gff-version", alias: "gff" },
-      "Original Query": {
+      "gff": { clip: "##gff-version", alias: "gff" },
+      "queries": {
         clip: "ATTTCGACGCTCAAGGAGTCGCTGA",
         alias: "queries",
       },
-      "Protein sequence matches": {
+      "aminos": {
         clip: "ISTLKESLIGDRITRIEGILNGTMNYILTEMEEEGASFSEALKEAQQLGYAEADPTDDVE",
         alias: "amino",
       },
-      "DNA of protein sequences": {
+      "codons": {
         clip: "ATTTCGACGCTCAAGGAGTCGCTGATAGGTGACCGTATTACTCGAATCGAAGGGATATTA",
         alias: "codon",
       },
-      "HMM Path": {
+      "states": {
         clip: "SBM3M4M5M6M7M8M9M10M11M12M13M14M15M16M17M18M19M20M21M22M23M2",
         alias: "states",
       },
     };
 
     for (const dlTitle in titleToProds) {
       cy.get("a").first().focus();
-      cy.get("article")
-        .filter(`:contains('${dlTitle}')`)
+      cy.get(`article#snap-card-${dlTitle} button:has(i.icon-copy):enabled`, { timeout: 100 })
         .find(".icon-copy")
         .click();
-      cy.assertValueCopiedToClipboard(titleToProds[dlTitle].clip)
+      cy.clipboard().then((x) => x.readText()).then(x => expect(x).to.contain(titleToProds[dlTitle].clip));
 
-      cy.get("article")
-        .filter(`:contains('${dlTitle}')`)
+      cy.get(`article#snap-card-${dlTitle}`)
         .find(".icon-download")
         .parent()
         .should("be.visible");

cypress/fixtures/job_failed.json

@@ -1,10 +1,10 @@
 {
   "id": 103,
-  "type": 0,
+  "type": "scan",
   "state": "fail",
   "progress": 0,
   "error": "Something awful happened",
   "submission": 0,
   "exec_started": 0,
   "exec_ended": 0
-}
+}

cypress/fixtures/job_running.json

@@ -1,10 +1,10 @@
 {
   "id": 101,
-  "type": 0,
+  "type": "scan",
   "state": "run",
   "progress": 50,
   "error": "",
   "submission": 0,
   "exec_started": 0,
   "exec_ended": 0
-}
+}

cypress/plugins/index.js

@@ -12,7 +12,7 @@
 // This function is called when a project is opened or re-opened (e.g. due to
 // the project's config changing)
 
-module.exports = (on, config) => {
+export default (on, config) => {
   require("@cypress/code-coverage/task")(on, config);
   return config;
 };

cypress/support/commands.js

@@ -1,25 +1,24 @@
-// ***********************************************
-// This example commands.js shows you how to
-// create various custom commands and overwrite
-// existing commands.
-//
-// For more comprehensive examples of custom
-// commands please read more here:
-// https://on.cypress.io/custom-commands
-// ***********************************************
-//
-//
-// -- This is a parent command --
-// Cypress.Commands.add('login', (email, password) => { ... })
-//
-//
-// -- This is a child command --
-// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
-//
-//
-// -- This is a dual command --
-// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
-//
-//
-// -- This will overwrite an existing command --
-// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+// Source: https://gist.github.com/mbinic/e75a8910ec51a27a041f967e5b3a5345
+Cypress.Commands.add('clipboard', () => {
+  if (Cypress.browser.name !== 'electron') {
+    cy.wrap(
+      Cypress.automation('remote:debugger:protocol', {
+        command: 'Browser.grantPermissions',
+        params: {
+          permissions: ['clipboardReadWrite', 'clipboardSanitizedWrite'],
+          origin: window.location.origin,
+        },
+      }).catch((error) =>
+        // Electron (v106) will land here, but that's ok, cause the permissions will be granted anyway
+        Cypress.log({ message: `Permission request failed: ${error.message}` })
+      )
+    );
+  }
+
+  return cy.window().then(async (win) => {
+    win.focus();
+    return win.navigator.clipboard;
+  });
+});
+// usage for e.g. writing text
+// cy.clipboard().then(clipboard => clipboard.writeText('some text'))

cypress/support/e2e.js

@@ -1,26 +1,7 @@
-// ***********************************************************
-// This example support/index.js is processed and
-// loaded automatically before your test files.
-//
-// This is a great place to put global configuration and
-// behavior that modifies Cypress.
-//
-// You can change the location of this file or turn off
-// automatically serving support files with the
-// 'supportFile' configuration option.
-//
-// You can read more here:
-// https://on.cypress.io/configuration
-// ***********************************************************
-
 import "@cypress/code-coverage/support";
-
-// Import commands.js using ES2015 syntax:
+import "cypress-real-events";
 import "./commands";
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 beforeEach(() => {
   cy.setCookie("cookies-accepted", "true");
   cy.setCookie("embl-ebi-public-website-v1.0-data-protection-accepted", "true");