Component Styles not working. Component wrapping div DOM gets regenerated.

[rss43181551]

Hi Community members,

I am noticing a weird behavior with the Component Styles functionality of Text component. Not sure if this is an issue with component-styles functionality or an issue with the Text component itself. BTW i am using AEM 6.1 SP1. The text component I am using is [wcm/foundation/components/text].

1. Add component styles under etc/designs to make component styles available in the text component. See below:

2. Edit the component style and SAVE.

Now there few issues here. 

    a. The component style does not get applied right away. If I see the DOM of the text wrapper div, the new style css class isnt there.

    b. Go to CRXDE Lite and check, the cq:cssClass property changed has been registered. 

3. Refresh the page. Now the wrapping div will have the class as desired as you edited and saved in step 2.

4. Now again make some change and save. Any change. Change text. Change alignment. Underline. etc etc. OR DONT EVEN MAKE ANY CHANGE. Just press the X button in the inline editing mode. CLOSE or SAVE, the wrapping div gets re-generated and my component style class gets removed.

After applying style and refreshing page:-

Perform step 4 above...like any change or no change, just press X button:

Notice in above screenshot. My class "text-regular-red" vanishes and "text" and "section" classes are added alongside the already existing "text" and "parbase" classes.

Can someone suggest how to get this to

a) APPLY changes INSTANTLY without the need to refresh page.

b) HOW TO RETAIN the component style class, when any further changes are made to the component. How to avoid that re-generation of wrapper div?

This should be easy to re-produce in your instances, but if required I can share the whole sample project which i created to share screenshots.

Thanks....

[MC_Stuff · Accepted solution]

Hi,

The first issue of appearing after restart can be solved by auto reloading. Refer to http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manage...

The second sounds like an bug to me. Istall the latest CFP & still issue. Please engage with official support team.

Thanks,

[rss43181551]

Page refresh is not acceptable to the client. They want it to work like any other sightly component. Any change in any property(.text,.cq:cssClass etc) should reflect instantly without the need to refresh.