Accessibility: make pressing the enter key, validate the admin key modal #280

[nooras]

Pull Request

Related issue

Fixes #280

What does this PR do?

• This PR have solved the issue of key enter on API KEY modal

PR checklist

Please check if your PR fulfills the following requirements:

• Does this PR fix an existing issue, or have you listed the changes applied in the PR description (and why they are needed)?
• Have you read the contributing guidelines?
• Have you made sure that the title is accurate and descriptive of the changes?

Screenshot:

On key enter, field will be validate

Thank you so much for contributing to Meilisearch!

[bidoubiwa]

Hey @nooras thanks a lot for this contribution!

Could you add a test in cypress/e2e/test-api-key-required.cy.js ?

Line 20 you rename the test from Should fail on wrong API key to Should fail on wrong API key triggered with mouse click

Then underneath it you create a new test called Should fail on wrong API key triggered with enter key

 it('Should fail on wrong API key triggered with enter key', () => {
    cy.get('div[aria-label=ask-for-api-key]').within(() => {
      cy.get('input[name="apiKey"]')
        .type(WRONG_APIKEY)
        .should('have.value', WRONG_APIKEY)
      cy.get('input[name="apiKey"]').type('{enter}')
      cy.wait(WAITING_TIME)
      cy.contains('The provided API key is invalid.')
    })
  })

[nooras]

Hi @bidoubiwa I added test. Kindly check and let me know if any changes are required. Thanks

[bidoubiwa]

Hey @nooras! This seems good to me :) Before merging it, I need the approval of @mdubus that will come back next week.
Meanwhile I put the hacktoberfest-accepted tag which should count as a contribution for digital ocean.

Thanks again for contributing with Meilisearch ❤️
If you are participating in Hacktoberfest, and you would like to receive a small gift from Meilisearch too, don't forget to fill this form.

[mdubus]

Hello @nooras ! 👋

Thanks a lot for your work here, this definitively helps a lot 🤩

A thank a lot @bidoubiwa for the review and the test suggestion while I wasn't available!

bors merge

[bors]

Build succeeded:

• cypress_meilisearch-api-key
• cypress_meilisearch-no-api-key
• cypress_no_meilisearch
• linter-check

[meili-bot]

This message is sent automatically

Thank you for contributing to Meilisearch. If you are participating in Hacktoberfest, and you would like to receive some gift from Meilisearch too, please complete this form.