Closes adobe#2776 - Retrieve the component's ID from its correspondin…

…g sling model
paulochang · Jun 5, 2024 · 0b89aba · 0b89aba
1 parent 6bdf5d0
commit 0b89aba
Show file tree

Hide file tree

Showing 14 changed files with 17 additions and 30 deletions.
diff --git a/...nt/src/content/jcr_root/apps/core/wcm/components/breadcrumb/v2/breadcrumb/breadcrumb.html b/...nt/src/content/jcr_root/apps/core/wcm/components/breadcrumb/v2/breadcrumb/breadcrumb.html
@@ -14,9 +14,8 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <nav data-sly-use.breadcrumb="com.adobe.cq.wcm.core.components.models.Breadcrumb"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.template="core/wcm/components/commons/v1/templates.html"
-     id="${component.id}"
+     id="${breadcrumb.id}"
      class="cmp-breadcrumb"
      aria-label="${'Breadcrumb' @ i18n}"
      data-sly-test="${breadcrumb.items.size > 0}"

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/button/v1/button/button.html b/content/src/content/jcr_root/apps/core/wcm/components/button/v1/button/button.html
@@ -14,11 +14,10 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <button data-sly-use.button="com.adobe.cq.wcm.core.components.models.Button"
-        data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
         data-sly-use.iconTemplate="icon.html"
         data-sly-element="${button.link ? 'a' : 'button'}"
         type="${button.link ? '' : 'button'}"
-        id="${component.id}"
+        id="${button.id}"
         class="cmp-button"
         href="${button.link}"
         aria-label="${button.accessibilityLabel}"

diff --git a/...s/core/wcm/components/contentfragmentlist/v1/contentfragmentlist/contentfragmentlist.html b/...s/core/wcm/components/contentfragmentlist/v1/contentfragmentlist/contentfragmentlist.html
@@ -14,10 +14,9 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <sly data-sly-use.list="com.adobe.cq.wcm.core.components.models.contentfragment.ContentFragmentList"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-test="${list.listItems.size>0}" data-sly-use.fragmentTemplate="core/wcm/components/contentfragment/v1/contentfragment/templates.html">
     <section data-sly-list.fragment="${list.listItems}"
-             id="${component.id}"
+             id="${list.id}"
              class="cmp-contentfragmentlist">
         <sly data-sly-call="${fragmentTemplate.contentFragment @ fragment=fragment, wcmmode=wcmmode}"></sly>
     </section>

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/download/v1/download/download.html b/content/src/content/jcr_root/apps/core/wcm/components/download/v1/download/download.html
@@ -14,10 +14,9 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.download="com.adobe.cq.wcm.core.components.models.Download"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.templates="core/wcm/components/commons/v1/templates.html"
      data-sly-test.hasContent="${download.filename}"
-     id="${component.id}"
+     id="${download.id}"
      class="cmp-download${!wcmmode.disabled ? ' cq-dd-file' : ''}">
     <h3 class="cmp-download__title" data-sly-test.title="${download.title}" data-sly-element="${download.titleType}">
         <a data-sly-unwrap="${!download.url || download.hideTitleLink}" class="cmp-download__title-link" href="${download.url}" aria-hidden="true" role="presentation">${title}</a>

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/embed/v1/embed/embed.html b/content/src/content/jcr_root/apps/core/wcm/components/embed/v1/embed/embed.html
@@ -14,11 +14,10 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.embed="com.adobe.cq.wcm.core.components.models.Embed"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.commonsTemplates="core/wcm/components/commons/v1/templates.html"
      data-sly-test.hasContent="${(embed.result && embed.result.processor) || embed.html || embed.embeddableResourceType}"
      data-cmp-data-layer="${embed.data.json}"
-     id="${component.id}"
+     id="${embed.id}"
      class="cmp-embed">
     <sly data-sly-test="${embed.result && embed.result.processor}"
          data-sly-use.processorTemplate="processors/${embed.result.processor}.html"

diff --git a/...apps/core/wcm/components/experiencefragment/v1/experiencefragment/experiencefragment.html b/...apps/core/wcm/components/experiencefragment/v1/experiencefragment/experiencefragment.html
@@ -14,12 +14,11 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.fragment="com.adobe.cq.wcm.core.components.models.ExperienceFragment"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.template="core/wcm/components/commons/v1/templates.html"
-     data-sly-test=${fragment.configured}
-     data-sly-set.selector="content.${request.requestPathInfo.selectorString}"
+     data-sly-test="${fragment.configured}"
+     data-sly-set.selector="${'content.' @format=request.requestPathInfo.selectorString}"
      data-sly-resource="${@path=fragment.localizedFragmentVariationPath, selectors=selector, wcmmode='disabled'}"
-     id="${component.id}"
+     id="${fragment.id}"
      class="cmp-experiencefragment cmp-experiencefragment--${fragment.name}">
 </div>
 <sly data-sly-call="${template.placeholder @ isEmpty=!fragment.configured, classAppend='cmp-dd-experiencefragment'}"></sly>
diff --git a/content/src/content/jcr_root/apps/core/wcm/components/image/v2/image/image.html b/content/src/content/jcr_root/apps/core/wcm/components/image/v2/image/image.html
@@ -14,7 +14,6 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.image="com.adobe.cq.wcm.core.components.models.Image"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.templates="core/wcm/components/commons/v1/templates.html"
      data-sly-test="${image.src}"
      data-cmp-is="image"
@@ -27,7 +26,7 @@
      data-asset="${image.fileReference}"
      data-asset-id="${image.uuid}"
      data-title="${image.title || image.alt}"
-     id="${component.id}"
+     id="${image.id}"
      data-cmp-data-layer="${image.data.json}"
      class="cmp-image${!wcmmode.disabled ? ' cq-dd-image' : ''}"
      itemscope itemtype="http://schema.org/ImageObject">

diff --git a/...apps/core/wcm/components/languagenavigation/v1/languagenavigation/languagenavigation.html b/...apps/core/wcm/components/languagenavigation/v1/languagenavigation/languagenavigation.html
@@ -14,13 +14,12 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <nav data-sly-use.languageNavigation="com.adobe.cq.wcm.core.components.models.LanguageNavigation"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.commonsTemplates="core/wcm/components/commons/v1/templates.html"
      data-sly-use.groupTemplate="group.html"
      data-sly-call="${groupTemplate.group @ items=languageNavigation.items}"
      data-sly-test.hasContent="${languageNavigation.items.size > 0}"
 	 data-cmp-data-layer="${languageNavigation.data.json}"
-     id="${component.id}"
+     id="${languageNavigation.id}"
      class="cmp-languagenavigation"
      aria-label="${languageNavigation.accessibilityLabel}">
 </nav>

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/list/v2/list/list.html b/content/src/content/jcr_root/apps/core/wcm/components/list/v2/list/list.html
@@ -14,11 +14,10 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <ul data-sly-use.list="com.adobe.cq.wcm.core.components.models.List"
-    data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
     data-sly-use.template="core/wcm/components/commons/v1/templates.html"
     data-sly-use.itemTemplate="item.html"
     data-sly-list.item="${list.listItems}"
-    id="${component.id}"
+    id="${list.id}"
     data-cmp-data-layer="${list.data.json}"
     class="cmp-list">
     <li class="cmp-list__item" data-sly-call="${itemTemplate.item @ list = list, item = item}"

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/separator/v1/separator/separator.html b/content/src/content/jcr_root/apps/core/wcm/components/separator/v1/separator/separator.html
@@ -13,9 +13,8 @@
   ~ See the License for the specific language governing permissions and
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
-<div data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
-     data-sly-use.separator="com.adobe.cq.wcm.core.components.models.Separator"
-     id="${component.id}"
+<div data-sly-use.separator="com.adobe.cq.wcm.core.components.models.Separator"
+     id="${separator.id}"
      class="cmp-separator">
     <hr class="cmp-separator__horizontal-rule"
         data-sly-attribute.role="${separator.decorative ? 'none': ''}"

diff --git a/...jcr_root/apps/core/wcm/components/tableofcontents/v1/tableofcontents/tableofcontents.html b/...jcr_root/apps/core/wcm/components/tableofcontents/v1/tableofcontents/tableofcontents.html
@@ -14,9 +14,8 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.toc="com.adobe.cq.wcm.core.components.models.TableOfContents"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      class = "cmp-toc__placeholder"
-     id = "${component.id}"
+     id = "${toc.id}"
      data-cmp-toc-list-type = "${toc.listType && toc.listType.value}"
      data-cmp-toc-start-level = "${toc.startLevel && toc.startLevel.value}"
      data-cmp-toc-stop-level = "${toc.stopLevel && toc.stopLevel.value}"

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/text/v1/text/text.html b/content/src/content/jcr_root/apps/core/wcm/components/text/v1/text/text.html
@@ -15,5 +15,5 @@
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <sly data-sly-use.textModel="com.adobe.cq.wcm.core.components.models.Text"
      data-sly-use.templates="core/wcm/components/commons/v1/templates.html"/>
-<p data-sly-test.text="${textModel.text}" data-sly-unwrap="${textModel.isRichText}">${text @ context = textModel.isRichText ? 'html' : 'text'}</p>
+<p data-sly-test.text="${textModel.id}" data-sly-unwrap="${textModel.isRichText}">${text @ context = textModel.isRichText ? 'html' : 'text'}</p>
 <sly data-sly-call="${templates.placeholder @ isEmpty = !text}"></sly>
diff --git a/content/src/content/jcr_root/apps/core/wcm/components/text/v2/text/text.html b/content/src/content/jcr_root/apps/core/wcm/components/text/v2/text/text.html
@@ -14,11 +14,10 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.textModel="com.adobe.cq.wcm.core.components.models.Text"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.templates="core/wcm/components/commons/v1/templates.html"
      data-sly-test.text="${textModel.text}"
      data-cmp-data-layer="${textModel.data.json}"
-     id="${component.id}"
+     id="${textModel.id}"
      class="cmp-text">
     <p class="cmp-text__paragraph"
        data-sly-unwrap="${textModel.isRichText}">${text @ context = textModel.isRichText ? 'html' : 'text'}</p>

diff --git a/content/src/content/jcr_root/apps/core/wcm/components/title/v2/title/title.html b/content/src/content/jcr_root/apps/core/wcm/components/title/v2/title/title.html
@@ -14,11 +14,10 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <div data-sly-use.title="com.adobe.cq.wcm.core.components.models.Title"
-     data-sly-use.component="com.adobe.cq.wcm.core.components.models.Component"
      data-sly-use.template="core/wcm/components/commons/v1/templates.html"
      data-sly-test.text="${title.text}"
      data-cmp-data-layer="${title.data.json}"
-     id="${component.id}"
+     id="${title.id}"
      class="cmp-title">
     <h1 class="cmp-title__text" data-sly-element="${title.type}"><a
             data-sly-unwrap="${!title.linkURL || title.linkDisabled}" class="cmp-title__link"