Bugfix/useFieldArray

cypress/integration/app.spec.js

@@ -1,15 +1,11 @@
 describe("Basic e2e", function () {
-  const baseUrl = "http://localhost:" + Cypress.env("port") + "/"
-
   it("should navigate to home with click of login button", () => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
+    cy.login()
   })
 
   it("should create new folder, add Study form, upload Study XML file, add Analysis form, and publish folder", () => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
-    cy.wait(1000)
+    cy.login()
+
     cy.get("button", { timeout: 10000 }).contains("Create Submission").click()
 
     // Navigate to folder creation
@@ -36,20 +32,6 @@ describe("Basic e2e", function () {
     cy.get("button[type=submit]").contains("Submit").click()
     cy.get(".MuiListItem-container", { timeout: 10000 }).should("have.length", 1)
 
-    // Clear form
-    cy.get("button[type=button]").contains("Clear").click()
-
-    // Edit saved submission
-    cy.get("button[type=button]").contains("Edit").click()
-    cy.get("input[name='descriptor.studyTitle']").should("have.value", "New title")
-    cy.get("input[name='descriptor.studyTitle']", { timeout: 10000 }).focus().type(" edited").blur()
-    cy.get("input[name='descriptor.studyTitle']").should("have.value", "New title edited")
-    cy.get("button[type=button]").contains("Update").click()
-    cy.get("div[role=alert]").contains("Object updated")
-    cy.get("button[type=button]").contains("New form").click()
-    cy.get("button[type=button]").contains("Edit").click()
-    cy.get("input[name='descriptor.studyTitle']").should("have.value", "New title edited")
-
     // Upload a Study xml file.
     cy.get("div[role=button]").contains("Upload XML File").click()
     cy.fixture("study_test.xml").then(fileContent => {
@@ -82,11 +64,7 @@ describe("Basic e2e", function () {
     cy.contains(".MuiAlert-message", "Object replaced")
 
     // Fill an Analysis form and submit object
-    cy.get("div[role=button]").contains("Analysis").click()
-    cy.get("div[role=button]")
-      .contains("Fill Form")
-      .should("be.visible")
-      .then($btn => $btn.click())
+    cy.clickFillForm("Analysis")
 
     cy.get("form").within(() => {
       cy.get("input[name='title']").type("Test title")

cypress/integration/draft.spec.js

@@ -1,10 +1,7 @@
 describe("Draft operations", function () {
-  const baseUrl = "http://localhost:" + Cypress.env("port") + "/"
-
   beforeEach(() => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
-    cy.wait(1000)
+    cy.login()
+
     cy.get("button", { timeout: 10000 }).contains("Create Submission").click()
     // Navigate to folder creation
     cy.get("button[type=button]", { timeout: 10000 }).contains("New folder").click()
@@ -88,41 +85,4 @@ describe("Draft operations", function () {
     cy.get("div[role=button]").contains("Choose from drafts").click()
     cy.get("div").contains("No study drafts.")
   })
-
-  it("should render Experiment form correctly when editing", () => {
-    // Fill an Experiment form
-    cy.get("div[role=button]").contains("Experiment").click()
-    cy.wait(500)
-    cy.get("div[aria-expanded='true']")
-      .siblings()
-      .within(() =>
-        cy
-          .get("div[role=button]")
-          .contains("Fill Form", { timeout: 10000 })
-          .should("be.visible")
-          .then($btn => $btn.click())
-      )
-    cy.get("input[data-testid='title']").type("Test experiment")
-    cy.get("textarea[data-testid='description']").type("Test experiment description")
-    cy.get("textarea[name='design.designDescription']").type("Test design description")
-
-    // Save Experiment form
-    cy.get("button[type='button']").contains("Save as Draft").click()
-    cy.get("div[role=alert]", { timeout: 10000 }).contains("Draft saved with")
-
-    // Select the Experiment draft
-    cy.get("div[aria-expanded='true']")
-      .siblings()
-      .within(() =>
-        cy
-          .get("div[role=button]")
-          .contains("Choose from drafts", { timeout: 10000 })
-          .should("be.visible")
-          .then($btn => $btn.click())
-      )
-    cy.get("button[aria-label='Continue draft']").first().click()
-    cy.get("input[data-testid='title']").should("have.value", "Test experiment")
-    cy.get("textarea[data-testid='description']").should("have.value", "Test experiment description")
-    cy.get("textarea[name='design.designDescription']").should("have.value", "Test design description")
-  })
 })

cypress/integration/draftTemplates.spec.js

@@ -1,10 +1,7 @@
 describe("draft selections and templates", function () {
-  const baseUrl = "http://localhost:" + Cypress.env("port") + "/"
-
   beforeEach(() => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
-    cy.wait(1000)
+    cy.login()
+
     cy.get("button", { timeout: 10000 }).contains("Create Submission").click()
     // Navigate to folder creation
     cy.get("button[type=button]", { timeout: 10000 }).contains("New folder").click()

cypress/integration/editForm.spec.js

@@ -0,0 +1,160 @@
+describe("Populate form and render form elements by object data", function () {
+  beforeEach(() => {
+    cy.login()
+
+    cy.get("button", { timeout: 10000 }).contains("Create Submission").click()
+    // Navigate to folder creation
+    cy.get("button[type=button]", { timeout: 10000 }).contains("New folder").click()
+
+    // Add folder name & description, navigate to submissions
+    cy.get("input[name='name']").type("Test name")
+    cy.get("textarea[name='description']").type("Test description")
+    cy.get("button[type=button]").contains("Next").click()
+  })
+
+  it("should submit Sample form and display all form values when editing the form", () => {
+    const testData = {
+      title: "Sample test title",
+      taxonId: "123456",
+      sampleData: "Human Sample",
+      gender: "unknown",
+    }
+
+    cy.clickFillForm("Sample")
+
+    cy.get("input[name='title']").type(testData.title)
+    cy.get("input[name='sampleName.taxonId']").type(testData.taxonId)
+    cy.get("select[name='sampleData']").select(testData.sampleData)
+    cy.get("select[name='sampleData.gender']").select(testData.gender)
+
+    // Submit form
+    cy.get("button[type=submit]").contains("Submit").click()
+    cy.get(".MuiListItem-container", { timeout: 10000 }).should("have.length", 1)
+
+    // Clear form
+    cy.get("button[type=button]").contains("Clear").click()
+
+    // Edit saved submission
+    cy.get("button[type=button]").contains("Edit").click()
+    cy.get("input[name='title']").should("have.value", testData.title)
+    cy.get("input[name='title']", { timeout: 10000 }).focus().type(" edited").blur()
+    cy.get("input[name='title']").should("have.value", `${testData.title} edited`)
+    cy.get("input[name='sampleName.taxonId']").should("have.value", testData.taxonId)
+    cy.get("select[name='sampleData']").should("have.value", testData.sampleData)
+    cy.get("select[name='sampleData.gender']").should("have.value", testData.gender)
+    cy.get("button[type=button]").contains("Update").click()
+    cy.get("div[role=alert]").contains("Object updated")
+
+    // Clear object in state
+    cy.get("button[type=button]").contains("New form").click()
+
+    // Test updated title
+    cy.get(".MuiListItem-container", { timeout: 10000 }).should("have.length", 1)
+    cy.get("button[type=button]").contains("Edit").click()
+    cy.get("input[name='title']").should("have.value", `${testData.title} edited`)
+  })
+
+  it("should render Experiment form correctly when editing", () => {
+    const testData = {
+      title: "Test experiment",
+      description: "Test experiment description",
+      designDescription: "Test design description",
+      sampleReference: "Individual Sample",
+      individualSampleLabel: "Individual Sample test label",
+      singleProcessing: "Single Processing",
+      singleProcessingLabel: "Single Processing label",
+    }
+
+    cy.clickFillForm("Experiment")
+
+    cy.get("input[data-testid='title']").type(testData.title)
+    cy.get("textarea[data-testid='description']").type(testData.description)
+    cy.get("textarea[name='design.designDescription']").type(testData.designDescription)
+    cy.get("select[name='design.sampleDescriptor']").select(testData.sampleReference)
+    cy.get("input[data-testid='design.sampleDescriptor.label']").type(testData.individualSampleLabel)
+    // Expected Base Call Table
+    cy.get("div").contains("Expected Base Call Table").parent().children("button").click()
+    cy.get("input[name='design.spotDescriptor.readSpec.expectedBaseCallTable[0].baseCall']").type("Test base call")
+    cy.get("input[name='design.spotDescriptor.readSpec.expectedBaseCallTable[0].readGroupTag']").type(
+      "Test read group tag"
+    )
+    cy.get("select[name='processing']").select(testData.singleProcessing)
+    cy.get("input[data-testid='processing']").type(testData.singleProcessingLabel)
+
+    // Save Experiment form
+    cy.get("button[type='button']").contains("Save as Draft").click()
+    cy.get("div[role=alert]", { timeout: 10000 }).contains("Draft saved with")
+
+    cy.chooseFromDrafts()
+    cy.get("button[aria-label='Continue draft']").first().click()
+
+    cy.get("input[data-testid='title']").should("have.value", testData.title)
+    cy.get("textarea[data-testid='description']").should("have.value", testData.description)
+    cy.get("textarea[name='design.designDescription']").should("have.value", testData.designDescription)
+    cy.get("select[name='design.sampleDescriptor']").should("have.value", testData.sampleReference)
+    cy.get("input[data-testid='design.sampleDescriptor.label']").should("have.value", testData.individualSampleLabel)
+    cy.get("input[name='design.spotDescriptor.readSpec.expectedBaseCallTable[0].baseCall']").should(
+      "have.value",
+      "Test base call"
+    )
+    cy.get("input[name='design.spotDescriptor.readSpec.expectedBaseCallTable[0].readGroupTag']").should(
+      "have.value",
+      "Test read group tag"
+    )
+    cy.get("select[name='processing']").should("have.value", testData.singleProcessing)
+    cy.get("input[data-testid='processing']").should("have.value", testData.singleProcessingLabel)
+  })
+
+  it("should render Run form correctly when editing", () => {
+    const testData = {
+      title: "Test Run",
+      referenceAlignment: "Standard",
+      accessionId: "123456",
+    }
+
+    cy.clickFillForm("Run")
+
+    cy.get("input[data-testid='title']").type(testData.title)
+    cy.get("select[name='runType.referenceAlignment.assembly']").select(testData.referenceAlignment)
+    cy.get("input[data-testid='runType.referenceAlignment.assembly.accessionId']").type(testData.accessionId)
+
+    // Save draft
+    cy.get("button[type='button']").contains("Save as Draft").click()
+    cy.get("div[role=alert]", { timeout: 10000 }).contains("Draft saved with")
+
+    // Select newly saved draft
+    cy.chooseFromDrafts()
+    cy.get("button[aria-label='Continue draft']").first().click()
+
+    cy.get("select[name='runType.referenceAlignment.assembly']").should("have.value", testData.referenceAlignment)
+    cy.get("input[data-testid='runType.referenceAlignment.assembly.accessionId']").should(
+      "have.value",
+      testData.accessionId
+    )
+  })
+
+  it("should render form with checkboxes correctly", () => {
+    const testData = {
+      title: "Test Dataset",
+    }
+
+    cy.clickFillForm("Dataset")
+
+    cy.get("input[data-testid='title']").type(testData.title)
+    cy.get("[type='checkbox']").first().check()
+
+    // Save draft
+    cy.get("button[type='button']").contains("Save as Draft").click()
+    cy.get("div[role=alert]", { timeout: 10000 }).contains("Draft saved with")
+
+    // Select newly saved draft
+    cy.chooseFromDrafts()
+    cy.get("button[aria-label='Continue draft']").first().click()
+
+    cy.get("[type='checkbox']").first().should("be.checked")
+
+    // Test that checkbox clears with form clear -button
+    cy.get("button[type=button]", { timeout: 10000 }).contains("Clear form").click()
+    cy.get("[type='checkbox']").first().should("not.be.checked")
+  })
+})

cypress/integration/emptyForm.spec.js

@@ -1,10 +1,7 @@
 describe("empty form should not be alerted or saved", function () {
-  const baseUrl = "http://localhost:" + Cypress.env("port") + "/"
-
   beforeEach(() => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
-    cy.wait(1000)
+    cy.login()
+
     cy.get("button", { timeout: 10000 }).contains("Create Submission").click()
 
     // Navigate to folder creation
@@ -18,35 +15,16 @@ describe("empty form should not be alerted or saved", function () {
 
   it("should have New form button and Clear form button emptied the form", () => {
     // Check Clear form button in Sample object
-    cy.get("div[role=button]").contains("Sample", { timeout: 10000 }).click()
-    cy.wait(500)
-    cy.get("div[aria-expanded='true']")
-      .siblings()
-      .within(() =>
-        cy
-          .get("div[role=button]")
-          .contains("Fill Form", { timeout: 10000 })
-          .should("be.visible")
-          .then($btn => $btn.click())
-      )
+    cy.clickFillForm("Sample")
+
     cy.get("input[data-testid='title']").type("Test sample")
     cy.get("input[data-testid='sampleName.taxonId']").type(123)
     cy.get("button[type='button']").contains("Clear form").click()
     cy.get("input[data-testid='title']").should("have.value", "")
     cy.get("input[data-testid='sampleName.taxonId']").should("have.value", "")
 
     // Check both New form button and Clear form button with Experiment object
-    cy.get("div[role=button]").contains("Experiment").click()
-    cy.wait(500)
-    cy.get("div[aria-expanded='true']")
-      .siblings()
-      .within(() =>
-        cy
-          .get("div[role=button]")
-          .contains("Fill Form", { timeout: 10000 })
-          .should("be.visible")
-          .then($btn => $btn.click())
-      )
+    cy.clickFillForm("Experiment")
 
     // Check if New form button can empty the form
     cy.get("form")
@@ -68,15 +46,7 @@ describe("empty form should not be alerted or saved", function () {
     cy.get("div[role=alert]", { timeout: 10000 }).contains("Draft saved with")
 
     // Select the Experiment draft
-    cy.get("div[aria-expanded='true']")
-      .siblings()
-      .within(() =>
-        cy
-          .get("div[role=button]")
-          .contains("Choose from drafts", { timeout: 10000 })
-          .should("be.visible")
-          .then($btn => $btn.click())
-      )
+    cy.chooseFromDrafts()
     cy.get("button[aria-label='Continue draft']").first().click()
 
     cy.get("input[data-testid='title']").should("have.value", "Test experiment")
@@ -88,15 +58,7 @@ describe("empty form should not be alerted or saved", function () {
     cy.get("textarea[data-testid='description']").should("have.value", "")
 
     // Select the Experiment draft again
-    cy.get("div[aria-expanded='true']")
-      .siblings()
-      .within(() =>
-        cy
-          .get("div[role=button]")
-          .contains("Choose from drafts", { timeout: 10000 })
-          .should("be.visible")
-          .then($btn => $btn.click())
-      )
+    cy.chooseFromDrafts()
     cy.get("button[aria-label='Continue draft']").first().click()
 
     cy.get("input[data-testid='title']").should("have.value", "Test experiment")

cypress/integration/home.spec.js

@@ -1,9 +1,6 @@
 describe("Home e2e", function () {
-  const baseUrl = "http://localhost:" + Cypress.env("port") + "/"
-
   beforeEach(() => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
+    cy.login()
   })
 
   it("show Overview submissions in Home page, create a draft folder, navigate to see folder details, delete object inside folder, navigate back to Overview submissions", () => {

cypress/integration/objectLinksAttributes.spec.js

@@ -1,10 +1,7 @@
 describe("render objects' links and attributes ", function () {
-  const baseUrl = "http://localhost:" + Cypress.env("port") + "/"
-
   it("should render correct Study Links and Attributes", () => {
-    cy.visit(baseUrl)
-    cy.get('[alt="CSC Login"]').click()
-    cy.wait(1000)
+    cy.login()
+
     cy.get("button", { timeout: 10000 }).contains("Create Submission").click()
 
     // Navigate to folder creation