Protractor sendKeys to Modal return element not visible

I have an odd issue in protractor.

All I need to do is test form thats in a modal. I can confirm that the modal is open, but then I want to sendKeys to the input(s).

  element(by.id('modal')).click().then(function () {

    var modal = $('.modal');

    browser.wait(EC.visibilityOf(modal), 5000);

    expect(modal.isDisplayed()).toBeTruthy(); 

    element(by.model('userInput.firstName')).sendKeys('HELLO'); // <- this fails

  })

This test will fail with ElementNotVisibleError. But when I set the modal to auto open once the page is hit (rather than via a button click), I make sure the modal is displayed and send the keys. This passes fine.

Any advice is appreciated.