Bug/paneldynamic tabactions templatevisibleif (#8507)

* Dynamic Panel (Tab) wrongly switch panel when some panels are hidden fix #8430

* Improve the unit test better #8430

src/question_paneldynamic.ts

@@ -1541,9 +1541,10 @@ export class QuestionPanelDynamicModel extends Question
     }
     return -1;
   }
-  private getPanelIndexById(id: string): number {
-    for (var i = 0; i < this.panelsCore.length; i++) {
-      if (this.panelsCore[i].id === id) return i;
+  private getPanelVisibleIndexById(id: string): number {
+    const visPanels = this.visiblePanelsCore;
+    for (var i = 0; i < visPanels.length; i++) {
+      if (visPanels[i].id === id) return i;
     }
     return -1;
   }
@@ -2423,14 +2424,14 @@ export class QuestionPanelDynamicModel extends Question
       return options.title;
     };
     locTitle.sharedData = this.locTemplateTabTitle;
-    const isActive = this.getPanelIndexById(panel.id) === this.currentIndex;
+    const isActive = this.getPanelVisibleIndexById(panel.id) === this.currentIndex;
     const newItem = new Action({
       id: panel.id,
       pressed: isActive,
       locTitle: locTitle,
       disableHide: isActive,
       action: () => {
-        this.currentIndex = this.getPanelIndexById(newItem.id);
+        this.currentIndex = this.getPanelVisibleIndexById(newItem.id);
       }
     });
     return newItem;

src/survey-element.ts

@@ -24,7 +24,6 @@ import { SurveyModel } from "./survey";
 import { IAnimationConsumer, AnimationBoolean } from "./utils/animation";
 import { classesToSelector } from "./utils/utils";
 import { DomDocumentHelper, DomWindowHelper } from "./global_variables_utils";
-import { Panel } from "./knockout/kopage";
 import { PanelModel } from "./panel";
 /**
  * A base class for the [`SurveyElement`](https://surveyjs.io/form-library/documentation/surveyelement) and [`SurveyModel`](https://surveyjs.io/form-library/documentation/surveymodel) classes.

tests/question_paneldynamic_tests.ts

@@ -6273,6 +6273,29 @@ QUnit.test("templateVisibleIf & additionalTitleToolbar", function (assert) {
   assert.equal(getNextBtn().visible, true, "nextButton #6");
   survey.css = oldCss;
 });
+QUnit.test("templateVisibleIf & tabs action click, bug#8430", function (assert) {
+  const survey = new SurveyModel({
+    elements: [
+      { type: "paneldynamic",
+        name: "panel",
+        templateElements: [
+          { type: "text", name: "q1" }
+        ],
+        panelCount: 4,
+        templateVisibleIf: "{panel.q1}!='a'",
+        renderMode: "tab"
+      }],
+  });
+  const panel = <QuestionPanelDynamicModel>survey.getQuestionByName("panel");
+  assert.equal(panel.additionalTitleToolbar.visibleActions.length, 4, "There are 4 visible tabs");
+  panel.panels[1].getQuestionByName("q1").value = "a";
+  assert.equal(panel.currentIndex, 0, "Current Index 0");
+  const panelId = panel.panels[2].id;
+  assert.equal(panel.additionalTitleToolbar.visibleActions.length, 3, "There are 3 visible tabs");
+  panel.additionalTitleToolbar.visibleActions[1].action();
+  assert.equal(panel.currentIndex, 1, "Current Index 1");
+  assert.equal(panel.currentPanel.id, panelId, "Select the correct panel");
+});
 QUnit.test("question.enableIf & add panel button visibility, Bug#6292", function (assert) {
   const survey = new SurveyModel({
     elements: [