fix(progress-spinner): prevent users from tabbing into underlying SVG…

… on IE

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 angular#6125.

src/lib/progress-spinner/progress-spinner.html

@@ -1,9 +1,11 @@
 <!--
   preserveAspectRatio of xMidYMid meet as the center of the viewport is the circle's
   center. The center of the circle will remain at the center of the md-progress-spinner
-  element containing the SVG.
+  element containing the SVG. `focusable="false"` prevents IE from allowing the user to
+  tab into the SVG element.
 -->
 <svg viewBox="0 0 100 100"
-     preserveAspectRatio="xMidYMid meet">
+     preserveAspectRatio="xMidYMid meet"
+     focusable="false">
   <path #path [style.strokeWidth]="strokeWidth"></path>
 </svg>

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

@@ -178,6 +178,14 @@ describe('MdProgressSpinner', () => {
         .toBe(oldDimesions, 'Expected circle dimensions to have changed.');
   });
 
+  it('should remove the underlying SVG element from the tab order explicitly', () => {
+    const fixture = TestBed.createComponent(BasicProgressSpinner);
+
+    fixture.detectChanges();
+
+    expect(fixture.nativeElement.querySelector('svg').getAttribute('focusable')).toBe('false');
+  });
+
 });