Merge pull request #15965 from nextchamp-saqib/refresh-dependency-for-tabs

fix: depends_on not working with tabs

cypress/integration/depends_on.js

@@ -55,10 +55,31 @@ context('Depends On', () => {
 						'read_only_depends_on': "eval:doc.test_field=='Some Other Value'",
 						'options': "Child Test Depends On"
 					},
+					{
+						"label": "Dependent Tab",
+						"fieldname": "dependent_tab",
+						"fieldtype": "Tab Break",
+						"depends_on": "eval:doc.test_field=='Show Tab'"
+					},
+					{
+						"fieldname": "tab_section",
+						"fieldtype": "Section Break",
+					},
+					{
+						"label": "Field in Tab",
+						"fieldname": "field_in_tab",
+						"fieldtype": "Data",
+					}
 				]
 			});
 		});
 	});
+	it('should show the tab on other setting field value', () => {
+		cy.new_form('Test Depends On');
+		cy.fill_field('test_field', 'Show Tab');
+		cy.get('body').click();
+		cy.findByRole("tab", {name: "Dependent Tab"}).should('be.visible');
+	});
 	it('should set the field as mandatory depending on other fields value', () => {
 		cy.new_form('Test Depends On');
 		cy.fill_field('test_field', 'Some Value');

frappe/public/js/frappe/form/layout.js

@@ -554,19 +554,21 @@ frappe.ui.form.Layout = class Layout {
 
 		let has_dep = false;
 
-		for (let fkey in this.fields_list) {
-			let f = this.fields_list[fkey];
-			f.dependencies_clear = true;
+		const fields = this.fields_list.concat(this.tabs);
+
+		for (let fkey in fields) {
+			let f = fields[fkey];
 			if (f.df.depends_on || f.df.mandatory_depends_on || f.df.read_only_depends_on) {
 				has_dep = true;
+				break;
 			}
 		}
 
 		if (!has_dep) return;
 
 		// show / hide based on values
-		for (let i = this.fields_list.length - 1; i >= 0; i--) {
-			let f = this.fields_list[i];
+		for (let i = fields.length - 1; i >= 0; i--) {
+			let f = fields[i];
 			f.guardian_has_value = true;
 			if (f.df.depends_on) {
 				// evaluate guardian

frappe/public/js/frappe/form/tab.js

@@ -40,7 +40,7 @@ export default class Tab {
 			hide = true;
 		}
 
-		hide && this.toggle(false);
+		this.toggle(!hide);
 	}
 
 	toggle(show) {