Accessibility improvement on #29530 issue

[Quintis1212]

Hello ) Just simple accessibility improvement to allow close nav panel of site editor on esc button. Issue - "Site Editor Navigation Panel - Allow 'esc' to close the panel. #29530"

[Addison-Stavlo]

Hi @Quintis1212, thanks so much for jumping on this issue!

[Addison-Stavlo]

This looks good and tests well for me.

Thanks for your help here @Quintis1212 !

[Addison-Stavlo]

I know you didn't add this here, and wont block the PR on it. But just noticing this import should fall under the "WordPress dependencies" group of imports above.

[Quintis1212]

@Addison-Stavlo thank you for help !) I updated the dependencies group )

[Addison-Stavlo]

Awesome, thanks!

[Addison-Stavlo]

Will merge this for you, but it looks like Static Analysis needs to pass first (rerunning it, will investigate more if there are any issues).

[Addison-Stavlo]

Im wondering why the static analysis keeps erroring on the lint command for this PR. I wonder if rebasing off the latest trunk might help.

[Quintis1212]

@Addison-Stavlo
There is an error :

[1] 55:3 error Static HTML elements with event handlers require a role jsx-a11y/no-static-element-interactions
This is a div tag which begins on 55 line
What role I can give this element ? role="main" ?

[Addison-Stavlo]

What role I can give this element ? role="main" ?

Oh, that is a good question. Im not sure what makes the most sense: Navigation, Index, ListBox, something else? cc @Copons @david-szabo97 re: the wrapper for the navigation panel component. I also wonder why this wasn't an issue with the list-view component (perhaps b/c it has 'aria-labelledby'? or do we need to add a role there as well?). 🤔

[Quintis1212]

@Addison-Stavlo here is all valid values for role attr - https://stackoverflow.com/questions/4170356/what-values-can-the-html5-xhtml-role-attribute-have

[Quintis1212]

@Addison-Stavlo , @Copons , @david-szabo97 new error :
[1] 55:3 error Non-interactive elements should not be assigned mouse or keyboard event listeners jsx-a11y/no-noninteractive-element-interactions
Who can help me with this error ?

[Quintis1212]

Maybe just add disable-lint comment at div tag ?

[Addison-Stavlo]

Maybe just add disable-lint comment at div tag ?

yeah I think a lint disable (and not adding a role) might make the most sense in this specific circumstance:

gutenberg/packages/edit-site/src/components/secondary-sidebar/list-view-sidebar.js

Line 56 in 5ae2b1b

// eslint-disable-next-line jsx-a11y/no-static-element-interactions

Apologies for not recommending that earlier, I should have noticed that 🤣 and realized that the role doesn't really make sense here.

[Quintis1212]

@Addison-Stavlo
React Native E2E Tests (iOS) / test (12.2, gutenberg-editor-gallery) (pull_request) :
`
● Test suite failed to run

TypeError: Cannot read property 'stopDriver' of undefined

  24 | 
  25 | 	async teardown() {
> 26 | 		await this.global.editorPage.stopDriver();
     | 		                             ^
  27 | 		await super.teardown();
  28 | 	}
  29 | }

`
How fix this error ?

[Addison-Stavlo]

How fix this error ?

I reran the test and it passed. Looking at some recent commits on master, it seems to have failed for a few of them in the same manner. It seems something is inconsistent with that test setup that we will need to look into elsewhere.

Anyways, this is working well and tests are passing. Thanks for all the work here!

[Quintis1212]

@Addison-Stavlo I am very happy ) thank you for help in this PR)