title: Access inline style of an element in Angular unit test
body: <p>In have an Angular component that renders a span like this:</p>
  
  <pre><code>&lt;span class="buy" [style.width.%]="percent"&gt;&lt;/span&gt;
  </code></pre>
  
  <p>In my unit test, I want to check if the inline style has the right percentage number. For example, if the component renders as follows, I want to test if the percentage is 50%:</p>
  
  <pre><code>&lt;span class="buy" style="width: 50%;"&gt;&lt;/span&gt;
  </code></pre>
  
  <p>Currently this is the best I could do:</p>
  
  <pre><code>const debugElm = fixture.debugElement;
  const htmlElm = debugElm.nativeElement;
  const buyBar = htmlElm.querySelector('.buy');
  expect(buyBar.getAttribute('style')).toEqual('width: 0%;');
  </code></pre>
  
  <p>I don't like testing the value of the <code>style</code> attribute to equal the string <code>width: 0%;</code>. Is there a better way to access the width property of the inline style?</p>