"More than one element found for locator" warning
Do not underestimate xpath. You can solve thousands of problems with it, including this one
let elem = element(by.xpath('(//div//a)[3]'))
You can specify the number of element to use. Keep in mind the numbers start from 1, not 0 as usually in js
Less code:
$$("ul.nav button").first()
The warning is there for a reason. You've tied your tests too closely to your data. The selector is too general & you should be more specific. Either by saying element(by.css("ul.nav button:nth-child(1)"))
or scoping your search differently. Protractor tests aren't supposed to be testing style or dom, they're supposed to be testing business logic.
Try this instead:
element.all(by.css("ul.nav button")).first()
Basically, this tells Protractor that you already know there's more than one element, and you just want the first one (like you said in your question).