Begin adding tests for edit page and file upload

webapp/cypress/e2e/editPage.cy.js

@@ -246,4 +246,33 @@ describe("Edit Page", () => {
     cy.get('[data-testid="search-input"]').type("editable_sample");
     cy.get("[data-testid=sample-table] tr:nth-of-type(1) > td:nth-of-type(9)").contains(2); // 2 blocks are present
   });
+
+  it("Clicks the upload buttons and checks that the modals are shown", () => {
+    cy.get('[data-testid="search-input"]').type("editable_sample");
+    cy.findByText("editable_sample").click();
+    cy.findByLabelText("Name").should("have.value", "This is a sample name");
+
+    cy.findByText("Upload files...").click();
+    cy.findByText("Drop files here, browse files or import from:").should("exist");
+    cy.findByLabelText("Close Modal").click();
+
+    cy.findByText("Add files from server...").click();
+    cy.findByText("Select files to add").should("exist");
+    cy.findByLabelText("Close").click();
+  });
+
+  it("Uploads an XRD file, makes an XRD block and checks that the plot works", () => {
+    cy.uploadFileViaAPI("editable_sample", "XRD/example_bmb.xye");
+
+    cy.get('[data-testid="search-input"]').type("editable_sample");
+    cy.findByText("editable_sample").click();
+    cy.findByLabelText("Name").should("have.value", "This is a sample name");
+
+    cy.findByText("Add a block").click();
+    cy.get(".dropdown-menu").findByText("Powder XRD").click();
+
+    cy.findByLabelText("Select a file:").click();
+    cy.get(".file-select-dropdown").findByText("example_bmb.xye").click();
+    cy.findByText("X axis").exists();
+  });
 });

webapp/cypress/fixtures/example_data

@@ -0,0 +1 @@
+../../../pydatalab/example_data

webapp/cypress/support/commands.js

@@ -116,6 +116,30 @@ Cypress.Commands.add("deleteSampleViaAPI", (item_id) => {
   });
 });
 
+Cypress.Commands.add("uploadFileViaAPI", (itemId, path) => {
+  cy.log("Upload a test file via the API: " + path);
+  cy.fixture(path, "binary")
+    .then(Cypress.Blob.binaryStringToBlob)
+    .then((blob) => {
+      const formData = new FormData();
+      formData.append("relativePath", "null");
+      formData.append("name", path);
+      formData.append("type", "application/octet-stream");
+      formData.append("size", blob.size.toString());
+      formData.append("item_id", itemId);
+      formData.append("replace_file", "null");
+      formData.append("files[]", blob, path);
+
+      return cy.request({
+        method: "POST",
+        url: API_URL + "/upload-file/",
+        body: formData,
+        headers: { "Content-Type": "multipart/form-data" },
+        form: true,
+      });
+    });
+});
+
 Cypress.Commands.add("searchAndSelectItem", (search_text, selector, clickPlus = false) => {
   // searches in the dropdown for the first real item with the given name, looking for a badge
   // if clickPlus, then also click the add row button before looking for the search bar