How do I assert an element is focused?

Question

I am attempting to verify that the focused element is set on page load as one of my tests.

This seems to be working, and I can verify with the element explorer, but

Answer 1

I managed to find a way to compare an element with the focused one without relaying to any attributes:

element(by.css('div.my-class')).equals(browser.driver.switchTo().activeElement())
    .then(equals => expect(equals).toBe(true));

Answer 2

I think I found a workaround:

Since expect expects to be called with a promise, you can compare some attribute of the two webElements (your input and the currently activeElement) :

it('should focus on the username field on load', function () {
     loginPage.get();
     expect(loginPage.usernameInput.getAttribute('id')).toEqual(browser.driver.switchTo().activeElement().getAttribute('id'));
});

Answer 3

I ended up using this nice simple function to assert focus.

var expectToBeFocused = function(element){
  return expect(element.getInnerHtml()).
    toBe(browser.driver.switchTo().activeElement().getInnerHtml());
};