<div id="app"></div>
table{
  border-collapse: collapse;
}
tbody td {
  text-align: center;
}
 th,td {
  padding: 10px;
  border: 1px solid gray;
}
import * as dateFns from "https://cdn.skypack.dev/date-fns@2.28.0";
const app = document.getElementById("app");


app.innerHTML = `
<table>
    <thead>
        <tr>
            <th>date</th>
            <th>new Date()</th>
            <th>dateFns.parse()</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>2022-13-01</td>
            <td>${new Date('2022-13-01')}</td>
            <td>${dateFns.parse('2022-13-01', 'yyyy-MM-dd', new Date())}</td>
        </tr>
        <tr>
            <td>2022-01-32</td>
            <td>${new Date('2022-01-32')}</td>
            <td>${dateFns.parse('2022-01-32', 'yyyy-MM-dd', new Date())}</td>
        </tr>
        <tr>
            <td>2022-02-29</td>
            <td>${new Date('2022-02-29')}</td>
            <td>${dateFns.parse('2022-02-29', 'yyyy-MM-dd', new Date())}</td>
        </tr>
        <tr>
            <td>2022-04-31</td>
            <td>${new Date('2022-04-31T00:00:00.000Z')}</td>
            <td>${dateFns.parse('2022-04-31', 'yyyy-MM-dd', new Date())}</td>
        </tr>
        
    </tbody>
</table>
`;

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.