3

I have a React application and the following error is output in the dev console in IE11:

Warning: The tag <main> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.

I believe this is due to the fact that the <main> element is not supported by Internet Explorer.

I don't see anything wrong with the application at first glance. It seems to render properly so this is more for my peace of mind, but is there any way to force IE to recognize the tag (maybe with an html5 shim or some other method) so that this console error goes away?

Matt K
  • 6,620
  • 3
  • 38
  • 60
  • Fair enough, but what would you consider I update? That is the reasoning for my first comment which was removed. I am showing the error output, I have done some research that explains I might know the reason for the error, but that is where my knowledge stops. I would absolutely love to update my question to make it better because I am here to learn... if only those who felt the need to downvote would explain why. – Matt K Mar 11 '19 at 17:07
  • I am not an expert on the subject, but I'd follow the usual guidelines of showing attempts at solving the problem. Are there any other references on using HTML tags not supported by IE? Can the `main` tag be avoided? Although apparently trivial, an example of a React script that reproduces the problem would help those who would want to answer. – E_net4 Mar 11 '19 at 17:47

1 Answers1

-2

Try to hook console.error and filter this message by putting this somewhere before react-anime is loaded:

const realError = console.error;
console.error = (...x) => {
  // debugger;
  if (x[0] === 'Warning: The tag <g> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.') {
    return;
  }
  realError(...x);
};

More details, please check this thread.

Zhi Lv
  • 18,845
  • 1
  • 19
  • 30
  • Not a fan of sweeping stuff under the rug. `main` is also a standard HTML5 tag and not specific to react-anime. – Matt K Mar 06 '19 at 15:59
  • Yes, I know main tag is a html5 standard tag, but on my side, if I just run a page with main tag, it will not show this warning. So, I think perhaps the issue is related to react – Zhi Lv Mar 07 '19 at 01:32
  • Yes, it is a React error message that is logged - not a browser error message. So there should be a React way to solve it. – Jaap May 09 '19 at 06:42