en.javascript.info/8-web-components/2-custom-elements/1-live-timer/task.md
Ilya Kantor 9c3ac133e3 draft
2019-03-30 14:32:38 +03:00

604 B

Live timer element

We already have <time-formatted> element to show a nicely formatted time.

Create <live-timer> element to show the current time:

  1. It should use <time-formatted> internally, not duplicate its functionality.
  2. Ticks (updates) every second.
  3. For every tick, a custom event named tick should be generated, with the current date in event.detail (see chapter info:dispatch-events).

Usage:

<live-timer id="elem"></live-timer>

<script>
  elem.addEventListener('tick', event => console.log(event.detail));
</script>

Demo:

[iframe src="solution" height=40]