test: using custom doctype to test form builder
This commit is contained in:
parent
b7fea0ffe5
commit
3f00a7993c
2 changed files with 122 additions and 60 deletions
65
cypress/fixtures/form_builder_doctype.js
Normal file
65
cypress/fixtures/form_builder_doctype.js
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
export default {
|
||||
name: "Form Builder Doctype",
|
||||
custom: 1,
|
||||
actions: [],
|
||||
doctype: "DocType",
|
||||
engine: "InnoDB",
|
||||
fields: [
|
||||
{
|
||||
fieldname: "data3",
|
||||
fieldtype: "Data",
|
||||
label: "Data 3",
|
||||
},
|
||||
{
|
||||
fieldname: "tab",
|
||||
fieldtype: "Tab Break",
|
||||
label: "Tab 2",
|
||||
},
|
||||
{
|
||||
fieldname: "data",
|
||||
fieldtype: "Data",
|
||||
label: "Data",
|
||||
},
|
||||
{
|
||||
fieldname: "check",
|
||||
fieldtype: "Check",
|
||||
label: "Check",
|
||||
},
|
||||
{
|
||||
fieldname: "column_1",
|
||||
fieldtype: "Column Break",
|
||||
},
|
||||
{
|
||||
fieldname: "data1",
|
||||
fieldtype: "Data",
|
||||
label: "Data 1",
|
||||
},
|
||||
{
|
||||
fieldname: "section_1",
|
||||
fieldtype: "Section Break",
|
||||
},
|
||||
{
|
||||
fieldname: "data2",
|
||||
fieldtype: "Data",
|
||||
label: "Data 2",
|
||||
},
|
||||
],
|
||||
modified_by: "Administrator",
|
||||
module: "Custom",
|
||||
owner: "Administrator",
|
||||
permissions: [
|
||||
{
|
||||
create: 1,
|
||||
delete: 1,
|
||||
email: 1,
|
||||
print: 1,
|
||||
read: 1,
|
||||
role: "System Manager",
|
||||
share: 1,
|
||||
write: 1,
|
||||
},
|
||||
],
|
||||
sort_field: "modified",
|
||||
sort_order: "ASC",
|
||||
track_changes: 1,
|
||||
};
|
||||
|
|
@ -1,7 +1,10 @@
|
|||
import form_builder_doctype from "../fixtures/form_builder_doctype";
|
||||
const doctype_name = form_builder_doctype.name;
|
||||
context("Form Builder", () => {
|
||||
before(() => {
|
||||
cy.login();
|
||||
cy.visit("/app");
|
||||
return cy.insert_doc("DocType", form_builder_doctype, true);
|
||||
});
|
||||
|
||||
it("Open Form Builder for Web Form Doctype/Customize Form", () => {
|
||||
|
|
@ -15,124 +18,118 @@ context("Form Builder", () => {
|
|||
});
|
||||
|
||||
it("Drag Field/Column/Section & Tab", () => {
|
||||
cy.visit("/app/form-builder/Web Form");
|
||||
cy.visit(`/app/form-builder/${doctype_name}`);
|
||||
|
||||
cy.get(".section-columns-container:first .column:first").as("first-column");
|
||||
cy.get(".section-columns-container:first .column:first .field:first").as("first-field");
|
||||
let first_column = ".tab-content.active .section-columns-container:first .column:first";
|
||||
let first_field = first_column + " .field:first";
|
||||
let label = "div[title='Double click to edit label'] span:first";
|
||||
|
||||
cy.get("@first-field")
|
||||
.find("div[title='Double click to edit label'] span:first")
|
||||
.as("first-field-title");
|
||||
// drag first tab to second position
|
||||
cy.get(".tabs .tab:first").drag(".tabs .tab:nth-child(2)", {
|
||||
target: { x: 10, y: 10 },
|
||||
force: true,
|
||||
});
|
||||
cy.get(".tabs .tab:first").find(label).should("have.text", "Tab 2");
|
||||
|
||||
cy.get(".tabs .tab:first").click();
|
||||
cy.get(".sidebar-container .tab:first").click();
|
||||
|
||||
// drag check field to first column
|
||||
cy.get(".fields-container .field[title='Check']").drag(
|
||||
".section-columns-container:first .column:first .field:first",
|
||||
{
|
||||
target: { x: 100, y: 10 },
|
||||
}
|
||||
);
|
||||
cy.get("@first-column").find(".field").should("have.length", 4);
|
||||
cy.get(".fields-container .field[title='Check']").drag(first_field, {
|
||||
target: { x: 100, y: 10 },
|
||||
});
|
||||
cy.get(first_column).find(".field").should("have.length", 3);
|
||||
|
||||
cy.get("@first-field")
|
||||
cy.get(first_field)
|
||||
.find("div[title='Double click to edit label']")
|
||||
.dblclick()
|
||||
.type("Test Check{enter}");
|
||||
cy.get("@first-field-title").should("have.text", "Test Check");
|
||||
cy.get(first_field).find(label).should("have.text", "Test Check");
|
||||
|
||||
// drag the first field to second position
|
||||
cy.get("@first-field").drag(
|
||||
".section-columns-container:first .column:first .field:nth-child(2)",
|
||||
{
|
||||
target: { x: 100, y: 10 },
|
||||
}
|
||||
);
|
||||
cy.get("@first-field-title").should("have.text", "Title");
|
||||
cy.get(first_field).drag(first_column + " .field:nth-child(2)", {
|
||||
target: { x: 100, y: 10 },
|
||||
});
|
||||
cy.get(first_field).find(label).should("have.text", "Data");
|
||||
|
||||
// drag first column to second position
|
||||
cy.get("@first-column").click().wait(200);
|
||||
cy.get("@first-column")
|
||||
cy.get(first_column).click().wait(200);
|
||||
cy.get(first_column)
|
||||
.find(".column-actions")
|
||||
.drag(".section-columns-container:first .column:last", {
|
||||
target: { x: 100, y: 10 },
|
||||
force: true,
|
||||
});
|
||||
cy.get("@first-field-title").should("have.text", "Select DocType");
|
||||
cy.get(first_field).find(label).should("have.text", "Data 1");
|
||||
|
||||
let first_section = ".tab-content.active .form-section-container:first";
|
||||
cy.get(".form-section-container:first").as("first-section");
|
||||
|
||||
// drag first section to second position
|
||||
cy.get("@first-section").click().wait(200);
|
||||
cy.get("@first-section")
|
||||
cy.get(first_section).click().wait(200);
|
||||
cy.get(first_section)
|
||||
.find(".section-header")
|
||||
.drag(".form-section-container:nth-child(2)", {
|
||||
target: { x: 100, y: 10 },
|
||||
force: true,
|
||||
});
|
||||
cy.get(".section-columns-container:first .column:first .field:first").as("first-field");
|
||||
cy.get("@first-field-title").should("have.text", "Introduction");
|
||||
|
||||
cy.get(".tabs .tab:first").as("first-tab");
|
||||
cy.get("@first-tab")
|
||||
.find("div[title='Double click to edit label'] span:first")
|
||||
.as("first-tab-title");
|
||||
|
||||
// drag first tab to second position
|
||||
cy.get("@first-tab").drag(".tabs .tab:nth-child(2)", {
|
||||
target: { x: 10, y: 10 },
|
||||
force: true,
|
||||
});
|
||||
cy.get("@first-tab-title").should("have.text", "Settings");
|
||||
cy.get(first_field).find(label).should("have.text", "Data 2");
|
||||
});
|
||||
|
||||
it("Add New Tab/Section/Column to Form", () => {
|
||||
cy.visit("/app/form-builder/Web Form");
|
||||
cy.visit(`/app/form-builder/${doctype_name}`);
|
||||
|
||||
let first_section = ".tab-content.active .form-section-container:first";
|
||||
|
||||
// add new tab
|
||||
cy.get(".tab-header").realHover().find(".tab-actions .new-tab-btn").click();
|
||||
cy.get(".tabs .tab").should("have.length", 4);
|
||||
|
||||
cy.get(".tab-content.active .form-section-container:first").as("first-section");
|
||||
cy.get(".tabs .tab").should("have.length", 3);
|
||||
|
||||
// add new section
|
||||
cy.get("@first-section").click(15, 10);
|
||||
cy.get("@first-section").find(".section-actions button:first").click();
|
||||
cy.get(first_section).click(15, 10);
|
||||
cy.get(first_section).find(".section-actions button:first").click();
|
||||
cy.get(".tab-content.active .form-section-container").should("have.length", 2);
|
||||
|
||||
// add new column
|
||||
cy.get("@first-section").find(".column:first").click(15, 10);
|
||||
cy.get("@first-section").find(".column:first .column-actions button:first").click();
|
||||
cy.get("@first-section").find(".column").should("have.length", 3);
|
||||
cy.get(first_section).find(".column:first").click(15, 10);
|
||||
cy.get(first_section).find(".column:first .column-actions button:first").click();
|
||||
cy.get(first_section).find(".column").should("have.length", 3);
|
||||
});
|
||||
|
||||
it("Remove Tab/Section/Column", () => {
|
||||
cy.get(".tab-content.active .form-section-container:first").as("first-section");
|
||||
|
||||
let first_section = ".tab-content.active .form-section-container:first";
|
||||
|
||||
// remove column
|
||||
cy.get("@first-section").find(".column:first").click(15, 10);
|
||||
cy.get("@first-section").find(".column:first .column-actions button:last").click();
|
||||
cy.get("@first-section").find(".column").should("have.length", 2);
|
||||
cy.get(first_section).find(".column:first").click(15, 10);
|
||||
cy.get(first_section).find(".column:first .column-actions button:last").click();
|
||||
cy.get(first_section).find(".column").should("have.length", 2);
|
||||
|
||||
// remove section
|
||||
cy.get("@first-section").click(15, 10);
|
||||
cy.get("@first-section").find(".section-actions button:last").click();
|
||||
cy.get(first_section).click(15, 10);
|
||||
cy.get(first_section).find(".section-actions button:last").click();
|
||||
cy.get(".tab-content.active .form-section-container").should("have.length", 1);
|
||||
|
||||
// remove tab
|
||||
cy.get(".tab-header").realHover().find(".tab-actions .remove-tab-btn").click();
|
||||
cy.get(".tabs .tab").should("have.length", 3);
|
||||
cy.get(".tabs .tab").should("have.length", 2);
|
||||
});
|
||||
|
||||
it("Update Title field Label to New Title through Customize Form", () => {
|
||||
cy.visit("/app/form-builder/Web Form/customize");
|
||||
cy.visit(`/app/form-builder/${doctype_name}`);
|
||||
|
||||
cy.get(".section-columns-container:first .column:first .field:first")
|
||||
let first_field =
|
||||
".tab-content.active .section-columns-container:first .column:first .field:first";
|
||||
|
||||
cy.get(first_field)
|
||||
.find("div[title='Double click to edit label']")
|
||||
.dblclick()
|
||||
.type("{selectall}New Title");
|
||||
|
||||
cy.findByRole("button", { name: "Save" }).click({ force: true });
|
||||
|
||||
cy.visit("/app/web-form/new");
|
||||
cy.get("[data-fieldname='title'] .clearfix label").should("have.text", "New Title");
|
||||
cy.visit("/app/form-builder-doctype/new");
|
||||
cy.get("[data-fieldname='data3'] .clearfix label").should("have.text", "New Title");
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue