154 lines
5.5 KiB
JavaScript
154 lines
5.5 KiB
JavaScript
import child_table_with_tabs from "../fixtures/child_table_with_tabs";
|
|
import doctype_with_child_table_tabs from "../fixtures/doctype_with_child_table_tabs";
|
|
|
|
const parent_doctype_name = doctype_with_child_table_tabs.name;
|
|
const child_doctype_name = child_table_with_tabs.name;
|
|
|
|
context("Grid Row Form Tabs", () => {
|
|
before(() => {
|
|
cy.login();
|
|
cy.visit("/desk/website");
|
|
// Create child table doctype first, then parent
|
|
return cy.insert_doc("DocType", child_table_with_tabs, true).then(() => {
|
|
return cy.insert_doc("DocType", doctype_with_child_table_tabs, true);
|
|
});
|
|
});
|
|
|
|
beforeEach(() => {
|
|
cy.login();
|
|
cy.visit("/desk/website");
|
|
});
|
|
|
|
it("should display tabs in grid row form", () => {
|
|
cy.new_form(parent_doctype_name);
|
|
cy.fill_field("title", "Test Document");
|
|
|
|
// Add a row to the child table
|
|
cy.get('.frappe-control[data-fieldname="items"]').as("table");
|
|
cy.get("@table").findByRole("button", { name: "Add row" }).click();
|
|
|
|
// Open the grid row form
|
|
cy.get("@table").find('[data-idx="1"]').as("row1");
|
|
cy.get("@row1").find(".btn-open-row").click();
|
|
|
|
// Verify grid row form is open
|
|
cy.get(".grid-row-open").as("table-form");
|
|
|
|
// Verify tabs are visible in the grid row form
|
|
cy.get("@table-form").find(".form-tabs-list").should("be.visible");
|
|
cy.get("@table-form").find(".form-tabs .nav-item").should("have.length", 2);
|
|
|
|
// Verify first tab (General) is active by default
|
|
cy.get("@table-form").find(".form-tabs .nav-link").first().should("have.class", "active");
|
|
});
|
|
|
|
it("should switch tabs in grid row form", () => {
|
|
cy.new_form(parent_doctype_name);
|
|
cy.fill_field("title", "Test Tab Switch");
|
|
|
|
// Add a row to the child table
|
|
cy.get('.frappe-control[data-fieldname="items"]').as("table");
|
|
cy.get("@table").findByRole("button", { name: "Add row" }).click();
|
|
|
|
// Open the grid row form
|
|
cy.get("@table").find('[data-idx="1"]').as("row1");
|
|
cy.get("@row1").find(".btn-open-row").click();
|
|
cy.get(".grid-row-open").as("table-form");
|
|
|
|
// Verify initial tab content - fields from General tab should be visible
|
|
cy.get("@table-form")
|
|
.find('.frappe-control[data-fieldname="item_name"]')
|
|
.should("be.visible");
|
|
cy.get("@table-form")
|
|
.find('.frappe-control[data-fieldname="quantity"]')
|
|
.should("be.visible");
|
|
|
|
// Click on the "Details" tab and wait for it to become active
|
|
cy.get("@table-form")
|
|
.find('.form-tabs .nav-link[data-fieldname="tab_details"]')
|
|
.click()
|
|
.should("have.class", "active");
|
|
|
|
// Verify first tab is no longer active
|
|
cy.get("@table-form")
|
|
.find(".form-tabs .nav-link")
|
|
.first()
|
|
.should("not.have.class", "active");
|
|
|
|
// Fields from Details tab should be visible
|
|
cy.get("@table-form")
|
|
.find('.frappe-control[data-fieldname="description"]')
|
|
.should("be.visible");
|
|
cy.get("@table-form").find('.frappe-control[data-fieldname="notes"]').should("be.visible");
|
|
});
|
|
|
|
it("should preserve tab state when switching between rows", () => {
|
|
cy.new_form(parent_doctype_name);
|
|
cy.fill_field("title", "Test Tab Persistence");
|
|
|
|
// Add two rows to the child table
|
|
cy.get('.frappe-control[data-fieldname="items"]').as("table");
|
|
cy.get("@table").findByRole("button", { name: "Add row" }).click();
|
|
cy.get("@table").findByRole("button", { name: "Add row" }).click();
|
|
|
|
// Open first row and switch to Details tab
|
|
cy.get("@table").find('[data-idx="1"]').as("row1");
|
|
cy.get("@row1").find(".btn-open-row").click();
|
|
cy.get(".grid-row-open").as("table-form");
|
|
cy.get("@table-form")
|
|
.find('.form-tabs .nav-link[data-fieldname="tab_details"]')
|
|
.click()
|
|
.should("have.class", "active");
|
|
|
|
// Collapse first row
|
|
cy.get("@table-form").find(".grid-collapse-row").click();
|
|
|
|
// Open second row - should show first tab by default (not persist from row 1)
|
|
cy.get("@table").find('[data-idx="2"]').as("row2");
|
|
cy.get("@row2").find(".btn-open-row").click();
|
|
cy.get(".grid-row-open").as("table-form2");
|
|
|
|
// First tab should be active in new row
|
|
cy.get("@table-form2").find(".form-tabs .nav-link").first().should("have.class", "active");
|
|
});
|
|
|
|
it("should allow data entry in fields across different tabs", () => {
|
|
cy.new_form(parent_doctype_name);
|
|
cy.fill_field("title", "Test Data Entry");
|
|
|
|
// Add a row to the child table
|
|
cy.get('.frappe-control[data-fieldname="items"]').as("table");
|
|
cy.get("@table").findByRole("button", { name: "Add row" }).click();
|
|
|
|
// Open the grid row form
|
|
cy.get("@table").find('[data-idx="1"]').as("row1");
|
|
cy.get("@row1").find(".btn-open-row").click();
|
|
cy.get(".grid-row-open").as("table-form");
|
|
|
|
// Fill fields in first tab
|
|
cy.fill_table_field("items", "1", "item_name", "Test Item");
|
|
cy.fill_table_field("items", "1", "quantity", "10");
|
|
|
|
// Switch to Details tab and wait for it to become active
|
|
cy.get("@table-form")
|
|
.find('.form-tabs .nav-link[data-fieldname="tab_details"]')
|
|
.click()
|
|
.should("have.class", "active");
|
|
|
|
// Wait for tab content to be visible, then fill fields in second tab
|
|
cy.get("@table-form")
|
|
.find('.frappe-control[data-fieldname="description"]')
|
|
.should("be.visible");
|
|
cy.fill_table_field("items", "1", "description", "This is a test description");
|
|
cy.fill_table_field("items", "1", "notes", "Some notes here");
|
|
|
|
// Switch back to first tab and wait for it to become active
|
|
cy.get("@table-form")
|
|
.find('.form-tabs .nav-link[data-fieldname="tab_general"]')
|
|
.click()
|
|
.should("have.class", "active");
|
|
cy.get("@table-form")
|
|
.find('.frappe-control[data-fieldname="item_name"] input')
|
|
.should("have.value", "Test Item");
|
|
});
|
|
});
|