MatSidenav with position="end" is in the wrong tab order

[bsteffl]

Bug, feature request, or proposal:

Sidenav doesn't seem to meet https://www.w3.org/WAI/WCAG21/Understanding/meaningful-sequence.html and https://www.w3.org/WAI/WCAG21/Understanding/focus-order.html. Visual order should generally match DOM order and tab sequence.

What is the expected behavior?

Being able to position sidenav either before or after the main content.

What is the current behavior?

Sidenav always appears first in DOM and tab order even if positioned after the content.

Looking at this example you will notice that as you tab from the url to the page it goes from the right panel (Link2) to the main content (Link1), rather than the other way around.

What are the steps to reproduce?

Providing a StackBlitz reproduction is the best way to share your issue.

StackBlitz starter: https://goo.gl/wwnhMV

https://stackblitz.com/edit/angular-xww88d

What is the use-case or motivation for changing an existing behavior?

To meet WCAG 2.1 requirements

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Material 7.3.1

Is there anything else we should know?

Would be nice if this allowed users the option to control order in the DOM. It may need to change depending on the sidenav mode (over, push, side).

[nehaabrol87]

Thanks @crisbeto !
I will watch this issue and the PR.
I did not know that this had already been opened.
This will be a create add on for
#18100

[qwad1000]

This also seems to be relevant issue #11992