When editing pages in Adobe Experience Manager (AEM), several modes are available, including Developer mode. This opens a side panel with several tabs that provide a developer with information about the current page. The three tabs are:
These help a developer to:
Developer mode:
Is only available in the touch-enabled UI (when editing pages).
Is not available on mobile devices or small windows on desktop (due to space restrictions).
Is only available to users who are members of the administrators
group.
Developer mode is only available on a standard author instance that is not using the nosamplecontent run-mode.
If necessary, it can be configured for use:
It should be disabled again after use.
See the:
Developer mode is implemented as a side panel to the page editor. To open the panel, select Developer from the mode selector in the toolbar of the page editor:
The panel is divided into two tabs:
Components - This shows a component tree, similar to the content tree for authors
Errors - When problems occur, details are shown for each component.
This shows a component tree that:
Outlines the chain of components and templates rendered on the page (SLY, JSP, and so on). The tree can be expanded to show context within the hierarchy.
Shows the server-side computational time to render the component.
Lets you expand the tree and select specific components within the tree. Selection provides access to component details; such as:
Selected components (in the content flow, indicated by a blue border) will be highlighted in the content tree (and conversely).
This can help to:
Each component entry can show (for example):
View Details: a link to a list that shows:
Edit Script: a link that:
Expanding a component entry (arrow head) can also show:
Some links point to scripts under /libs
. However, these are for reference only, you must not edit anything under /libs
, as any changes you do make may be lost. This is because this branch is liable to changes whenever you upgrade or apply a hotfix or feature pack. Make any changes that you require under /apps
. See Overlays and Overrides.
Hopefully the Errors tab will always be empty (as above), but when problems occur the following details are shown for each component:
For example, in a situation where an undefined method is called, the resulting error is shown in the Errors tab:
The component entry in the tree of the Components tab will also be marked with an indicator when an error occurs.
In AEM 6.2, the testing features of Developer mode were reimplemented as a standalone Tools application.
For full details, see Testing Your UI.