It seems problematic to allow arbitary non-lowercase attribute on HTML nodes. Because the server has no ability to keep them case sensitive (HTML isn't). So they will end up different on the client.

We should probably warn if the attribute is not a known one *and* is not lowercase.
itRenders(
        'unknown attributes for custom elements using is',
        async render => {
          const e = await render(<div is="custom-element" foo="bar" />);
          expect(e.getAttribute('foo')).toBe('bar');
        },
      );
      itRenders(
        'no unknown attributes for custom elements using is with null value',
        async render => {
          const e = await render(<div is="custom-element" foo={null} />);
          expect(e.hasAttribute('foo')).toBe(false);
        },
      );
      itRenders('SVG tags with dashes in them', async render => {
        const e = await render(<svg><font-face accentHeight={10} /></svg>);
        expect(e.firstChild.hasAttribute('accentHeight')).toBe(false);
        expect(e.firstChild.getAttribute('accent-height')).toBe('10');
      });
      itRenders('cased custom attributes', async render => {
        const e = await render(<div fooBar="test" />);
        expect(e.getAttribute('fooBar')).toBe('test');
      });
    });
    itRenders('no HTML events', async render => {
      const e = await render(<div onClick={() => {}} />);
      expect(e.getAttribute('onClick')).toBe(null);
      expect(e.getAttribute('onClick')).toBe(null);
      expect(e.getAttribute('click')).toBe(null);
    });