取消设置值后，Safari 日期时间本地表单有效性错误

Question

在 Safari 中使用以下表单，如果您设置了日期，然后使用“清除”按钮取消设置，则 Safari 将使该表单无效，即使它是有效的。

它也不会为输入元素分配

validationMessage

。删除

novalidate

，它所做的只是选择输入的日期部分。

我是否遗漏了什么，或者这是 Safari 的错误吗？该表单在 Chrome 中验证良好。

https://jsfiddle.net/n_cholas/zfo9qm6p/27/

<form novalidate>
  <input type="datetime-local">
  <button type="button">clear</button>
  <button>Submit</button>
</form>

<script>
const form = document.getElementsByTagName('form')[0]
const input = document.getElementsByTagName('input')[0]
const btn = document.getElementsByTagName('button')[0]

btn.addEventListener('click', function(e) {
  input.value = ''
})

form.addEventListener('submit', function(e) {
  e.preventDefault();
  
  console.log('checkValidity', form.checkValidity())
  console.log('validationMessage', input.validationMessage)
})
</script>

Answer 1

解决方案非常奇怪：两次设置输入值会强制 Safari 正确识别更改。表格不再无效。

https://jsfiddle.net/n_cholas/zfo9qm6p/37/

btn.addEventListener('click', function(e) {
  input.value = ''
  input.value = ''
})