Skip to content

Commit 235f664

Browse files
crisbetotinayuangao
authored andcommitted
fix(progress-spinner): prevent users from tabbing into underlying SVG on IE (#6142)
Since IE makes SVGs focusable by default, we need to disable it manually in order to prevent users from tabbing into it accidentally. Relates to #6125.
1 parent f5dc120 commit 235f664

File tree

2 files changed

+12
-2
lines changed

2 files changed

+12
-2
lines changed
Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
<!--
22
preserveAspectRatio of xMidYMid meet as the center of the viewport is the circle's
33
center. The center of the circle will remain at the center of the md-progress-spinner
4-
element containing the SVG.
4+
element containing the SVG. `focusable="false"` prevents IE from allowing the user to
5+
tab into the SVG element.
56
-->
67
<svg viewBox="0 0 100 100"
7-
preserveAspectRatio="xMidYMid meet">
8+
preserveAspectRatio="xMidYMid meet"
9+
focusable="false">
810
<path #path [style.strokeWidth]="strokeWidth"></path>
911
</svg>

src/lib/progress-spinner/progress-spinner.spec.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -178,6 +178,14 @@ describe('MdProgressSpinner', () => {
178178
.toBe(oldDimesions, 'Expected circle dimensions to have changed.');
179179
});
180180

181+
it('should remove the underlying SVG element from the tab order explicitly', () => {
182+
const fixture = TestBed.createComponent(BasicProgressSpinner);
183+
184+
fixture.detectChanges();
185+
186+
expect(fixture.nativeElement.querySelector('svg').getAttribute('focusable')).toBe('false');
187+
});
188+
181189
});
182190

183191

0 commit comments

Comments
 (0)