HTML5 Form Validation #544

bhazzard opened this Issue Dec 14, 2012 · 4 comments


None yet
5 participants

JSDOM does not currently handle HTML5 forms validation, and in particular, the checkValidity API.

This is needed to accurately test modern applications that utilize HTML5 forms.

I wonder if it would be possible to add this support, using as a starting point. H5F is browser shim to add HTML5 forms support to browsers that don't support them. As an aside, I'd be happy to add this behavior myself if someone can point me to the best way to do it.


domenic commented Dec 14, 2012

I agree this would be nice and is important. However, it's going to be quite the undertaking.

The biggest thing this needs is a solid test suite. If you look in the guidelines, there's some pointers to where to find them, or failing that, what mailing lists to ask. If you can dig them up, I think we have a shot at implementing this, especially as you point out by using H5F as a starting point.

The only other important part of the actual implementation is that we don't have a proper "level4" or "html5" folder for implementing things beyond DOM Level 3. But that's something we've needed for a while, so I'll try to get on it soon.

👍 It would be a great feature.

fernandopasik commented Oct 30, 2016 edited

Right now I'm adding as a polyfill after the jsdom setup. It works great.

Yay! I'm the author of Hyperform. And as luck would have it, I use JSDom already to set up a test environment.

The part that might be interesting for the JSDom maintainers: I played around with using Hyperform inside JSDom, too, to cover the appropriate web platform tests:

$ git diff test/web-platform-tests/create-jsdom.js
diff --git a/test/web-platform-tests/create-jsdom.js b/test/web-platform-tests/create-jsdom.js
index 7009df7..9edcb16 100644
--- a/test/web-platform-tests/create-jsdom.js
+++ b/test/web-platform-tests/create-jsdom.js
@@ -1,5 +1,6 @@
 "use strict";
 const jsdom = require("../..");
+const hyperform = require("hyperform");
 const nodeResolverPromise = require("../util").nodeResolverPromise;

 const globalPool = { maxSockets: 6 };
@@ -35,6 +36,9 @@ module.exports = (urlPrefix, testPath) => {

   return created
   .then(window => {
+    global.window = window;
+    global.document = window.document;
+    hyperform(window);
     return new Promise((resolve, reject) => {
       const errors = [];

and uncommenting in test/web-platform-tests/index.js the "html/semantics/forms/constraints/*.html" tests.

Unfortunately I only got a couple test cases to turn green. But if you are interested in adding (in whatever way) Hyperform's features to JSDom, I'd put some more work in

a) getting those tests to pass, and
b) providing a version of or configuration to Hyperform, that excludes the high level API

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment