Hi again. So have still not been able to figure out how to resolve, but have the following observations in mixins and components.
*Mixins:* Seems to work fine and work correctly by adding a css classname. I have several mixins that contribute css. *Component:* Still replaces the classname. Components have a template so that could be there's a namespace difference or a behaviour I've missed.. *Example:* In this case what I'm trying to do is to make a component around bootstrap tabs. http://getbootstrap.com/javascript/#tabs <div id="choose" class="tab-pane"> is rendered <div class="active" id="choose"> (missing tab-pane) Planned to optimize the markup/code and add ajax loading of tab content, but want to make this work first. Any ideas to what I could be doing wrong? thanks in advance Magnus *Tabs.tml* <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <t:container xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd" xmlns:p="tapestry:parameter"> <div id="${ClientId}" class="tabsContainer"> <ul class="nav nav-tabs"> <t:body /> </ul> <div class="tab-content"> <t:delegate to="tabContent" /> </div> </div> </t:container> *Tabs.java (snip)* @AfterRenderTemplate void handleActive(MarkupWriter writer) { Element e = writer.getElement(); Element thisEl = e.getElementById(getClientId()); Element activeLi = null; String contentId = show; //get first if(show==null) { activeLi = thisEl.find("ul/li"); } else { Element a = thisEl.getElementByAttributeValue("href", "#"+show); if(a!=null) { activeLi = a.getContainer(); } } if(activeLi!=null) { activeLi.attribute("class", "active"); if(contentId==null && activeLi.find("a")!=null) { contentId = activeLi.find("a").getAttribute("href"); } } if(contentId!=null) { if(contentId.startsWith("#")) contentId = contentId.substring(1); Element cnt = thisEl.getElementById(contentId); if(cnt!=null) { cnt.attribute("class", "active"); } } } *Usage:* <ul t:type="tabs" t:show="literal:choose"> <li><a href="#choose" data-toggle="tab">${message:image.choose}</a></li> <li><a href="#upload" data-toggle="tab">${message:image.upload}</a></li> <p:tabContent> <div id="choose" class="tab-pane"> <div t:id="as3GalleryBundle"/> </div> <div id="upload" class="tab-pane"> <t:ui.pickimage t:id="imgPick2" t:enableH5="true" class="imgPick"/> </div> </p:tabContent> </ul> On Fri, Sep 27, 2013 at 11:19 AM, Bård Magnus Kvalheim <mag...@kvalheim.eu>wrote: > Hi guys. > > So I've might have come across a bug in 5.4.22 when trying to add a css > class to an element. > > The Element#addClassName is deprecated and delegate to Element#attribute > where attributes named "class" now gets special treatment. > > The problem I'm seeing is that Element#attribute overrides the class > attribute. > > In Element#updateAttribute there is a namespace test and looks like it's > failing as given namespace is null and attribute namespace is empty string. > [1] > > If I instead provide empty string as namespace in the Element#attribute > then the isClass test fails as the namespace is not null. [2] > > Can anyone confirm the issue - and should I open a JIRA? > > ---- > Element.class#updateAttribute > [1] if (cursor.matches(namespace, name)) > { > [2] boolean isClass = namespace == null && name.equals("class"); > > if (!(force || isClass)) > { > return; > } > > cheers > Magnus >