Select a Select element using contains in Cypress

Question

I have the following code from which i have to select 'Role 1' The problem I have is that the addition '+4' is changing or even not present. The cypress code i use is but it doesnt work because it's completely similar to the text in the dropdown:

cy.get('[ng-model="ctrl.userModel.selectedJobTitle"]').select('Role 1')

Does anyone has a clue how to select an select element using contains()

<select ng-model="ctrl.userModel.selectedJobTitle">
<option label="Role 1  +4" value="object:401">Role 1  +4</option>
<option label="Role 2 (Standaard) +2" value="object:402" selected="selected">Role 2 (Standaard) +2</option>
<option label="Role 3 +3" value="object:403">Role 3 +3</option>
<option label="Role 4 " value="object:404">Role 4 </option>
<option label="Role 5 " value="object:405">Role 5 </option></select>

Answer 1

You can select based on value :

cy.get('[ng-model="ctrl.userModel.selectedJobTitle"]').select('object:401');

If the value changes as well, I'd try selecting by a part of the text that doesn't change:

cy.get('[ng-model="ctrl.userModel.selectedJobTitle"]')
  .find('option')
  .contains('Role 1')
  .as('selectOption')
  .then(() => {
    cy.get('[ng-model="ctrl.userModel.selectedJobTitle"]')
      .select(`${this.selectOption.text()}`);
  });

Answer 2

@pavelsaman you're right, the complete function looks like this:

selectRoleNotStandard: (role) => {
        UserObject.userMenuButton().click();
            
        UserObject.jobTitleDropdown()
            .find('option')
            .contains(role)
            .as('selectOption').then (() => {
UserObject.jobTitleDropdown().select(`${this.$selectOption.text()}`)
            });
            UserObject.userMenuButton().click();
        }

It doesn't seem to recognize the alias 'selectOption'