Remove Default br tag in RichText

Question

When I set the 'removeSingleParagraphContainer' property to true, the RichText editor inserts a <br> tag even if there is no text.  Is there a way to stop this?

Answer 1

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:TabPanel"
    activeTab="0"
    helpPath="en/cq/current/wcm/default_components.html#Text Image"
    xtype="tabpanel">
    <items jcr:primaryType="cq:WidgetCollection">
        <tab2
            jcr:primaryType="cq:Widget"
            cropParameter="./imageCrop"
            ddGroups="[media]"
            fileNameParameter="./fileName"
            fileReferenceParameter="./fileReference"
            mapParameter="./imageMap"
            name="./file"
            requestSuffix=".img.png"
            rotateParameter="./imageRotate"
            sizeLimit="100"
            title="Image"
            uploadUrl="/tmp/upload/*"
            xtype="smarterimage"/>
       <tab3
            jcr:primaryType="cq:Widget"
            prefix="."
            title="Advanced Image Properties"
            xtype="ImageProperties"/>
        <tab4
            jcr:primaryType="cq:Widget"
            xtype="configcomponentstyles"/>
    </items>
</jcr:root>
The portion that actually declares the RichText fields is in a separate js file here:
CN.Author.widgets.ImageProperties = CQ.Ext.extend(CQ.Ext.Panel, {
    prefix             : './image',
    renditionOptions   : [],
    rendition          : null,
    selectedRendition  : null,
    componentPath      : null,
    ORIGINAL           : "[0:0]",
    USE_SIZE           : "[-1:-1]",
    constructor: function(config) {
        this.CN   = this.CN || {};
        config    = config || {};
        CN.Author.widgets.ImageProperties.superclass.constructor.call(this, config);
    initComponent: function() {
        var
            me = this,
            dialog,
            tabPanel,
             * Populates the panel's form fields.
             * @param {Object} data An object containing metadata
             * @private
            populate = function(data) {
                var
                    fieldPanel = this.getComponent('imageProperties_panel');
                fieldPanel.getComponent('imageProperties_title').setValue(data['dc:title']);
                fieldPanel.getComponent('imageProperties_alt').setValue(data['dc:title']);
                fieldPanel.getComponent('imageProperties_credit').setValue(data['dc:title']);
                fieldPanel.getComponent('imageProperties_desc').setValue(data['dc:description']);
             * Checkbox handler, which is called with every check.
             * @param {CQ.Ext.form.Checkbox} checkbox The checkbox that has been checked/unchecked
             * @param {Boolean} isChecked True if checked
             * @private
            checkHandler = function(checkbox, isChecked) {
                if (isChecked) {
                    populate.call(this, this.CN.imageMetaData);
            damBox = new CQ.Ext.form.Checkbox({
                disabled       : true,
                fieldLabel     : 'Use DAM Meta'
            saveRendition = new CQ.form.Selection({
                fieldLabel     : 'Save this new rendition',
                name           : './saveRendition',
                type           : "checkbox"
            rendition = new CQ.form.Selection({
                name           : './rendition',
                fieldLabel     : "Rendition:",
                type           : "select",
                listeners      : {
                    selectionchanged     : function() {
                        var
                            newValue  = this.getValue(),
                            sizeField = me.fieldPanel.get('imageProperties_size');
                        if (newValue === me.ORIGINAL) {
                             sizeField.reset();
                             sizeField.setDisabled(true);
                        else if (newValue === me.USE_SIZE) {
                            sizeField.setDisabled(false);
                            sizeField.reset();
                        else {
                            sizeField.reset();
                            sizeField.setDisabled(true);
                    loadContent         : function(field,record,path){
                        me.selectedRendition = record.data.rendition;
            fieldPanel   = new CQ.Ext.Panel({
                frame        : false,
                border       : false,
                layout       : 'form',
                autoScroll   : true,
                autoHeight   : true,
                itemId       : 'imageProperties_panel',
                cls          : 'imagePropertiesPanel',
                items        : [
                        itemId                            : 'imageProperties_title',
                        name                                  : this.prefix + '/jcr:title',
                        xtype                             : 'textfield',
                        fieldLabel                        : 'Title',
                        width                             : '95%'
                        itemId                            : 'imageProperties_alt',
                        name                              : this.prefix + '/alt',
                        xtype                             : 'textfield',
                        fieldLabel                        : 'Alt Text',
                        width                             : '95%'
                        itemId                            : 'imageProperties_link',
                        name                              : this.prefix + '/linkURL',
                        xtype                             : 'pathfield',
                        fieldLabel                        : 'Link to',
                        parBrowse                         : true,
                        width                             : '95%'
                        itemId                            : 'imageProperties_credit',
                        name                              : this.prefix + '/photoCredit',
                        xtype                             : 'richtext',
                        fieldLabel                        : 'Photo Credit',
                        width                             : '95%',
                        height                            : 100,
                        removeSingleParagraphContainer     : true,
                        singleParagraphContainerReplacement: 'div',
                        rtePlugins                        : {
                            misctools: {
                                features: ['specialchars', 'sourceedit'],
                                specialCharsConfig: {
                                    chars: {
                                        "copyright": {
                                            "entity": "&copy;"
                                        "degree": {
                                            "entity": "&deg;"
                                        "elipses": {
                                            "entity": "&#133;"
                                        "latin": {
                                            "rangeEnd": "255",
                                            "rangeStart": "192"
                                        "leftanglequote": {
                                            "entity": "&laquo;"
                                        "misc": {
                                            "rangeEnd": "152",
                                            "rangeStart": "145"
                                        "morefractions": {
                                            "rangeEnd": "8543",
                                            "rangeStart": "8531"
                                        "percentage": {
                                            "rangeEnd": "47",
                                            "rangeStart": "32"
                                        "register": {
                                            "entity": "&reg;"
                                        "rightpointquote": {
                                            "entity": "&raquo;"
                                        "trademark": {
                                            "entity": "&#153;"
                                        "vulgarfractions": {
                                            "rangeEnd": "190",
                                            "rangeStart": "188"
                        itemId                            : 'imageProperties_desc',
                        name                              : this.prefix + '/jcr:description',
                        xtype                             : 'richtext',
                        fieldLabel                        : 'Caption',
                        width                             : '95%',
                        height                            : 100,
                        removeSingleParagraphContainer     : true,
                        rtePlugins                        : {
                            misctools: {
                                features: ['specialchars', 'sourceedit'],
                                specialCharsConfig: {
                                    chars: {
                                        "copyright": {
                                            "entity": "&copy;"
                                        "degree": {
                                            "entity": "&deg;"
                                        "elipses": {
                                            "entity": "&#133;"
                                        "latin": {
                                            "rangeEnd": "255",
                                            "rangeStart": "192"
                                        "leftanglequote": {
                                            "entity": "&laquo;"
                                        "misc": {
                                            "rangeEnd": "152",
                                            "rangeStart": "145"
                                        "morefractions": {
                                            "rangeEnd": "8543",
                                            "rangeStart": "8531"
                                        "percentage": {
                                            "rangeEnd": "47",
                                            "rangeStart": "32"
                                        "register": {
                                            "entity": "&reg;"
                                        "rightpointquote": {
                                            "entity": "&raquo;"
                                        "trademark": {
                                            "entity": "&#153;"
                                        "vulgarfractions": {
                                            "rangeEnd": "190",
                                            "rangeStart": "188"
                        itemId            : 'imageProperties_size',
                        widthParameter    : this.prefix + '/width',
                        heightParameter   : this.prefix + '/height',
                        xtype             : 'sizefield',
                        fieldLabel        : 'Size',
                        disabled          : true
                    damBox,
                    rendition,
                    saveRendition
        CN.Author.widgets.ImageProperties.superclass.initComponent.call(this);
        this.rendition     = rendition;
        this.fieldPanel    = fieldPanel;
        this.add(fieldPanel);
        this.CN.damBox     = damBox;
        this.CN.damBox.on('check', checkHandler, this);
        dialog             = this.findParentByType("dialog");
        tabPanel           = this.ownerCt;
        if (dialog) {
            dialog.on("loadcontent", function() {
                 this.onLoadContent(dialog.path);
            }, this);
        if(tabPanel) {
            tabPanel.on("tabchange",function(tabPanel, tab) {
                if(tab.xtype === 'ImageProperties') {
                     this.onActivate(tab);
            }, this);
     * Overrides CQ.Ext.Panel.onRender.  Find the smarterimage component and register a callback onto
     * the CN.customEvents.DAM.response event.
    onRender: function (ct, pos) {
        var
            ownerCt          = this.ownerCt,
            items            = null,
            imgCmpt          = null,
            i                = 0,
            len              = 0;
        if (typeof ownerCt !== "undefined") {
            items = ownerCt.items.items;
            len   = items.length;
            for (i = 0; i < len; i++) {
                imgCmpt = (imgCmpt === null) ? ((items[i].xtype === "smarterimage") ? items[i] : null) : imgCmpt;
            if (imgCmpt !== null) {
                // Let's know about all the images loading on the smarterimage widget
                imgCmpt.on('CN.customEvents.DAM.response', this.onDamResponse, this);
        CN.Author.widgets.ImageProperties.superclass.onRender.call(this, ct, pos);
    onLoadContent: function(path) {
        this.componentPath = path;
    onActivate: function(tab) {
        var
            sizes,
            rendition,
            option;
        if (this.renditionOptions.length === 0) {
            sizes = CN.Author.Util.getConfiguration("dam/sizes");
            this.renditionOptions.push({'text':'-Use size field-','value':this.USE_SIZE});
            this.renditionOptions.push({'text':'Original Size','value':this.ORIGINAL});
            for(rendition in sizes) {
                if(sizes.hasOwnProperty(rendition)){
                    option = {};
                    if(!rendition.match(/jcr/g)) {
                        option['text']  = rendition;
                        option['value'] = sizes[rendition];
                        this.renditionOptions.push(option);
        if (this.renditionOptions.length > 0) {
            this.rendition.setOptions(this.renditionOptions);
            this.rendition.setValue(this.selectedRendition);
     * CN.customEvents.DAM.response handler.
     * @param {Object} metaData The metadata object from the HTTP response of smarterimage
     * @public
    onDamResponse: function(metaData) {
        this.CN.damBox.enable();
        this.CN.imageMetaData = metaData;
CQ.Ext.reg('ImageProperties', CN.Author.widgets.ImageProperties);