thanhlong203 / closure-library

Automatically exported from code.google.com/p/closure-library
0 stars 0 forks source link

Css3ButtonRenderer's createDom() should use getClassNames() like the other button renderers do #264

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago
What steps will reproduce the problem?

        var css3Button = new goog.ui.Button('foo',
            goog.ui.Css3ButtonRenderer.getInstance());
        css3Button.addClassName('foo-button');
        css3Button.render(document.body);

What is the expected output?

<div class="goog-inline-block goog-css3-button foo-button" title="" 
role="button" style="-webkit-user-select: none; " tabindex="0">foo</div>

What do you see instead?

<div class="goog-inline-block goog-css3-button" title="" role="button" 
style="-webkit-user-select: none; " tabindex="0">foo</div>

What version of the product are you using?

Latest rev. in SVN

Please provide any additional information below.

Patch & test are attached. Original e-mail to the discussion list 
(http://groups.google.com/group/closure-library-discuss/browse_thread/thread/154
3df576b0c73ea) are below.

**********************

Hello,

I've noticed that goog.ui.CustomButtonRenderer's createDom() uses the
classnames provided by getClassNames():

    /**
     * Returns the button's contents wrapped in the following DOM structure:
     *    <div class="goog-inline-block goog-custom-button">
     *      <div class="goog-inline-block goog-custom-button-outer-box">
     *        <div class="goog-inline-block goog-custom-button-inner-box">
     *          Contents...
     *        </div>
     *      </div>
     *    </div>
     * Overrides {@link goog.ui.ButtonRenderer#createDom}.
     * @param {goog.ui.Button} button Button to render.
     * @return {Element} Root element for the button.
     */
    goog.ui.CustomButtonRenderer.prototype.createDom = function(button) {
      var classNames = this.getClassNames(button);
      var attributes = {
        'class': goog.ui.INLINE_BLOCK_CLASSNAME + ' ' + classNames.join(' '),
        'title': button.getTooltip() || ''
      };
      return button.getDomHelper().createDom('div', attributes,
          this.createButton(button.getContent(), button.getDomHelper()));
    };

as do goog.ui.FlatButtonRenderer, goog.ui.LinkButtonRenderer, and
goog.ui.NativeButtonRenderer.

However, goog.ui.Css3ButtonRenderer does not:

    /**
     * Returns the button's contents wrapped in the following DOM structure:
     *    <div class="goog-inline-block goog-css3-button">
     *      Contents...
     *    </div>
     * Overrides {@link goog.ui.ButtonRenderer#createDom}.
     * @param {goog.ui.Button} button Button to render.
     * @return {Element} Root element for the button.
     */
    goog.ui.Css3ButtonRenderer.prototype.createDom = function(button) {
      var attr = {
        'class': goog.ui.INLINE_BLOCK_CLASSNAME + ' ' + this.getCssClass(),
        'title': button.getTooltip() || ''
      };
      return button.getDomHelper().createDom('div', attr, button.getContent());
    };

nor does goog.ui.ButtonRenderer itself.

Would anyone object to updating the Css3ButtonRenderer's createDom(), such
that it uses this.getClassNames(). I'm thinking something along the lines of:

    /**
     * Returns the button's contents wrapped in the following DOM structure:
     *    <div class="goog-inline-block goog-css3-button">
     *      Contents...
     *    </div>
     * Overrides {@link goog.ui.ButtonRenderer#createDom}.
     * @param {goog.ui.Button} button Button to render.
     * @return {Element} Root element for the button.
     */
    goog.ui.Css3ButtonRenderer.prototype.createDom = function(button) {
      var classNames = this.getClassNames(button);
      var attr = {
        'class': goog.ui.INLINE_BLOCK_CLASSNAME + ' ' + classNames.join(' '),
        'title': button.getTooltip() || ''
      };
      return button.getDomHelper().createDom('div', attr, button.getContent());
    };

Original issue reported on code.google.com by hblanks%...@gtempaccount.com on 25 Jan 2011 at 3:57

Attachments:

GoogleCodeExporter commented 8 years ago
This issue was approved in the codereview app at 
http://codereview.appspot.com/4035047/

Original comment by hbla...@monetate.com on 17 Aug 2011 at 9:12

GoogleCodeExporter commented 8 years ago
This issue was closed by revision r1235.

Original comment by pall...@google.com on 20 Aug 2011 at 10:17

GoogleCodeExporter commented 8 years ago
Issue 362 has been merged into this issue.

Original comment by pall...@google.com on 24 Aug 2011 at 7:10