Camel Case HTML attributes are rewritten to lowercase by AEM

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:

  1. Go to http://aem-host:port/system/console/configMgr and log in as admin.

  2. Search for CQ Rewriter HTML Parser Factory and click the pencil icon to the right to edit it.

  3. Enable Preserve Camel Case.

  4. Save.