Angular Material datetime-local输入切换应用/标签页时触发NotAllowedError问题求助

我使用了如下的Angular Material datetime-local输入框：

<input
  matInput
  #startDatePicker
  type="datetime-local"
  step="1"
  formControlName="startDate"
  placeholder="Select start date"
  (focus)="startDatePicker.showPicker()"
  max="9999-12-31T23:59:59"
  required />

如果我聚焦该输入框以打开日历选择器，随后要么切换到全屏应用再切回，甚至只是切换标签页再切回来，就会触发如下错误：

NotAllowedError: Failed to execute 'showPicker' on 'HTMLInputElement': HTMLInputElement::showPicker() requires a user gesture.

根据我的理解，这个错误是因为showPicker() API需要用户的点击或触摸这类主动操作。不过我更倾向于在输入框上使用(focus)而非(click)事件，因为这样用户也可以通过Tab键来聚焦输入框。

我猜测在Mac/Chrome环境下，当切回窗口时，浏览器会自动重新聚焦上次选中的输入框，从而触发了这个错误。我希望得到以下几个问题的建议：

• 有没有办法完全阻止这种“重新聚焦”的行为？
• 我是否应该直接在应用中屏蔽这个错误？
• 或者有没有其他方法可以替代(focus)事件，同时实现我想要的（支持Tab键聚焦打开选择器）功能？

感谢您的时间！

备注：内容来源于stack exchange，提问作者Corey K