File: test/core/forms.js

Recommend this page to a friend!
  Classes of Sebastian Schlapkohl   jQuery Annex   test/core/forms.js   Download  
File: test/core/forms.js
Role: Auxiliary script
Content type: text/plain
Description: Auxiliary script
Class: jQuery Annex
General purpose functions missing in jQuery
Author: By
Last change: Major Refactoring and Feature Release 41

Major Refactoring and Feature Release 41
========================================

*Beware*: This is a _breaking_ change release that includes several signature changes and deletions for functions,
as well as structural changes such as functions having been moves to plugins. Do not update from 40 to 41
for production projects.

The main goal for this massive commit was to introduce tests for all functionality and to finally add official
support for the latest jQuery 3 additionally to the stable old versions of 2 and 1.

The whole core is now unit tested with Ava and automatically gets tested on each build. Everything that needs
a real browser context to be tested has been covered with example pages.

You can find the files for testing and reference in /test and /examples.

Changes
-------

The following list reflects the changes that happened by category.

### Additions
1. Unit tests with Ava for all core methods and SaneDate plugin in /test
2. Example pages for all non-core methods statically rendered and to be found in /examples
3. Support for jQuery 3.3.1
4. Added CommonJS/Babel module support for Annex and all plugins
5. $.requestAnimationFrame / $.raf to provide cross browser animation frame timers
6. $.cancelAnimationFrame / $.caf to provide cross browser cancellation of animation frame timers
7. SaneDate plugin housing the old $.SaneDate functionality
8. $.waitForRepaint to securely wait for a browser repaint before working with a changed DOM
9. New solutions plugin to hold special but seldomly needed solutions formerly being part of the core
10. $.cssToNumber to convert a css value to an int or float depending on the provided value, this method now also includes support for all current css units
11. Created $.urlParameter to work with global URL parameters not being bound to a certain jQuery object, but provided via an URL string itself
12. Created $.urlParameters as a parametrized variant of $.urlParameter to not only retrieve a single parameter, but a plain object of all parameters
13. Created $.urlAnchor to work with global URL anchor not being bound to a certain jQuery object, but provided via an URL string itself
14. Added $.fn.enable to complete the suite of form element methods already there
15. Added $.fn.enableSelection to have a counterpart to $.fn.disableSelection

### Changes
1. Improved documentation, statically rendered to be found in /doc
2. Expanded and improved readme
3. Declared $.fn.cssTransition stable, moved test from experimental to example page
4. Switched from npm to yarn
5. All exceptions are now Error objects instead of thrown strings
6. $.isEmpty now checks if all parameters are empty and not if one parameter is empty
7. $.exists now checks if it can step down into a new context on every step of a dot path and returns false if a part in the middle of the path can not be resolved
8. $.minMax now throws an exception if min > max
9. $.strTruncate now ensures that maxLength is at least as long as the suffix provided
10. $.strConcat now also accepts an array as first parameter
11. Improved $.maskForSelector according to official jQuery documentation
12. $.removeFromArray now ensures it is actually working on an array target
13. $.objectLength now ensures it is actually working on an object target
14. $.copyObjectContent now ensures it is actually working on an object target
15. $.emptyObject now ensures it is actually working on an object target
16. $.schedule now defaults milliseconds to 1 if not defined and ensures callback is actually a function
17. $.pschedule now defaults milliseconds to 1 if not defined and ensures callback is actually a function and now has improved precision
18. $.reschedule now defaults milliseconds to 1 if not defined and ensures callback is actually a function
19. $.loop now defaults milliseconds to 1 if not defined and ensures callback is actually a function
20. $.ploop now defaults milliseconds to 1 if not defined and ensures callback is actually a function and now has improved precision
21. $.SaneDate has been moved to the SaneDate plugin
22. Fixed a bug in $.unpoll touching the correct management of running polls
23. Improved $.throttle to offer more steady and reliable execution times
24. $.deferExecution now returns a function like $.throttleExecution and $.holdExecution and relays all set parameters to the deferred function
25. Fixed wrong access to state and title of event in $.onHistoryChange
26. Moved $.setupHashNavHighlighting to solutions plugin
27. Moved $.highDpiBackgroundImage to solutions plugin
28. Updated algorithm of $.contextIsTouchDevice to current browser implementations, removed deprecated stuff
29. Fixed $.contentScrollbarWidth for current Firefoxes
30. $.cssToInt is now $.cssToNumber to also be able to handle floats additionally, ints still work the same
31. $.cssUrlToSrc now returns null if provided string is no css url
32. $.remByPx now takes a reference jQuery object as initial instead of just a selector string and additionally offer to just provide the initial value as a number, the method now explicitly returns null if the value could not be parsed
33. $.preloadImages now builds a promise only based on the provided images of the call and not of all globally preloaded images
34. Fixed wrong this reference in $.waitForWebfonts
35. Drastically improved the algorithm in $.isolateId to make id detection more intelligent as well as customizable to also deal with non-numeric ids such as UUIDs
36. Changed default regex in $.isPossibleId to let id not being with 0 anymore
37. Improved $.fn.oo to retrieve vanilla object via get() instead of list acces, now also returns several objects as an array
38. $.fn.dataDuo now returns undefined instead of null if data cannot be found to be in line with core data methods
39. $.measureHidden now uses internal sandbox logic and relays all additional parameters directly to the measure function
40. Added support for multiselect options to $.fn.doselect and $.fn.deselect
41. Added check for radios and checkboxes to $.fn.uncheck and $.fn.check
42. Introduced event namespacing to $.fn.bindSwipeGesture
43. Complete rewrite of $.fn.setElementIdentity, now takes initial attributes via plain object and offers a thin syntax to control inheritance from other element with overrides and wildcars
44. $.fn.prime now allows for adding and removing classes via plain object definition just like in $.fn.cssTransition and offers support for initialization functions returning promises, now differentiates via data attribute via "primed" and "primed-read" between "prime has been called" and "primed has been called and all initializations have been finished/resolved"
45. $.fn.urlParameter now cannot only be called on $(document) but also on $(window) and every other object providing location.href and location.search
46. $.fn.urlAnchor now cannot only be called on $(document) but also on $(window) and every other object providing location.href and location.hash
47. Added support to directly set animated scrollTop on $(window) via $.fn.scrollTo
48. Reworked $.fn.imgLoad to work without empty base64 image hack
49. Declared $.fn.cssTransition stable but experimental
50. $.fn.registerMailto is now named $.fn.registerMailTo and masks the at-symbol in the source

### Deletions
1. $.SaneDate has been moved to an own plugin
2. Moved $.setupHashNavHighlighting to solutions plugin
3. Moved $.highDpiBackgroundImage to solutions plugin
4. $.cssToInt has been replaced with $.cssToNumber
5. $.fn.rehide has been remove without replacement
6. $.fn.registerMailto is now named $.fn.registerMailTo
7. $.fn.removeSandbox has been removed without replacement
8. $.fn.sandbox has been removed without replacement
8. $.fn.loopAnimation has been removed without replacement
Date: 3 years ago
Size: 4,921 bytes
 

Contents

Class file image Download 
import test from 'ava';



$versions.forEach($ => {
    let jqueryVersionString = ' @ jQuery '+$().jquery;
    


    let $testForm = $(`
        <form>
            <div>
                <input type="hidden" name="secret" value="666" />
            </div>
            <fieldset>
                <legend>Legend</legend>
                <label>
                    Label
                    <input type="text" name="foo" value="oof" />
                </label>
                <label>
                    Label
                    <input type="checkbox" name="boo" value="1" checked />
                </label>
                <label>
                    <input type="checkbox" name="boo" value="2" />
                    Label
                </label>
                <label>
                    <input type="checkbox" name="boo" value="3" />
                </label>
                <label>
                    <input type="checkbox" name="far[]" value="4" />
                    Label
                </label>
                <label>
                    <input type="checkbox" name="far[]" value="5" />
                    Label
                </label>
                <label>
                    Label
                    <input type="checkbox" name="far[]" value="6" checked />
                </label>
                <div>
                    <label>
                        Label
                        <select name="bar">
                            <option value=""></option>
                            <option value="7">Seven</option>
                            <option value="8">Eight</option>
                            <option value="9">Nine</option>
                        </select>
                    </label>
                </div>
                <div>
                    <label>
                        <input type="radio" name="fooboo" value="10" />
                        Label
                    </label>
                    <label>
                        <input type="radio" name="fooboo" value="11" />
                        Label
                    </label>
                    <label>
                        Label
                        <input type="radio" name="fooboo" value="12" checked />
                    </label>
                </div>
			</fieldset>
			<input type="file" name="testfile1" />
			<input type="file" name="testfile2" multiple />
        </form>
    `);



	test('$.fn.formDataToObject'+jqueryVersionString, (assert) => {
        let $tf = $($testForm.get(0).outerHTML);

		assert.deepEqual($tf.formDataToObject(), {
            secret : '666',
            foo : 'oof',
            boo : '1',
            far : ['6'],
            bar : '',
            fooboo : '12'
        });

        $tf.find('[name="foo"]').val('boom');
        $tf.find('[name="boo"][value="1"]').uncheck();
        $tf.find('[name="boo"][value="2"]').check();
        $tf.find('[name="boo"][value="3"]').check();
        $tf.find('[name="far[]"][value="4"]').check();
        $tf.find('[name="far[]"][value="6"]').check();
        $tf.find('[name="bar"]').val('8');
        $tf.find('[name="fooboo"][value="11"]').check();

        assert.deepEqual($tf.formDataToObject(), {
            secret : '666',
            foo : 'boom',
            boo : ['2', '3'],
            far : ['4', '6'],
            bar : '8',
            fooboo : '11'
        });
    });
    


    test('$.fn.formDataToFormData'+jqueryVersionString, (assert) => {
		let $tf = $($testForm.get(0).outerHTML),
			fd = $tf.formDataToFormData(['testfile1', 'testfile2'], {name : 'htmlblobname', content : '<em>IMPORTANT!</em>', mimetype : 'text/html'});

		assert.is(fd.get('secret'), '666');
		assert.is(fd.get('foo'), 'oof');
		assert.is(fd.get('boo'), '1');
		assert.deepEqual(fd.getAll('boo'), ['1']);
		assert.is(fd.get('far'), '6');
		assert.deepEqual(fd.getAll('far'), ['6']);
		assert.is(fd.get('bar'), '');
		assert.is(fd.get('fooboo'), '12');

        $tf.find('[name="foo"]').val('boom');
        $tf.find('[name="boo"][value="1"]').uncheck();
        $tf.find('[name="boo"][value="2"]').check();
        $tf.find('[name="boo"][value="3"]').check();
        $tf.find('[name="far[]"][value="4"]').check();
        $tf.find('[name="far[]"][value="6"]').check();
        $tf.find('[name="bar"]').val('8');
		$tf.find('[name="fooboo"][value="11"]').check();

		fd = $tf.formDataToFormData(['testfile1', 'testfile2'], {name : 'htmlblobname', content : '<em>IMPORTANT!</em>', mimetype : 'text/html'});
		
		assert.is(fd.get('foo'), 'boom');
		assert.is(fd.get('boo'), '2');
		assert.deepEqual(fd.getAll('boo'), ['2', '3']);
		assert.is(fd.get('far'), '4');
		assert.deepEqual(fd.getAll('far'), ['4', '6']);
		assert.is(fd.get('bar'), '8');
		assert.is(fd.get('fooboo'), '11');
		assert.false(fd.has('testfile1'));
		assert.false(fd.has('testfile2'));
		assert.is(fd.get('htmlblobname').type, 'text/html');
	});
});