Get the width of the custom item created with the <polymer element> in the dart?

Question

How to get custom element width from script element?

<polymer-element name="his-elem">
  <div>
    blah
  </div>
</polymer-element>

@CustomTag('his-elem')
class blah extends PolymerElement {

  @override
  void attached() {
    // how do I get the <his-elem> width (just width, no padding border stuff) here?
    // document.querySelector('his-elem').getComputedStyle().width gives me "auto"...
  }

}

Update

Add :host {display: block;}to your element, then you can get the actual width with <his-elem>.clientWidth.

Answer 1

I use this when other methods do not work:

this.getBoundingClientRect().width

See also https://developer.mozilla.org/en-US/docs/Web/API/Element.getBoundingClientRect

** In polymer = 0.16

you need to call super.attached()earlier

  @override
  void attached() {
    super.attached();
    print(this.getBoundingClientRect().width);
    // or 
    print(this.getComputedStyle().width);
  }

super.attached() DOM . attached super.attached() , .

Answer 2

html. this.style.width.