Camel Case HTML attributes are rewritten to lowercase by AEM

Last updated on 27 Des 2022

Issue

Whenever a component in AEM outputs an HTML tag with an attribute that has capital letters, it is converted to lowercase. This affects the ability to use Angular 2 framework.

Environment

AEM 6.0, 6.1, 6.2

Cause

Capital letters are not recommended by the HTML specification. However, Angular 2 framework choose to use camel cased attributes. AEM product rewrites attributes to lowercase by design.

Resolution

In AEM6.3, this issue has been resolved. A new feature was added to allow disabling the rewriting of attributes to lowercase. These new configurations are documented here.

Steps to apply the configuration:

Go to http://aem-host:port/system/console/configMgr and log in as admin.
Search for CQ Rewriter HTML Parser Factory and click the pencil icon to the right to edit it.
Enable Preserve Camel Case.
Save.