Команда .click () в Cypress не выполняет свою функцию

Question

Я впервые использую Cyrpress, и я пытаюсь запустить тест для моего приложения React. Тест проводится после того, как имя введено в модальном режиме, будет нажата кнопка отправки, и вы попадете на главную страницу. Тем не менее, функция .click не работает, по крайней мере, я думаю, что это не так, поскольку модал все еще там с именем на нем. Может кто-нибудь сказать мне, что я делаю неправильно и как это исправить?

Вот как я написал тест:

   **fourth.spec.js**
        describe ('UI tests', () => {
            it('should navgitate to landing page after submitting with button', () =>{
                const text = "Christian"
                cy.visit('/')
                cy.get('.new').type (text).should ('have.value', text)
                .click()
            })
        })

Вот так у меня есть настройка кнопок для моего модального

 <div className="my-modal">
         <h1>Welcome!</h1>
            <p>Please enter your name</p>
               <form>  
                 <input 
                     autoFocus
                     className="new task"
                     placeholder="Name"
                     type="text" 
                     name="firstName" 
                     onChange={this.inputChange}>
                 </input>
               </form>
               <button  
                  className="modal-btn"
                  type="button" 
                   disabled={!this.state.firstName} 
                   onClick={this.displayNameHandler}>
                   Submit
               </button>
    </div>

Answer 1

Похоже, вы нажимаете на поле ввода, а не на кнопку. Попробуйте:

cy.get('.modal-btn').click()

Answer 2

Вы также можете попробовать нажать кнопку «Отправить» на основе кнопки text

cy.get('button[type="button"]').contains("Submit").click();