React: `time` element is unrecognized - v16.0.0-alpha.13

[cusxio]

Do you want to request a feature or report a bug?

Bug?

What is the current behavior?

<time> tag is incorrectly reported as an invalid HTML element on Chrome Version 59.0.3071.115

https://caniuse.com/#search=time

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://jsfiddle.net or similar (template: https://jsfiddle.net/84v837e9/).

https://codesandbox.io/s/APYrw5JPO

What is the expected behavior?

Similar to React 15, <time> tag should be a valid HTML element.

Which versions of React, and which browser / OS are affected by this issue?

• react 16.0.0-alpha.13
• react-dom 16.0.0-alpha.13

• Version 59.0.3071.115 (Official Build) (64-bit)

  Did this work in previous versions of React?

React 15 did not report this error.

[syranide]

<time> is not a supported element in Chrome 59. That warning just notifies you that your browser simply doesn't support it (as it says), React doesn't do and can't do anything about that.

document.createElement('time').constructor === HTMLUnknownElement

[gaearon]

I don't think this is a React issue. Chrome doesn't (yet) support the time element: https://groups.google.com/a/chromium.org/forum/m/#!topic/blink-dev/e52E3t3ijHo

[syranide]

What you're linking to is "Date and time input types", it does not include the time-element.

[cusxio]

What you're linking to is "Date and time input types", it does not include the time-element.

Woops.

How about this ?

https://developer.mozilla.org/en/docs/Web/HTML/Element/time, it says Basic Support since Chrome 33.

[gaearon]

Seems like it's wrong. You can verify yourself in the browser. It becomes HTMLUnknownElement.

[syranide]

Are we looking at the same page?

[cusxio]

@syranide someone just changed it, wow the timing !

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time$history

Anyway, closing this issue. The warning is quite annoying though.

[gaearon]

The warning is generally very useful because it catches a very common beginner mistake of using lowercase elements.

Does the warning appear once or on every render? If it appears on every render we should deduplicate it.

I guess we could also special case time. Since it's going to ship in Chrome and people commonly use it assuming it works. If you want to submit a PR for this we can consider it.

[cusxio]

The warning is generally very useful because it catches a very common beginner mistake of using lowercase elements.

That's true, through this warning I learnt something new.

Does the warning appear once or on every render? If it appears on every render we should deduplicate it.

It appears on every render.

If you want to submit a PR for this we can consider it.

Any guidance on which files I should start looking at?

I guess we could also special case time

Could you elaborate on what do you mean by this?

[gaearon]

You can search codebase for fragments of the warning text to find where it is emitted.

By special casing I mean that we can mute the warning for time specifically.

[bvaughn]

I don't think this is a React issue. Chrome doesn't (yet) support the time element: groups.google.com/a/chromium.org/forum/m/#!topic/blink-dev/e52E3t3ijHo

I noticed this a couple of months ago and mentioned it on Twitter. At the time, someone pointed out Chromium issue 540526 which says:

We don't have plans to implement and at this moment.

Edit: Looks like Dan's PR links to newer threads (1, 2) so it's probably safe to ignore my comment.

[gaearon]

https://github.com/facebook/react/pull/10275 will fix this.