Problems with Protractor and sendingKeys

Question

So I am trying to use Protractor to test a non-angular application (using Mocha). I have this code:

var page = createAccountPage.create('/noname');

page.typeFirstNameInput('jane');
page.typeLastNameInput('doe');
page.typePasswordInput('password');
page.clickAgreedToTermsInput();
page.clickCreateAccountButton();

page.redirectToCreateProfilePage();

Note that the type*() are all pretty much the same:

createAccountPage.typeFirstNameInput = function(value) {
  $(selector).sendKeys(value);
};

This basically opens the browsers and should fill in the form fills and then clicks a button that redirect the page. The issue that I am running into is that it fills out all the form inputs except the first name. If I do this:

var page = createAccountPage.create('/noname');

page.typeFirstNameInput('jane');
page.typeFirstNameInput('jane');
page.typeLastNameInput('doe');
page.typePasswordInput('password');
page.clickAgreedToTermsInput();
page.clickCreateAccountButton();

page.redirectToCreateProfilePage();

Then it does fill out the first name however I get the error:

StaleElementReferenceError: Element is no longer attached to the DOM

The only reason I can see this happening is that the form is fill out correctly now and clicking the button redirects the pages and for whatever reason, the first page.typeFirstNameInput('jane'); is being executed last (which would also explain when when I have it there once, the first name is filled out).

Is there any reason why the first action page.typeFirstNameInput('jane'); would be executed last?