When upgrading to 4.0.0.beta, I noticed that when I was trying to set up server side validation, inputs and custom checkboxes were working correctly when adding .is-invalid. However, non-custom checkboxes like the following were not.

<div class="form-check">
  <label class="form-check-label is-invalid">
    <input class="form-check-input is-invalid" required="required" type="checkbox">
    Text
  </label>
</div>

Is there a way to make regular (browser-styled) checkboxes look invalid with server-side validation (e.g. when not filled and required) or is this only reserved to custom checkboxes?

JS Bin: https://jsbin.com/ruzodunuqe/edit