Please provide either a JSFiddle, Plunkr example that replicates the issue
sorry don't have one, but the description should be clear
Please describe the issue
When using "trapfocus" property and the dialog manages the focus by itself, an inline SVG element would break the focus order.
What did you expect to happen?
inline SVG element is "integrated" in the focus order and we can jump to the next focusable element by pressing 'TAB'.
What actually happened?
When the SVG element is focused and the user hits TAB the focus jumps back to the very first focusable element in the dialog, instead of the next one.
The reason is when the dialog tries to get the focusable elements it ignores every invisible element by checking offsetHeight and offsetWidth. However those properties have been deprecated for SVGElement which means it always considers an inline SVG element invisible even if that's actually visible (see here). As a result it gets confused, thinks nothing is actually focused and jumps back to the first focusable element inside the dialog.
What version of ng-dialog are you using? 0.6.6
What version of AngularJS are you using? 1.5.9
What browsers are affected? every browser
Please provide either a JSFiddle, Plunkr example that replicates the issue sorry don't have one, but the description should be clear
Please describe the issue When using "trapfocus" property and the dialog manages the focus by itself, an inline SVG element would break the focus order.
What did you expect to happen? inline SVG element is "integrated" in the focus order and we can jump to the next focusable element by pressing 'TAB'.
What actually happened? When the SVG element is focused and the user hits TAB the focus jumps back to the very first focusable element in the dialog, instead of the next one.
The reason is when the dialog tries to get the focusable elements it ignores every invisible element by checking offsetHeight and offsetWidth. However those properties have been deprecated for SVGElement which means it always considers an inline SVG element invisible even if that's actually visible (see here). As a result it gets confused, thinks nothing is actually focused and jumps back to the first focusable element inside the dialog.