1 Flashcards
(106 cards)
A quickstart jar file needs to allow an AEM author instance to be installed on the localhost on port 6302.
What should this file be renamed before launching?
( ) cq-author-p4502.jar
( ) cq-author-x6302.jar
( ) cq-author-p6302.jar
( ) aem-p6302-author.jar
(+) cq-author-p6302.jar
AEM is installed in $AEM_HOME.
In which subfolder is the command line startup and shutdown scripts located?
( ) $AEM_HOME/crx-quickstart/bin/
( ) $AEM_HOME/crx-quickstart/opt/
( ) $AEM_HOME/crx-quickstart/scripts/
( ) $AEM_HOME/
(+) $AEM_HOME/crx-quickstart/bin/
For each CRX node in the hierarchy, which actions can be configured using the user admin interface?
( ) Read, Write, Delete, Edit ACL, Replicate
( ) Read, Modify, Create, Delete, Read ACL, Edit ACL, Replicate
( ) Read, Write, Read ACL, Edit ACL, Replicate
( ) Read, Modify, Create, Delete, Read ACL, Edit ACL
(+) Read, Modify, Create, Delete, Read ACL, Edit ACL, Replicate
See https://experienceleague.adobe.com/docs/experience-manager-64/administering/security/security.html?lang=en#permissions-in-aem
In which two ways can a developer keep simple and maintainable CRX Access Control Lists? (Choose two.)
( ) Assign access rights user by user
( ) Use Deny statements extensively
( ) Assign access rights to user groups rather than users
( ) Use Deny statements sparingly
( ) Delete the everyone group
(+) Assign access rights to user groups rather than users
(+) Use Deny statements sparingly
See https://experienceleague.adobe.com/docs/experience-manager-64/administering/security/security.html?lang=en#permission-states
An online insurance company website has user-generated content that must be replicated in all publish instances.
What action should the developer take to achieve this?
( ) Configure reverse replication agents for the author
( ) Disable static agent in the author instance
( ) Configure the replication agent in the publish instances
( ) Configure the dispatcher flush agent in publish instance
(+) Configure reverse replication agents for the author
Reverse replication is used to get user content generated on a publish instance back to an author instance. This is commonly used for features such as surveys and registration forms.
As the publish environment is usually in the DMZ, to get content back to the author environment THE CONNECTION MUST BE INITIATED FROM THE AUTHOR INSTANCE. This is done with:
- an outbox in the publish environment where the content is placed.
- an agent (publish) in the author environment which periodically polls the outbox for new content.
To do this you need:
- A reverse replication agent in the AUTHOR environment. This acts as the active component to collect information from the outbox in the publish environment:
- A reverse replication agent in the publish environment (an outbox) This is the passive element as it acts as an “outbox”. User input is placed here, from where it is collected by the agent in the author environment.
https://experienceleague.adobe.com/docs/experience-manager-64/deploying/configuring/replication.html?lang=en#configuring-reverse-replication
How should a developer configure the replication agent to flush the dispatcher cache for a newly activated page?
( ) Create a reverse replication agent on the author instance
( ) Set the serialization type property of the default agent to dispatcher flush
( ) Create a new replication agent and set transport URI to point to the dispatcher
( ) Create a dispatcher flush agent in publish instance
(+) Create a dispatcher flush agent in publish instance
Under certain circumstances, performance gains can be made by transferring cache management from the authoring environment to a publishing instance. It will then be the PUBLISHING environment (not the AEM authoring environment) that sends a cache invalidation request to Dispatcher when a published page is received.
Such circumstances include:
- Preventing possible timing conflicts between Dispatcher and the publish instance (see Invalidating Dispatcher cache from the Authoring Environment).
- The system includes several publishing instances that reside on high performance servers, and only one authoring instance.
The dispatcher flush is controlled by a replication AGENT operating on the PUBLISH instance. However, the configuration is made on the authoring environment and then transferred by activating the agent
After configuring, when you ACTIVATE a page FROM author TO publish, this agent (PUBLISH) initiates a standard replication. The log includes messages indicating requests coming from your publish server, similar to the following example:
13:29:47 127.0.0.1 POST /dispatcher/invalidate.cache 200
https://experienceleague.adobe.com/docs/experience-manager-64/deploying/configuring/replication.html?lang=en#configuring-a-dispatcher-flush-agent
https://experienceleague.adobe.com/docs/experience-manager-dispatcher/using/configuring/page-invalidate.html?lang=en#invalidating-dispatcher-cache-from-a-publishing-instance
A developer is monitoring the default replication agent on the author instance. The replication queue is blocked with a single item in it. The developer tests the connection, and the replication test is successful.
What is causing this issue?
( ) The replication agent has NOT been configured on the publish instance.
( ) The publish instance is offline.
( ) The replication user does NOT have permission to replicate the blocking item.
( ) The replication URI is incorrect.
(+) The replication user does NOT have permission to replicate the blocking item.
Two AEM publish instances feed a single Dispatcher.
Which part of the Dispatcher configuration should a developer review to ensure both AEM publish instances are used?
( ) cache
( ) filter
( ) farms
( ) virtualhosts
(+) farms
https://experienceleague.adobe.com/docs/experience-manager-dispatcher/using/configuring/dispatcher-configuration.html?lang=en#defining-farms-farms
Too many pages are invalidated in the dispatcher cache when a page is published.
What is most likely causing this issue in the dispatcher configuration?
( ) The level of cache invalidation is NOT appropriate for the published content model.
( ) The OS file system permissions are NOT properly configured.
( ) Sticky sessions are NOT configured properly, resulting in requests being delivered to the wrong server.
( ) File globbing in the dispatcher configuration is NOT correct.
(+) The level of cache invalidation is NOT appropriate for the published content model.
https://experienceleague.adobe.com/docs/experience-manager-dispatcher/using/configuring/dispatcher-configuration.html?lang=en#invalidating-files-by-folder-level
There are performance, stability, and security issues with an installed AEM instance
What should a developer do to fix these issues?
( ) Delete and reinstall the AEM instance
( ) Install Adobe-provided Apache configuration file
( ) Install service pack updates from package share
( ) Stop, clear cache files, and restart the AEM instance
(+) Install service pack updates from package share
A developer installs the latest Service pack to a local AEM author instance.
How should the developer install this package on the publish instance?
( ) Use upload/install from OSGI console of publish instance
( ) Replicate from package manager of author instance
( ) Use upload/install from OSGI console of author instance
( ) Replicate from package manager of publish instance
(+) Replicate from package manager of author instance
A developer needs to create a new component called “Component A”. Component A must show a list of other components that all have a resource type of existing “Component B”. Component A must render this list of tiles for each Component B where the tile rendering is different from the default one. The list of rendered tiles must be reusable by future new components.
How should the developer implement this functionality?
( ) Create a script for tile rendering in Component B and use data-sly-resource attribute with a Sling selector in Component A to render the tile.
( ) Component A overlays Component B and overwrites the base renderer to facilitate the tiles.
( ) Component A inherits from Component B and overwrites the base renderer to facilitate the tiles.
( ) Component A calls the HTL of Component B directly using a data-sly-include attribute.
(+) Create a script for tile rendering in Component B and use data-sly-resource attribute with a Sling selector in Component A to render the tile.
See -> https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#229-resource
The resourceType-option comes handy if you want to point to a different ‘component’ to render your node, other than the one specified via sling:resourceType on the node level.
<div></div>
renders the ‘foo’ node via the component specified at sling:resourceType
<div></div>
renders the ‘foo’ node via the component a/b/c/d
See -> https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/data-sly-resource-attributes/m-p/210945
A developer is working on a custom component with a configurable image. Authors configure this image through the component dialog by editing a field with the following attributes:
+ image
- autoStart=”{Boolean}false”
- class=”cq-droptarget”
- jcr:primaryType=”nt:unstructured”
- sling:resourceType=”cq/gui/components/authoring/dialog/fileupload”
- fileNameParameter=”./fileName”
- fileReferenceParameter=”./fileReference”
- mimeTypes=”[image/gif,image/jpeg,image/png,image/svg+xml,image/tiff,image/webp]”
- multiple=”{Boolean}false”
- name=”./file”
- title=”Image”
- uploadUrl=”${suffix.path}”
- useHTML5=”{Boolean}true”
Authors must be able to drag an image directly from the sidekick into the component to configure the image. The developer needs to add a drop target configuration to the component to meet this requirement.
Which drop target configuration should be used?
( ) + cq:dropTargets
+ image
- jcr:primaryType=”nt:unstructured”
- accept=”[image/gif,image/jpeg,image/png,image/svg+xml,image/tiff,image/webp]”
- groups=”[media]”
- propertyName=”./fileReference”
( ) + cq:dropTargets
+ image
- jcr:primaryType=”nt:unstructured”
- accept=”[image/gif,image/jpeg,image/png,image/svg+xml,image/tiff,image/webp]”
- groups=”[media]”
- propertyName=”./file”
( ) + cq:dropTargets
+ image
- jcr:primaryType=”nt:unstructured”
- accept=”[image/gif,image/jpeg,image/png,image/svg+xml,image/tiff,image/webp]”
- group=”media”
- propertyName=”./file”
( ) + cq:dropTargets
+ image
- jcr:primaryType=”nt:unstructured”
- accept=”[image/gif,image/jpeg,image/png,image/svg+xml,image/tiff,image/webp]”
- group=”media”
- propertyName=”./fileReference”
(+) + cq:dropTargets
+ image
- jcr:primaryType=”nt:unstructured”
- accept=”[image/gif,image/jpeg,image/png,image/svg+xml,image/tiff,image/webp]”
- groups=”[media]”
- propertyName=”./fileReference”
http://www.sgaemsolutions.com/2019/01/cqdroptagets-in-cqeditconfig-node-in-aem.html
A developer needs to create a component with the following requirements:
The component must be configurable
The component should be editable, NOT removable
An author should be unable to add the component to a page through design mode
Which node structure should the developer use to meet these requirements?
( ) + component
- jcr:primaryType=”cq:Component”
- jcr:title=”Component”
- cq:actions = “[edit]”
+ cq:dialog
…
( ) + component
- jcr:primaryType=”cq:Component”
- jcr:title=”Component”
- componentGroup=”.hidden”
+ cq:dialog
…
+ cq:editConfig
- cq:actions = “[edit]”
( ) + component
- jcr:primaryType=”cq:Component”
- jcr:title=”Component”
- componentGroup=”.hidden”
- cq:actions = “[edit]”
+ cq:dialog
…
( ) + component
- jcr:primaryType=”cq:Component”
- jcr:title=”Component”
- hidden=”true”
+ cq:dialog
…
+ cq:editConfig
- cq:actions = “[edit]”
(+) + component
- jcr:primaryType=”cq:Component”
- jcr:title=”Component”
- componentGroup=”.hidden”
+ cq:dialog
…
+ cq:editConfig
- cq:actions = “[edit]”
A developer creates a custom component. The component dialog includes the following two fields:
+ text
- jcr:primaryType=”nt:unstructured”
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Text”
- name=”./text”
+ charLimit
- jcr:primaryType=”nt:unstructured”
- sling:resourceType=”granite/ui/components/coral/foundation/form/numberfield”
- defaultValue=”0”
- fieldLabel=”Character Limit”
- name=”./charLimit”
The component should display the first ‘X’ characters of the text entered in the ‘text’ input, where ‘X’ is the number entered in the ‘charLimit’ input. If zero, or no value, is entered in the ‘charLimit’ input, then the text should be unaltered. The developer creates the following Sling Model to perform the truncation:
@Model(adaptables = SlingHttpServletRequest.class, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
public class Truncation {
@ValueMapValue
private String text;
@ValueMapValue
private Integer charLimit;
@PostConstruct
private void init() {
if (text != null && 0 < charLimit && charLimit < text.length()) {
text = text.substring(0, charLimit);
}
}
public String getText() {
return text;
} }
A Null Pointer Exception occurs if NO charLimit value is set in the component dialog.
What should the developer do to resolve this issue?
( ) Replace the defaultValue=”0” attribute of the charLimit field in the dialog with defaultValue=”{Long}0”
( ) Add the @Default annotation to the charLimit variable in the Sling Model
( ) Replace the defaultValue=”0” attribute of the charLimit field in the dialog with min=”0”
( ) Change the defaultInjectionStrategy of the Truncation Sling Model to DefaultInjectionStrategy.REQUIRED
(+) Add the @Default annotation to the charLimit variable in the Sling Model
https://sling.apache.org/documentation/bundles/models.html#annotation-reference-1
A developer has a component foobar that consists of the files listed below:
script-a.js
“use strict”;
use(function () {
return “foo”;
});
script-b.js
“use strict”;
use(function () {
return “”;
});
foobar.html
<div>
<div></div>
<div></div>
<div></div>
<div></div></div>
What is the output when this component is rendered?
( ) <div>
<div class="bar"></div>
<div class="foo"></div>
<div></div>
<div class=""></div>
</div>
( ) <div>
<div class="foo"></div>
<div class="foo"></div>
<div class=""></div>
<div class="foo"></div>
</div>
( ) <div>
<div class="bar"></div>
<div class="bar"></div>
<div class="foo"></div>
<div class=""></div>
</div>
( ) <div>
<div class="bar"></div>
<div class="foo"></div>
<div></div>
<div></div>
</div>
(+) <div>
<div class="bar"></div>
<div class="foo"></div>
<div></div>
<div class=""></div>
</div>
https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#223-attribute
## Attributes are processed left-to-right:
foobar = {‘id’: ‘foo’, ‘class’: ‘bar’, ‘lang’: ‘’}
<div></div>
<div></div>
<div></div>
<div></div>
## Boolean values allow to control the display of boolean attributes:
## Arrays are cast to strings:
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
——————————————————————##Numbers are cast to strings (i.e. zero doesn’t remove the attribute):
<div></div>
<div></div>
## Note: Event handler attributes (on*) and the style attribute cannot be generated with data-sly-attribute due to the fact that none of the available display contexts can fully protect against XSS attacks given the range of values that these attributes can contain.
A developer is creating a custom component that shows a list of pages. For each page, the following items must be shown:
- Title of the page
- Description of the page
- A button with fixed text “Read more” that must be translatable
All of the above fields must be wrapped in a <div> tag.
The logic for obtaining the list of pages must be reusable for future components.
Which snippet should the developer use to meet these requirements?
( )
<div>
<p>${item.title}</p>
<p>${item.description}</p>
<a> ${“Read more” @ .translate} </a><a>
</a></div>
( )
<div>
<p>${page.title}</p>
<p>${page.description}</p>
<a>${“Read more” @ i18n} </a><a>
</a></div>
( )
<div>
<p>${model.title}</p>
<p>${model.description}</p>
<a>${“Read more” @ .translate} </a><a>
</a></div>
( )
<div>
<p>${item.title}</p>
<p>${item.description}</p>
<a>${“Read more” @ i18n} </a><a>
</a></div></div>
(+)
<div>
<p>${item.title}</p>
<p>${item.description}</p>
<a>${“Read more” @ i18n} </a><a>
</a></div>
https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#227-repeat
https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#123-i18n
##Repeats the content of the element for each item of the provided object (which can be an array, or any iterable object).
<p>${item.text}</p>
<p>${childResource.text}</p>
<div>${article.excerpt}</div>
<div>${article.excerpt}</div>
## An additional itemList (respectively List in case a custom identifier/variable was defined using data-sly-repeat.) identifier is also available within the scope, with the following members:
- index: zero-based counter (0..length-1);
- count: one-based counter (1..length);
- first: true for the first element being iterated;
- middle: true if element being iterated is neither the first nor the last;
- last: true for the last element being iterated;
- odd: true if count is odd;
- even: true if count is even.
##When iterating over Map objects, the item variable contains the key of each map item:
<p>
<span>key: ${item}</span>
<span>value: ${myMap[item]}</span>
</p>
A developer has a component named ‘foobar’ with the following file:
foobar.html
<div></div>
<div></div>
What is the output when the component is rendered?
( ) <div></div>
<div></div>
( ) <div></div>
<div></div>
( ) <div></div>
<div></div>
( ) <div></div>
<div></div>
Follows the same data-sly-attribute rules( https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#223-attribute)
(+) <div></div>
<div></div>
## Attributes are processed left-to-right:
foobar = {‘id’: ‘foo’, ‘class’: ‘bar’, ‘lang’: ‘’}
<div></div>
<div></div>
<div></div>
<div></div>
## Boolean values allow to control the display of boolean attributes:
## Arrays are cast to strings:
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
##Numbers are cast to strings (i.e. zero doesn’t remove the attribute):
<div></div>
<div></div>
## Note: Event handler attributes (on*) and the style attribute cannot be generated with data-sly-attribute due to the fact that none of the available display contexts can fully protect against XSS attacks given the range of values that these attributes can contain.p>
A developer needs to implement a header component for a website. The component has the following requirements:
- The component should be configured once on the page highest in the hierarchy.
- The header component on pages lower in the hierarchy should look the same and show the same data.
- If necessary, the configuration can be overwritten on a child page.
- The component should show a list of links that are configured in the header component.
Which code snippet for returning the list of pages should the developer use?
( ) public String[] getHeaderLinks(Page page) {
final Resource pageContent = page.getContentResource();
final ComponentInheritanceValueMap properties = new ComponentInheritanceValueMap(pageContent);
return properties.get(HEADER_PAGE_LIST, String[].class);
}
( ) public String[] getHeaderLinks(Resource componentResource) {
final HierarchyNodeInheritanceValueMap properties = componentResource.adaptTo(HierarchyNodeInheritanceValueMap.class);
return properties.get(HEADER_PAGE_LIST, String[].class);
}
( ) public String[] getHeaderLinks(Resource componentResource) {
final ComponentInheritanceValueMap properties = componentResource.adaptTo(ComponentInheritanceValueMap.class);
return properties.getInherited(HEADER_PAGE_LIST, String[].class);
}
( ) public String[] getHeaderLinks(Resource componentResource) {
final HierarchyNodeInheritanceValueMap properties = new HierarchyNodeInheritanceValueMap(componentResource);
return properties.getInherited(HEADER_PAGE_LIST, String[].class);
}
(+) public String[] getHeaderLinks(Resource componentResource) {
final HierarchyNodeInheritanceValueMap properties = new HierarchyNodeInheritanceValueMap(componentResource);
return properties.getInherited(HEADER_PAGE_LIST, String[].class);
}
https://developer.adobe.com/experience-manager/reference-materials/6-5/javadoc/com/day/cq/commons/inherit/HierarchyNodeInheritanceValueMap.html
https://developer.adobe.com/experience-manager/reference-materials/6-5/javadoc/com/day/cq/commons/inherit/ComponentInheritanceValueMap.html
## HierarchyNodeInheritanceValueMap
Note that HierarchyNodeInheritanceValueMap searches ONLY the PAGE hierarchy. It will NOT (for instance), look in:
/content/parent/page/jcr:content/footer/@width
See ComponentInheritanceValueMap for that functionality.
For example, given: /content/parent/page/jcr:content/footer/image/@width, the HierarchyNodeInheritanceValueMap will search for a footer/image/@width property in:
- /content/parent/page/jcr:content/footer/image/@width
- /content/parent/jcr:content/footer/image/@width
- /content/jcr:content/footer/image/@width
Having not found it in any of those locations, it will then return null.
## ComponentInheritanceValueMap
An InheritanceValueMap for a given Resource that will inherit values from ancestors up to its ancestral component, but no higher.
For example, given: /content/parent/page/jcr:content/footer/image/@width, the ComponentInheritanceValueMap will search for a width property in:
/content/parent/page/jcr:content/footer/image/@width
/content/parent/page/jcr:content/footer/@width
/content/parent/page/jcr:content/@width
Having not found it in any of those locations, it will then return null.
Note that ComponentInheritanceValueMap searches ONLY the COMPONENT hierarchy. It will NOT (for instance), look in:
/content/parent/jcr:content/footer/image/@width
See HierarchyNodeInheritanceValueMap for that functionality.
A developer is working on an HTL script for a custom component. The script has the following requirements:
- This script must list the title of every child page of the current page.
- If a child page does NOT have any children, then its title should link directly to that page.
- If a child page has children, then the title of every one of its children should be listed beneath its title.
- The title of every grandchild page should link directly to that page.
Which HTL script should the developer use to meet these requirements?
( ) <ul>
<li>
<b>${child.title}</b>
<ul>
<li>
<a href="%24%7Bgrandchild.path%20@%20extension%20=%20'html'%7D">${grandchild.title}</a>
</li>
</ul>
<a href="%24%7Bchild.path%20@%20extension%20=%20'html'%7D">${child.title}</a>
</li>
</ul>
( ) <ul>
<li>
<b>${child.title}</b>
<ul>
<li>
<a href="%24%7Bgrandchild.path%20@%20extension%20=%20'html'%7D">${grandchild.title}</a>
</li>
</ul>
<a href="%24%7Bchild.path%20@%20extension%20=%20'html'%7D">${child.title}</a>
</li>
</ul>
( ) <ul>
<li>
<b>${child.title}</b>
<ul>
<li>
<a href="%24%7Bgrandchild.path%7D">${grandchild.title}</a>
</li>
</ul>
<a href="%24%7Bchild.path%7D">${child.title}</a>
</li>
</ul>
( ) <ul>
<li>
<b>${child.title}</b>
<ul>
<li>
<a href="%24%7Bgrandchild.path%7D">${grandchild.title}</a>
</li>
</ul>
<a href="%24%7Bchild.path%7D">${child.title}</a>
</li>
</ul>
(+) <ul>
<li>
<b>${child.title}</b>
<ul>
<li>
<a href="%24%7Bgrandchild.path%20@%20extension%20=%20'html'%7D">${grandchild.title}</a>
</li>
</ul>
<a href="%24%7Bchild.path%20@%20extension%20=%20'html'%7D">${child.title}</a>
</li>
</ul>
–> See https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#225-test
–> See https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#125-uri-manipulation
–> See https://experienceleague.adobe.com/docs/experience-manager-htl/content/global-objects.html?lang=en
A developer has a component named ‘foobar’ with the following file:
FooBar.java
import com.adobe.cq.sightly.WCMUsePojo;
public class FooBar extends WCMUsePojo {
@Override
public void activate() throws Exception {}
public String getLink() {
return "https://www.foo'bar.com";
}
public String getText() {
return "foo'bar";
} }
foobar.html
<div>
<a>
${fooBar.text}
</a>
</div>
What is the output when the component is rendered?
( ) <div>
<a>
foo’bar
</a>
</div>
( ) <div>
<a>
foo’bar
</a>
</div>
( ) <div>
<a>
foo’bar
</a>
</div>
( ) <div>
<a>
foo’bar
</a>
</div>
(+) <div>
<a>
foo’bar
</a>
</div>
https://experienceleague.adobe.com/docs/experience-manager-htl/content/getting-started.html?lang=en#automatic-context-aware-escaping
A developer is working with the following HTL expression in a component rendering script:
${‘path/page.infinity.json’ @ extension = ‘html’,
removeSelectors = [‘foo’],
selectors = [‘foo’, ‘bar’],
prependSuffix = ‘hello’,
suffix = ‘world’}
What is the expected output of this expression?
( ) path/page.bar.html/hello/world
( ) path/page.infinity.json.bar.html/world
( ) path/page.foo.bar.html/hello/world
( ) path/page.bar.html/world
(+) path/page.bar.html/hello/world
https://github.com/adobe/htl-spec/blob/master/SPECIFICATION.md#125-uri-manipulation
## Note: It seems URI manipulation DOESN’T work like attributes (data-sly-attribute) which are processed from left to right. URI manipulation seems to apply all at once, concurrently
- selectors - MODIFIES OR REMOVES the selectors from a URI; the selectors are the URI segments between the part that identifies a resource (the resource’s path) and the extension used for representing the resource
- addSelectors - adds the provided selectors (selectors string or selectors array) to the URI
- removeSelectors - removes the provided selectors (selectors string or selectors array) from the URI
The developer is presented with a component “Component A” which inherits from a component “Component B”.
The dialog of Component A on path ../cq:dialog/../../items looks like:
+ align
- jcr:primaryType=”nt:unstructured”
- sling:resourceType=”granite/ui/components/coral/foundation/form/select”
- fieldLabel=”Align Text”
- name=”./align”
The dialog of Component B on path ../cq:dialog/../../items looks like:
+ title
- jcr:primaryType=”nt:unstructured”
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Title”
- name=”./title”
+ description
- jcr:primaryType=”nt:unstructured”
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Description”
- name=”./description”
The requirement for the dialog is that the Align text field is shown after the Title field.
What should the developer do without changing Component B?
( ) Move all the nodes under the item node from Component B to Component A and order them according the requirements.
( ) Extend Component B with the functionality of Component A
( ) Add the property sling:orderBefore=”description” to the align node.
( ) Move the align node from Component A to Component B and order them according the requirements.
(+) Add the property sling:orderBefore=”description” to the align node.
https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/spa-editor/react/extend-component.html?lang=en#extend-dialog
https://sling.apache.org/documentation/bundles/resource-merger.html#child-resource-order-1
Our Banner component requires an extra text field in the dialog to capture the bannerText.
Since we are using Sling inheritance, we can use features of the Sling Resource Merger to override or extend portions of the dialog. In this sample a new tab has been added to the dialog to capture additional data from an author to populate the Card Component.
A developer is working on a dialog for a contact list component. The dialog has the following requirements:
- The list of contacts must include one or more entries
- Contact details must include a full name
- Contact details must include an email address
- Contact details can optionally include a short bio
- Authors need to be able to rearrange the contacts in the list
Which dialog configuration should the developer use to meet all of these requirements?
( ) + multi
- sling:resourceType=”granite/ui/components/coral/foundation/form/multifield”
- composite=”{Boolean}true”
- fieldLabel=”Contact List”
- required=”{Boolean}true”
+ field
- sling:resourceType=”granite/ui/components/coral/foundation/container”
- name=”./contacts”
+ items
+ name
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Full Name”
- name=”./name”
- required=”{Boolean}true”
+ email
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Email Address”
- name=”./email”
- required=”{Boolean}true”
+ bio
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Short Bio”
- name=”./bio”
( ) + multi
- sling:resourceType=”granite/ui/components/coral/foundation/form/multifield”
- fieldLabel=”Contact List”
+ field
- sling:resourceType=”granite/ui/components/coral/foundation/container”
- composite=”{Boolean}true”
- name=”./contacts”
+ items
+ name
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Full Name”
- name=”./name”
+ email
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Email Address”
- name=”./email”
+ bio
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Short Bio”
- name=”./bio”
- required=”{Boolean}false”
( ) + multi
- sling:resourceType=”granite/ui/components/coral/foundation/form/multifield”
- composite=”{Boolean}true”
- fieldLabel=”Contact List”
+ field
- sling:resourceType=”granite/ui/components/coral/foundation/container”
- name=”./contacts”
+ items
+ name
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Full Name”
- name=”./name”
+ email
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Email Address”
- name=”./email”
+ bio
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Short Bio”
- name=”./bio”
- required=”{Boolean}false”
( ) + multi
- sling:resourceType=”granite/ui/components/coral/foundation/form/multifield”
- fieldLabel=”Contact List”
- required=”{Boolean}true”
+ field
- sling:resourceType=”granite/ui/components/coral/foundation/container”
- composite=”{Boolean}true”
- name=”./contacts”
+ items
+ name
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Full Name”
- name=”./name”
- required=”{Boolean}true”
+ email
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Email Address”
- name=”./email”
- required=”{Boolean}true”
+ bio
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Short Bio”
- name=”./bio”
(+) + multi
- sling:resourceType=”granite/ui/components/coral/foundation/form/multifield”
- composite=”{Boolean}true”
- fieldLabel=”Contact List”
- required=”{Boolean}true”
+ field
- sling:resourceType=”granite/ui/components/coral/foundation/container”
- name=”./contacts”
+ items
+ name
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Full Name”
- name=”./name”
- required=”{Boolean}true”
+ email
- sling:resourceType=”granite/ui/components/coral/foundation/form/textfield”
- fieldLabel=”Email Address”
- name=”./email”
- required=”{Boolean}true”
+ bio
- sling:resourceType=”granite/ui/components/coral/foundation/form/textarea”
- fieldLabel=”Short Bio”
- name=”./bio”
https://developer.adobe.com/experience-manager/reference-materials/6-5/granite-ui/api/jcr_root/libs/granite/ui/components/coral/foundation/form/multifield/index.html
Multifield component allows to add/reorder/remove multiple instances of a field.
