Is there any way to check an inherited CSS property in protractor?

Question

I am writing some protractor tests for an Angular app. After blurring an input field, a CSS file is reloaded in the application, and I'd like to test if that style has effectively being applied to the elements that uses classes from that CSS file.

I've seen I can read values that are effectively on the styles attribute.

If it is not possible, then is there any way to test some element is rendered correctly using protractor??

element.all(by.css('.input')).get(0).then(function(styleProperty){
  styleProperty.clear();
  styleProperty.sendKeys('10px', protractor.Key.TAB);
  element(by.css('.element')).getCssValue('border').then(function (borderCssValue) {
    expect(borderCssValue).toBe('10px');
  });

Message:
     Expected '' to be '10px'.

Answer 1

border is not a valid css value, since it expands to border-top, border-left, etc. Try

element(by.css('.element')).getCssValue('border-top').then(...)