Make panel title reactive in designer fix #5720 (#5722)

testCafe/property-grid/panels.ts

@@ -49,4 +49,28 @@ test("Panel stay focused on question change", async (t) => {
     .click(Selector("div [data-name=\"minWidth\"] input"))
     .click(question1)
     .expect(Selector("div [data-name=\"minWidth\"] input").focused).ok();
-});
+});
+test("Show/hide panel header on entering/deleting the panel title, Bug#5720", async (t) => {
+  const json = {
+    elements: [
+      {
+        type: "panel",
+        name: "panel1"
+      }
+    ]
+  };
+  const panel = Selector(".svc-panel__placeholder");
+  const hiddenPanelTitle = Selector(".sd-element__title--hidden");
+  const titleEditor = Selector("[data-name='title']").find("textarea");
+  await setJSON(json);
+  await t
+    .click(panel)
+    .expect(hiddenPanelTitle.exists).ok()
+    .click(titleEditor)
+    .typeText(titleEditor, "MyTitle")
+    .expect(hiddenPanelTitle.exists).notOk()
+    .expect(Selector(".sv-string-editor").withText("MyTitle").exists).ok()
+    .selectText(titleEditor)
+    .pressKey("delete")
+    .expect(hiddenPanelTitle.exists).ok();
+});