FORMS-17046 Focus on panel with static text not working via custom function (#1464)

* Focus on panel with static text not working via custom function

* Fixing test

Author: rismehta

it/content/src/main/content/jcr_root/content/dam/formsanddocuments/core-components-it/samples/wizard/setfocus/.content.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:dam="http://www.day.com/dam/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:fd="http://www.adobe.com/aemfd/fd/1.0"
+    jcr:primaryType="dam:Asset">
+    <jcr:content
+        jcr:lastModified="{Date}2024-10-24T14:51:48.225+05:30"
+        jcr:primaryType="dam:AssetContent"
+        sling:resourceType="fd/fm/af/render"
+        guide="1"
+        type="guide">
+        <metadata
+            fd:version="2.1"
+            jcr:primaryType="nt:unstructured"
+            allowedRenderFormat="HTML"
+            author="admin"
+            availableInMobileApp="{Boolean}false"
+            dorTemplateChanged="Boolean"
+            dorType="none"
+            formmodel="none"
+            hasCustomThumbnail="{Boolean}false"
+            themeRef="/libs/fd/af/themes/canvas"
+            title="Set focus"/>
+    </jcr:content>
+</jcr:root>

it/content/src/main/content/jcr_root/content/forms/af/core-components-it/samples/wizard/setfocus/.content.xml

@@ -0,0 +1,102 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:fd="http://www.adobe.com/aemfd/fd/1.0"
+    jcr:primaryType="cq:Page">
+    <jcr:content
+        cq:deviceGroups="[mobile/groups/responsive]"
+        cq:lastModified="{Date}2024-10-24T14:51:48.226+05:30"
+        cq:lastModifiedBy="admin"
+        cq:template="/conf/core-components-examples/settings/wcm/templates/af-blank-v2"
+        jcr:language="en"
+        jcr:primaryType="cq:PageContent"
+        jcr:title="set focus"
+        sling:configRef="/conf/forms/core-components-it/samples/wizard/basic/"
+        sling:resourceType="forms-components-examples/components/page">
+        <guideContainer
+            fd:version="2.1"
+            jcr:primaryType="nt:unstructured"
+            sling:resourceType="forms-components-examples/components/form/container"
+            dorType="none"
+            fieldType="form"
+            schemaType="none">
+            <wizard
+                jcr:lastModified="{Date}2024-10-24T12:46:18.053+05:30"
+                jcr:lastModifiedBy="admin"
+                jcr:primaryType="nt:unstructured"
+                jcr:title="Wizard"
+                sling:resourceType="forms-components-examples/components/form/wizard"
+                assistPriority="name"
+                enabled="{Boolean}true"
+                fieldType="panel"
+                hideTitle="false"
+                id="tooltip_scenario_test"
+                maxOccur="4"
+                minOccur="0"
+                name="wizard1662449848339"
+                readOnly="{Boolean}false"
+                repeatable="false"
+                textIsRich="[true,true]"
+                visible="{Boolean}true"
+                wrapData="{Boolean}false">
+                <item_1729753688746
+                    cq:panelTitle="w1"
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Panel"
+                    sling:resourceType="forms-components-examples/components/form/panelcontainer"
+                    fieldType="panel"
+                    name="item_17297536887461729753700324">
+                    <text
+                        jcr:created="{Date}2024-10-24T12:38:29.844+05:30"
+                        jcr:createdBy="admin"
+                        jcr:lastModified="{Date}2024-10-24T12:38:36.331+05:30"
+                        jcr:lastModifiedBy="admin"
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Text"
+                        sling:resourceType="forms-components-examples/components/form/text"
+                        fieldType="plain-text"
+                        name="text1729753709875"
+                        textIsRich="true"
+                        value="&lt;p>p1 temp&lt;/p>&#xd;&#xa;"/>
+                </item_1729753688746>
+                <item_1729753697276
+                    cq:panelTitle="w2"
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Panel"
+                    sling:resourceType="forms-components-examples/components/form/panelcontainer"
+                    fieldType="panel"
+                    name="item_17297536972761729753700328">
+                    <text
+                        jcr:created="{Date}2024-10-24T12:39:02.296+05:30"
+                        jcr:createdBy="admin"
+                        jcr:lastModified="{Date}2024-10-24T12:39:09.217+05:30"
+                        jcr:lastModifiedBy="admin"
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Text"
+                        sling:resourceType="forms-components-examples/components/form/text"
+                        fieldType="plain-text"
+                        name="text1729753742328"
+                        textIsRich="true"
+                        value="&lt;p>p2 text&lt;/p>&#xd;&#xa;"/>
+                </item_1729753697276>
+            </wizard>
+            <button
+                jcr:created="{Date}2024-10-24T14:05:13.949+05:30"
+                jcr:createdBy="admin"
+                jcr:lastModified="{Date}2024-10-24T14:05:13.949+05:30"
+                jcr:lastModifiedBy="admin"
+                jcr:primaryType="nt:unstructured"
+                jcr:title="Button"
+                sling:resourceType="forms-components-examples/components/form/button"
+                dorExclusion="true"
+                fieldType="button"
+                name="button1729758913977">
+                <fd:rules
+                    fd:click="[{&quot;nodeName&quot;:&quot;ROOT&quot;\,&quot;items&quot;:[{&quot;nodeName&quot;:&quot;STATEMENT&quot;\,&quot;choice&quot;:{&quot;nodeName&quot;:&quot;EVENT_SCRIPTS&quot;\,&quot;items&quot;:[{&quot;nodeName&quot;:&quot;EVENT_CONDITION&quot;\,&quot;choice&quot;:{&quot;nodeName&quot;:&quot;EVENT_AND_COMPARISON&quot;\,&quot;items&quot;:[{&quot;nodeName&quot;:&quot;COMPONENT&quot;\,&quot;value&quot;:{&quot;id&quot;:&quot;$form.button1729758913977&quot;\,&quot;type&quot;:&quot;BUTTON&quot;\,&quot;name&quot;:&quot;button1729758913977&quot;}}\,{&quot;nodeName&quot;:&quot;EVENT_AND_COMPARISON_OPERATOR&quot;\,&quot;choice&quot;:{&quot;nodeName&quot;:&quot;is clicked&quot;\,&quot;value&quot;:null}}\,{&quot;nodeName&quot;:&quot;PRIMITIVE_EXPRESSION&quot;\,&quot;choice&quot;:null}]}\,&quot;nested&quot;:false}\,{&quot;nodeName&quot;:&quot;Then&quot;\,&quot;value&quot;:null}\,{&quot;nodeName&quot;:&quot;BLOCK_STATEMENTS&quot;\,&quot;items&quot;:[{&quot;nodeName&quot;:&quot;BLOCK_STATEMENT&quot;\,&quot;choice&quot;:{&quot;nodeName&quot;:&quot;SET_FOCUS&quot;\,&quot;items&quot;:[{&quot;nodeName&quot;:&quot;to&quot;\,&quot;value&quot;:null}\,{&quot;nodeName&quot;:&quot;AFCOMPONENT&quot;\,&quot;value&quot;:{&quot;id&quot;:&quot;$form.wizard1662449848339.item_17297536972761729753700328&quot;\,&quot;displayName&quot;:&quot;Panel&quot;\,&quot;type&quot;:&quot;AFCOMPONENT&quot;\,&quot;isDuplicate&quot;:true\,&quot;displayPath&quot;:&quot;FORM/Wizard/Panel/&quot;\,&quot;name&quot;:&quot;item_17297536972761729753700328&quot;\,&quot;parent&quot;:&quot;$form.wizard1662449848339&quot;}}]}}]}]}}]\,&quot;isValid&quot;:true\,&quot;enabled&quot;:true\,&quot;version&quot;:1\,&quot;script&quot;:[&quot;setFocus($form.wizard1662449848339.item_17297536972761729753700328)&quot;]\,&quot;eventName&quot;:&quot;Click&quot;\,&quot;ruleType&quot;:&quot;&quot;\,&quot;description&quot;:&quot;&quot;}]"
+                    jcr:primaryType="nt:unstructured"
+                    validationStatus="valid"/>
+                <fd:events
+                    jcr:primaryType="nt:unstructured"
+                    click="[setFocus($form.wizard1662449848339\, 'nextItem')]"/>
+            </button>
+        </guideContainer>
+    </jcr:content>
+</jcr:root>

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/clientlibs/site/js/textview.js

@@ -59,6 +59,10 @@
             }
 
             setFocus() {
+                const fieldType = this.parentView?.getModel()?.fieldType;
+                if (fieldType !== 'form' && this.parentView.setFocus) {
+                    this.parentView.setFocus(this.getId());
+                }
                 this.setActive();
                 this.element.scrollIntoView({ behavior: 'smooth', block: 'start' });
             }

ui.frontend/src/view/FormField.js

@@ -77,7 +77,8 @@ class FormField {
     setActive() {
         if (!this.isActive()) {
             this.element.setAttribute(Constants.DATA_ATTRIBUTE_ACTIVE, true);
-            if (this.parentView) {
+            // optimizing the performance to check if the activeChild is different, else this will be a redundant call
+            if (this.parentView?._model?.activeChild !== this._model) {
                 this.parentView._model.activeChild = this._model; // updating the activeChild of the model when a field is focused in view
             }
             this.active = true;

ui.tests/test-module/specs/wizard/wizard.runtime.setfocus.cy.js

@@ -0,0 +1,50 @@
+/*******************************************************************************
+ * Copyright 2024 Adobe
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ ******************************************************************************/
+describe("wizard with static text", () => {
+
+    const pagePath = "content/forms/af/core-components-it/samples/wizard/setfocus.html";
+    let formContainer = null
+
+    // enabling theme for this test case as without theme there is a bug in custom widget css
+    before(() => {
+        const fmPropertiesUI = "/libs/fd/fm/gui/content/forms/formmetadataeditor.html/content/dam/formsanddocuments/core-components-it/samples/wizard/setfocus"
+        const themeRef = 'input[name="./jcr:content/metadata/themeRef"]'
+        const propertiesSaveBtn = '#shell-propertiespage-doneactivator'
+        cy.openPage(fmPropertiesUI).then(() => {
+            cy.get(themeRef).should('be.visible').clear().type('/libs/fd/af/themes/canvas').then(() => {
+                cy.get(propertiesSaveBtn).click();
+            })
+        })
+    })
+
+    beforeEach(() => {
+        cy.previewForm(pagePath).then(p => {
+            formContainer = p;
+        })
+    });
+
+    it("should focus in the panel if text is first item", () => {
+        const textComponentId = formContainer._model.items[0].items[1].items[0].id ;
+        const buttonId = formContainer._model.items[1].id ;
+        // todo: need to click twice, since today we don't focus on any item on load of the form
+        // todo: this needs to be still implemented in the form
+        cy.get(`#${buttonId} button`).click({force: true});
+        cy.get(`#${buttonId} button`).click({force: true});
+        cy.get(`#${textComponentId}`).should('be.visible');
+    })
+
+
+})