JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    <input type="text" id="foo" name="foo" required="required" />
    <input type="submit" />
</form>

JavaScript

document.oninvalid = function(e){
    alert('caught invalid event as it bubbled');
};
document.getElementById("foo").oninvalid = function(e){
    alert('Caught invalid form submit (direct)');
};