checkValidity always returns true on readOnly forms

[namti]

Describe the bug
checkValidity function always returns true on readOnly forms.

Version/Branch
4.15.1

To Reproduce
Steps to reproduce the behavior:

1. Set form option readOnly to true
2. Invoke checkValidity(submissionJson, true)
3. If set readOnly to false, checkValidity returns false as expected

Expected behavior
Returns false on invalid forms even they are read only.

Additional context
Add any other context about the problem here.

[lane-formio]

Have you checked this on later versions?
4.21.5 is our latest 4.x release
5.0.0-rc.100 is our most recent 5.x candidate (expecting to officially release within the next couple weeks)

[namti]

Not yet. I am using @formio/[email protected] which is the latest version of it. The package uses formiojs@^4.15.1 as its dependency.

[namti]

I have made an example using latest RC versions of @formio/react and @formio/js. The problem still exists.

https://stackblitz.com/edit/vitejs-vite-saq3bv?file=src%2FApp.jsx

[CaptainGlac1er]

"Constraint validation: If the readonly attribute is specified on an input element, the element is barred from constraint validation."

• https://html.spec.whatwg.org/multipage/input.html#the-readonly-attribute

[namti]

"Constraint validation: If the readonly attribute is specified on an input element, the element is barred from constraint validation."

• https://html.spec.whatwg.org/multipage/input.html#the-readonly-attribute

Since I manually invoke the checkValidity function to validate, can we have an option to forcibly validate the submission data irregardless of the read only option?

[lane-formio]

After review, we don't expect to change or add any feature functionality around this behavior. We are always happy to review any contributions made but we won't be resourcing anyone for this.

[lane-formio]

@namti
What is the use-case here that you would need to validate a read-only form?

[namti]

@lane-formio We have multi-user collaborated forms. A user can occupy a form at one time. But all users can submit all forms. That requires validating read only forms.

Currently, I use a workaround solution.

const checkValidity = async (form: FormProps['form'], submission: FormProps['submission']): Promise<boolean | void> => {
  if(form){
    const el = document.createElement('div');

    let instance: any = null;

    await Formio.createForm(el, form)
      .then((form: any) => {
        form.submission = submission;
        instance = form;
      })
      .catch(err => console.error('Failed to initiate the form.', err));

    if(instance !== null){
      return instance.checkValidity(null, false);
    }
  }
};

This works but it costs performance.

[CaptainGlac1er]

@lane-formio I recommend not going away from the web standard. Angular FormControl works exactly the same way where validation is disabled on disabled fields.