See the original report in https://github.com/facebook/react/issues/10772#issuecomment-333242375.

The problem is that SVG is case sensitive, and so naïvely setting `tabIndex` and relying on insensitivity won't work with it.

The good news is it seems like `tabindex` is the only valid [SVG attribute](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute) with this problem. We just missed it because it applies both to HTML and SVG.

I think the fix is to add it back to the whitelist. 
render() {
            return <div ref="foo" />;
          }
        }
        const e = await render(<RefComponent />);
        expect(e.getAttribute('ref')).toBe(null);
      });
      itRenders('no children attribute', async render => {
        const e = await render(React.createElement('div', {}, 'foo'));
        expect(e.getAttribute('children')).toBe(null);
      });
      itRenders('no key attribute', async render => {
        const e = await render(<div key="foo" />);
        expect(e.getAttribute('key')).toBe(null);
      });
      itRenders('no dangerouslySetInnerHTML attribute', async render => {
        const e = await render(
          <div dangerouslySetInnerHTML={{__html: '<foo />'}} />,
        );
        expect(e.getAttribute('dangerouslySetInnerHTML')).toBe(null);
      });
    });
    describe('inline styles', function() {
      itRenders('simple styles', async render => {
        const e = await render(<div style={{color: 'red', width: '30px'}} />);
        expect(e.style.color).toBe('red');
        expect(e.style.width).toBe('30px');
      });