Forms-3342 editElementQuery changes as span (#883)

* FORMS-3342 : editElementQuery changes as span

* FORMS-3342 : added the test cases

* FORMS-3342 : test case editted

* FORMS-3342 : changes due to review commits

* FORMS-3342 : changes due to

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/button/v1/button/_cq_editConfig.xml

@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+          jcr:primaryType="cq:EditConfig"
+          cq:actions="[edit,-,copymove,delete,-,insert,-]"
+          cq:dialogMode="floating"
+          cq:layout="editbar"
+          cq:disableTargeting="{Boolean}true">
+    <cq:actionConfigs jcr:primaryType="nt:unstructured">
+        <editexpression
+                jcr:primaryType="nt:unstructured"
+                handler="CQ.FormsCoreComponents.editorhooks.openRuleEditor"
+                order="after CONFIGURE"
+                icon="bidRule"
+                text="Edit Rules"/>
+        <replace
+                jcr:primaryType="nt:unstructured"
+                condition="CQ.FormsCoreComponents.editorhooks.isReplaceable"
+                handler="CQ.FormsCoreComponents.editorhooks.replace"
+                icon="shuffle"
+                text="Replace"/>
+    </cq:actionConfigs>
+    <cq:inplaceEditing
+            jcr:primaryType="cq:InplaceEditingConfig"
+            active="{Boolean}true"
+            configPath="inplaceEditingConfig"
+            editorType="plaintext">
+        <inplaceEditingConfig
+                jcr:primaryType="nt:unstructured"
+                editElementQuery="span:first"
+                textPropertyName="jcr:title"/>
+    </cq:inplaceEditing>
+</jcr:root>

ui.tests/test-module/specs/button/button.authoring.spec.js

@@ -40,6 +40,15 @@ describe('Button - Authoring', function () {
         cy.get('body').click( 0,0);
     }
 
+    const getContentIframeBody = () => {
+        // get the iframe > document > body
+        // and retry until the body element is not empty
+        return cy
+            .get('iframe#ContentFrame')
+            .its('0.contentDocument.body').should('not.be.empty')
+            .then(cy.wrap)
+      }
+
     const testButtonBehaviour = function(buttonEditPathSelector, buttonDrop, isSites) {
         if (isSites) {
             dropButtonInSites();
@@ -64,6 +73,22 @@ describe('Button - Authoring', function () {
         cy.deleteComponentByPath(buttonDrop);
     }
 
+    const testButtonBehaviourInilineEdit = function(buttonEditPathSelector, buttonDrop, isSites) {
+        if (isSites) {
+            dropButtonInSites();
+        } else {
+            dropButtonInContainer();
+        }
+        cy.openEditableToolbar(sitesSelectors.overlays.overlay.component + buttonEditPathSelector);
+        cy.invokeEditableAction("[data-action='EDIT']");
+        getContentIframeBody().find('.cmp-adaptiveform-button__text').then(($span) => {
+            $span[0].textContent = '';
+          });
+          cy.get('body').click(0,0);
+          cy.get("[data-path='/content/forms/af/core-components-it/blank/jcr:content/guideContainer/button']").should('exist').should('not.have.text', '');
+    }
+
+
     context('Open Forms Editor', function() {
         const pagePath = "/content/forms/af/core-components-it/blank",
             buttonEditPath = pagePath + afConstants.FORM_EDITOR_FORM_CONTAINER_SUFFIX + "/button",
@@ -83,6 +108,13 @@ describe('Button - Authoring', function () {
             cy.cleanTest(buttonDrop).then(function(){
                 testButtonBehaviour(buttonEditPathSelector, buttonDrop);
             });
+        });
+
+        it ('open Inline edit dialog of Button',{ retries: 3 }, function(){
+            cy.cleanTest(buttonDrop).then(function(){
+                testButtonBehaviourInilineEdit(buttonEditPathSelector, buttonDrop);
+                cy.deleteComponentByPath(buttonDrop);
+            });
         })
     })