[AEM as cloud] Page Properties dialog issue

Forum|Forum|3 years ago
March 11, 2022
1 reply
1132 views

Hi Team,

there is an issue I am facing when I have opened the page property dialog, and on click of the tabs under page property dialog, I can see the additional button appearing on my screen.

And the addition of the above buttons will continue on loop till we switch from one tab to another,

Seems the addition of button is happening because of Permission tab JS which is responsible to load: /libs/wcm/foundation/components/basicpage/v1/basicpage/cq:dialog/content/items/tabs/items/permissions

For reference:

we have created a page with slingResourceSuperType : core/cif/components/structure/page/v1/page

here is the HTML of those buttons

<coral-panel class="_coral-Panel is-selected" role="tabpanel" aria-hidden="false" id="coral-id-13" aria-labelledby="coral-id-5" selected="">
	<coral-actionbar-primary role="toolbar" class="_coral-ActionBar-primary">
		<coral-actionbar-primary role="toolbar" class="_coral-ActionBar-primary">
			<coral-actionbar-item class="_coral-ActionBar-item">
				<button class="betty-ActionBar-item js-cq-sites-PermissionsProperties-action js-cq-sites-AddPermissionsDialog-show hide foundation-collection-action coral-Button--graniteActionBar _coral-ActionBar-button _coral-ActionButton _coral-ActionButton--quiet" title="Create ACL Permissions" data-foundation-collection-action="{}" type="button" autocomplete="off" is="coral-button" icon="add" variant="quietaction" trackingfeature="" trackingelement="add permissions" tracking="ON" size="M">
					<coral-icon size="S" class="_coral-Icon _coral-Icon--sizeS" role="img" icon="add" aria-hidden="true">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-Add"></use>
						</svg>
					</coral-icon>
					<coral-button-label class="_coral-ActionButton-label">Add Permissions</coral-button-label>
				</button>
			</coral-actionbar-item>
			<coral-actionbar-item class="_coral-ActionBar-item">
				<button class="betty-ActionBar-item js-cq-sites-PermissionsProperties-action js-cq-sites-ClosedUserGroupDialog-show hide foundation-collection-action coral-Button--graniteActionBar _coral-ActionBar-button _coral-ActionButton _coral-ActionButton--quiet" title="Edit Closed User Group" data-foundation-collection-action="{}" type="button" autocomplete="off" is="coral-button" icon="usersLock" variant="quietaction" trackingfeature="" trackingelement="edit closed user group" tracking="ON" size="M">
					<coral-icon size="S" class="_coral-Icon _coral-Icon--sizeS" role="img" icon="usersLock" aria-hidden="true">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-UsersLock"></use>
						</svg>
					</coral-icon>
					<coral-button-label class="_coral-ActionButton-label">Edit Closed User Group</coral-button-label>
				</button>
			</coral-actionbar-item>
			<coral-actionbar-item class="_coral-ActionBar-item">
				<button class="betty-ActionBar-item js-cq-sites-PermissionsProperties-action js-cq-sites-EffectivePermissionsDialog-show hide foundation-collection-action coral-Button--graniteActionBar _coral-ActionBar-button _coral-ActionButton _coral-ActionButton--quiet" title="Effective Permissions" data-foundation-collection-action="{}" type="button" autocomplete="off" is="coral-button" icon="viewList" variant="quietaction" trackingfeature="" trackingelement="effective permissions" tracking="ON" size="M">
					<coral-icon size="S" class="_coral-Icon _coral-Icon--sizeS" role="img" icon="viewList" aria-hidden="true">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-ViewList"></use>
						</svg>
					</coral-icon>
					<coral-button-label class="_coral-ActionButton-label">Effective Permissions</coral-button-label>
				</button>
			</coral-actionbar-item>
			<coral-popover smart="" id="coral-id-470" handle="overlay" placement="bottom" breadthoffset="-50%r + 50%p" coral-actionbar-popover="" tabindex="0" role="presentation" x-placement="bottom" class="_coral-Overlay _coral-Popover" aria-live="assertive" variant="default" closable="off" style="position: absolute; display: none; visibility: visible; will-change: transform; top: 0px; left: 0px; transform: translate3d(24px, 93px, 0px);">
				<div handle="topTabCapture" coral-tabcapture="top" tabindex="0" role="presentation"></div>
				<div class=" _coral-Dialog-header" handle="headerWrapper" role="presentation" hidden="">
					<coral-popover-header class="_coral-Dialog-title"></coral-popover-header>
				</div>
				<button is="coral-button" tracking="off" handle="closeButton" class="_coral-Dialog-closeButton _coral-ClearButton" type="button" variant="_custom" icon="close" title="Close" tabindex="-1" coral-close="" size="M" style="display: none;">
					<coral-icon size="S" class="_coral-Icon--sizeS _coral-Icon" role="img" icon="close">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-Close"></use>
						</svg>
					</coral-icon>
					<coral-button-label></coral-button-label>
				</button>
				<div class=" _coral-Popover-tip" handle="tip" hidden=""></div>
				<coral-popover-content class="_coral-Dialog-content"></coral-popover-content>
				<coral-popover-footer class="_coral-Dialog-footer" hidden=""></coral-popover-footer>
				<div handle="intermediateTabCapture" coral-tabcapture="intermediate" tabindex="0" role="presentation"></div>
				<div handle="bottomTabCapture" coral-tabcapture="bottom" tabindex="0" role="presentation"></div>
			</coral-popover>
			<button is="coral-button" handle="moreButton" type="button" variant="quietaction" class="_coral-ActionButton _coral-ActionButton--quiet _coral-ActionBar-button" icon="more" coral-actionbar-more="" aria-expanded="false" aria-haspopup="true" size="M">
				<coral-icon size="S" class="_coral-Icon--sizeS _coral-Icon" role="img" icon="more">
					<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
						<use xlink:href="#spectrum-icon-18-More"></use>
					</svg>
				</coral-icon>
				<coral-button-label handle="moreButtonLabel" class="_coral-ActionButton-label"></coral-button-label>
			</button>
		</coral-actionbar-primary>
		<coral-actionbar-primary role="toolbar" class="_coral-ActionBar-primary">
			<coral-actionbar-item class="_coral-ActionBar-item">
				<button class="betty-ActionBar-item js-cq-sites-PermissionsProperties-action js-cq-sites-AddPermissionsDialog-show hide foundation-collection-action coral-Button--graniteActionBar _coral-ActionBar-button _coral-ActionButton _coral-ActionButton--quiet" title="Create ACL Permissions" data-foundation-collection-action="{}" type="button" autocomplete="off" is="coral-button" icon="add" variant="quietaction" trackingfeature="" trackingelement="add permissions" tracking="ON" size="M">
					<coral-icon size="S" class="_coral-Icon _coral-Icon--sizeS" role="img" icon="add" aria-hidden="true">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-Add"></use>
						</svg>
					</coral-icon>
					<coral-button-label class="_coral-ActionButton-label">Add Permissions</coral-button-label>
				</button>
			</coral-actionbar-item>
			<coral-actionbar-item class="_coral-ActionBar-item">
				<button class="betty-ActionBar-item js-cq-sites-PermissionsProperties-action js-cq-sites-ClosedUserGroupDialog-show hide foundation-collection-action coral-Button--graniteActionBar _coral-ActionBar-button _coral-ActionButton _coral-ActionButton--quiet" title="Edit Closed User Group" data-foundation-collection-action="{}" type="button" autocomplete="off" is="coral-button" icon="usersLock" variant="quietaction" trackingfeature="" trackingelement="edit closed user group" tracking="ON" size="M">
					<coral-icon size="S" class="_coral-Icon _coral-Icon--sizeS" role="img" icon="usersLock" aria-hidden="true">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-UsersLock"></use>
						</svg>
					</coral-icon>
					<coral-button-label class="_coral-ActionButton-label">Edit Closed User Group</coral-button-label>
				</button>
			</coral-actionbar-item>
			<coral-actionbar-item class="_coral-ActionBar-item">
				<button class="betty-ActionBar-item js-cq-sites-PermissionsProperties-action js-cq-sites-EffectivePermissionsDialog-show hide foundation-collection-action coral-Button--graniteActionBar _coral-ActionBar-button _coral-ActionButton _coral-ActionButton--quiet" title="Effective Permissions" data-foundation-collection-action="{}" type="button" autocomplete="off" is="coral-button" icon="viewList" variant="quietaction" trackingfeature="" trackingelement="effective permissions" tracking="ON" size="M">
					<coral-icon size="S" class="_coral-Icon _coral-Icon--sizeS" role="img" icon="viewList" aria-hidden="true">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-ViewList"></use>
						</svg>
					</coral-icon>
					<coral-button-label class="_coral-ActionButton-label">Effective Permissions</coral-button-label>
				</button>
			</coral-actionbar-item>
			<coral-popover smart="" id="coral-id-471" handle="overlay" placement="bottom" breadthoffset="-50%r + 50%p" coral-actionbar-popover="" tabindex="0" role="presentation" x-placement="bottom" class="_coral-Overlay _coral-Popover" aria-live="assertive" variant="default" closable="off" style="position: absolute; display: none; visibility: visible; will-change: transform; top: 0px; left: 0px; transform: translate3d(24px, 141px, 0px);">
				<div handle="topTabCapture" coral-tabcapture="top" tabindex="0" role="presentation"></div>
				<div class=" _coral-Dialog-header" handle="headerWrapper" role="presentation" hidden="">
					<coral-popover-header class="_coral-Dialog-title"></coral-popover-header>
				</div>
				<button is="coral-button" tracking="off" handle="closeButton" class="_coral-Dialog-closeButton _coral-ClearButton" type="button" variant="_custom" icon="close" title="Close" tabindex="-1" coral-close="" size="M" style="display: none;">
					<coral-icon size="S" class="_coral-Icon--sizeS _coral-Icon" role="img" icon="close">
						<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
							<use xlink:href="#spectrum-icon-18-Close"></use>
						</svg>
					</coral-icon>
					<coral-button-label></coral-button-label>
				</button>
				<div class=" _coral-Popover-tip" handle="tip" hidden=""></div>
				<coral-popover-content class="_coral-Dialog-content"></coral-popover-content>
				<coral-popover-footer class="_coral-Dialog-footer" hidden=""></coral-popover-footer>
				<div handle="intermediateTabCapture" coral-tabcapture="intermediate" tabindex="0" role="presentation"></div>
				<div handle="bottomTabCapture" coral-tabcapture="bottom" tabindex="0" role="presentation"></div>
			</coral-popover>
			<button is="coral-button" handle="moreButton" type="button" variant="quietaction" class="_coral-ActionButton _coral-ActionButton--quiet _coral-ActionBar-button" icon="more" coral-actionbar-more="" aria-expanded="false" aria-haspopup="true" size="M">
				<coral-icon size="S" class="_coral-Icon--sizeS _coral-Icon" role="img" icon="more">
					<svg focusable="false" aria-hidden="true" class="_coral-Icon--svg _coral-Icon">
						<use xlink:href="#spectrum-icon-18-More"></use>
					</svg>
				</coral-icon>
				<coral-button-label handle="moreButtonLabel" class="_coral-ActionButton-label"></coral-button-label>
			</button>
		</coral-actionbar-primary>
</coral-panel>

Did anyone face a similar issue?

or any suggestion how to debug.

@arunpatidar @kautuk_sahni @vijayalakshmi_s @briankasingli @theo_pendle

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by Vijayalakshmi_S

@tushaarsrivastava

In the screenshot of Page properties dialog, could see tabs in the name - Preview and Custom.

Looks like a customization on top of OOTB page properties dialog.

Suggest to check on the customizations done at dialog level as well as JS, if any related to the same.

Vijayalakshmi_SAccepted solution

Level 10

@tushaarsrivastava

In the screenshot of Page properties dialog, could see tabs in the name - Preview and Custom.

Looks like a customization on top of OOTB page properties dialog.

Suggest to check on the customizations done at dialog level as well as JS, if any related to the same.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded