├── .gitignore ├── .npmrc ├── .travis.yml ├── CHANGES.md ├── LICENSE ├── README.md ├── nwb.config.js ├── package.json ├── src └── index.js └── test ├── fixture.js └── index.test.js /.gitignore: -------------------------------------------------------------------------------- 1 | /coverage 2 | /demo/dist 3 | /es 4 | /lib 5 | /node_modules 6 | /umd 7 | npm-debug.log* 8 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | package-lock=false 2 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | sudo: false 2 | 3 | language: node_js 4 | node_js: 5 | - 8 6 | 7 | cache: 8 | directories: 9 | - node_modules 10 | 11 | before_install: 12 | - npm install codecov.io coveralls 13 | 14 | after_success: 15 | - cat ./coverage/lcov.info | ./node_modules/codecov.io/bin/codecov.io.js 16 | - cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js 17 | 18 | branches: 19 | only: 20 | - master 21 | -------------------------------------------------------------------------------- /CHANGES.md: -------------------------------------------------------------------------------- 1 | # 3.0.0 / 2020-03-10 2 | 3 | **Breaking:** Checkboxes without a `value` attribute will now be `true` rather than defaulting to `'on'`. 4 | 5 | Added: `includeDisabled` option for `getFormData()` and `getFieldData()`. 6 | 7 | # 2.0.0 / 2018-01-02 8 | 9 | **Breaking:** Renamed `getNamedFormElementData()` to `getFieldData()`. 10 | 11 | The ES modules build now uses a named export for `getFieldData()`. 12 | 13 | # 1.2.5 / 2016-01-02 14 | 15 | Added ES6 modules build. 16 | 17 | # 1.2.4 / 2015-11-12 18 | 19 | Changed UMD build directory. 20 | 21 | # 1.2.3 / 2015-11-08 22 | 23 | Changed how the module is published to npm. 24 | 25 | # 1.2.2 / 2015-04-27 26 | 27 | Fixed: Ignore form elements with empty names in `getFormData()`; don't throw on 28 | empty element names in `getNamedFormElementData()` 29 | [[#3](https://github.com/insin/get-form-data/issues/3)] 30 | 31 | # 1.2.1 / 2015-03-11 32 | 33 | Fixed: Ignore any `
` elements which appear in `form.elements` 34 | [[sixsided](https://github.com/sixsided)] 35 | 36 | # 1.2.0 / 2015-03-05 37 | 38 | Changed: Return a `File` object for `` where supported, or a 39 | list of `File` objects if it uses `multiple`. 40 | 41 | # 1.1.0 / 2015-02-05 42 | 43 | Added: `trim` option for `getFormData()` and `getNamedFormElementData()`. 44 | 45 | Fixed: ignoring of individual disabled inputs when multiple inputs have the same 46 | name. 47 | 48 | # 1.0.1 / 2015-01-19 49 | 50 | Fixed: incorrect function names in error messages. 51 | 52 | # 1.0.0 / 2015-01-19 53 | 54 | First release. 55 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016, Jonny Buchanan 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of 6 | this software and associated documentation files (the "Software"), to deal in 7 | the Software without restriction, including without limitation the rights to 8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies 9 | of the Software, and to permit persons to whom the Software is furnished to do 10 | so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # get-form-data 2 | 3 | [![Travis][build-badge]][build] 4 | [![npm package][npm-badge]][npm] 5 | [![Coveralls][coveralls-badge]][coveralls] 6 | 7 | Gets form data - or data for a named form field - via `form.elements`. 8 | 9 | Data is retrieved in a format similar to request parameters which would be sent if the form was submitted, so this module is suitable for extracting form data on the client side for projects which implement isomorphic handling of form submission. 10 | 11 | ## Install 12 | 13 | ``` 14 | npm install get-form-data 15 | ``` 16 | 17 | Browser bundles area available, which export a global `getFormData` function. 18 | 19 | * [get-form-data.js](https://unpkg.com/get-form-data/umd/get-form-data.js) (development version) 20 | * [get-form-data.min.js](https://unpkg.com/get-form-data/umd/get-form-data.min.js) (compressed production version) 21 | 22 | ## Usage 23 | 24 | ### Getting form data 25 | 26 | To get data for an entire form, use the `getFormData()` function: 27 | 28 | ```html 29 |
30 | ... 31 | 32 | 37 | 38 | 39 | 40 | 41 | 42 |

Do you want to use Express Shipping?

43 |
44 | 45 | 46 |
47 | 48 | 49 |

I have read and agree to the Terms of Service.

50 | 51 | ... 52 |
53 | ``` 54 | ```javascript 55 | let form = document.querySelector('#productForm') 56 | 57 | let data = getFormData(form) 58 | 59 | console.log(JSON.stringify(data)) 60 | ``` 61 | ```json 62 | {"product": "1", "quantity": "9", "shipping": "express", "tos": true} 63 | ``` 64 | 65 | ### Getting field data 66 | 67 | To get data for individual form fields (which may contain multiple form inputs with the same name), use the `getFieldData()` function, which is exposed as a property of `getFormData`: 68 | 69 | ```html 70 |
71 | ... 72 | 73 |
74 | 75 | 76 | 77 |
78 | ... 79 |
80 | ``` 81 | ```javascript 82 | let form = document.querySelector('#tshirtForm') 83 | 84 | let sizes = getFormData.getFieldData(form, 'sizes') 85 | 86 | console.log(JSON.stringify(sizes)) 87 | ``` 88 | ``` 89 | ["M", "L"] 90 | ``` 91 | 92 | ### Trimming user input 93 | 94 | To trim user input, pass a `trim: true` option to `getFormData()` or `getFieldData()`: 95 | 96 | ```html 97 |
98 | ... 99 | 100 | 101 | 102 | 103 | 104 | ... 105 |
106 | ``` 107 | ```javascript 108 | let form = document.querySelector('#signupForm') 109 | 110 | let data = getFormData(form, {trim: true}) 111 | 112 | console.log(JSON.stringify(data)) 113 | ``` 114 | ``` 115 | {"username": "AzureDiamond", "password": "hunter2"} 116 | ``` 117 | 118 | ### Including disabled inputs 119 | 120 | Disabled inputs are ignored by default; to include their data, pass an `includeDisabled: true` option to `getFormData()` or `getFieldData()`. 121 | 122 | ```javascript 123 | let data = getFormData(form, {includeDisabled: true}) 124 | ``` 125 | 126 | ### File Inputs 127 | 128 | Where possible, data extracted from `` will be native 129 | [`File`](https://developer.mozilla.org/en-US/docs/Web/API/File) objects. 130 | 131 | If the `.files` property is not available, the `.value` property will be used to provide data instead. 132 | 133 | ## API 134 | 135 | ### `getFormData(form: HTMLFormElement[, options: Object])` 136 | 137 | Extracts data from a `
`'s `.elements` collection - in order to use `.elements`, form inputs must have `name` or `id` attributes. Since multiple inputs can't have the same `id` and a `name` allows an input to qualify as a successful control for form submission, `name` attributes are preferred and will be given priority if both are present. 138 | 139 | The following options can be configured: 140 | 141 | * `trim: Boolean` (default: `false`) - if `true`, leading and trailing whitespace will be trimmed from user input in text entry form inputs. 142 | * `includeDisabled: Boolean` (default: `false`) - if `true`, disabled inputs will not be ignored. 143 | 144 | #### Return type: `Object` 145 | 146 | Properties in the returned data object are mostly consistent with what would have been sent as request parameters if the form had been submitted: 147 | 148 | * Disabled inputs are ignored by default. 149 | * Text inputs will always contribute a value, which will be `''` if they are empty. 150 | * Checkbox inputs will only contribute a value if they are checked, in which case their `value` attribute will be used. 151 | * Form elements which represent multiple values (select-multiple, or multiple inputs with the same name, file inputs with `multiple`) will only contribute a value if they have at least one value to submit. Their values will always be held in an `Array`, even if there is only one. 152 | 153 | Exceptions to this are: 154 | 155 | * If a checked checkbox doesn't have a `value` attribute, its value will be `true`. Normally it would default to `'on'` when submitted, but this isn't as useful a default on the client. 156 | * Buttons are completely ignored, as it's only possible to determine which button counts as successful after it's been used to submit the form. 157 | 158 | ### `getFieldData(form: HTMLFormElement, fieldName: String[, options: Object])` 159 | 160 | > `getFieldData()` is a named export when using ES modules, otherwise it's also available as `getFormData.getFieldData()` 161 | 162 | Extracts data for a named field from a ``'s `.elements` collection. 163 | 164 | Options are as documented for `getFormData`. 165 | 166 | #### Return type: `null | boolean | string | string[] | File | File[]` 167 | 168 | This function is used by `getFormData()`, so the documentation for individual return values above also applies. 169 | 170 | `null` will be returned if the field is non-existent, disabled, or shouldn't contribute a value (e.g. unchecked checkboxes, multiple selects with no selections, file inputs with no selections). 171 | 172 | ## MIT Licensed 173 | 174 | [build-badge]: https://img.shields.io/travis/insin/get-form-data/master.svg?style=flat-square 175 | [build]: https://travis-ci.org/insin/get-form-data 176 | 177 | [npm-badge]: https://img.shields.io/npm/v/get-form-data.svg?style=flat-square 178 | [npm]: https://www.npmjs.org/package/get-form-data 179 | 180 | [coveralls-badge]: https://img.shields.io/coveralls/insin/get-form-data/master.svg?style=flat-square 181 | [coveralls]: https://coveralls.io/github/insin/get-form-data 182 | -------------------------------------------------------------------------------- /nwb.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | type: 'web-module', 3 | karma: { 4 | frameworks: [ 5 | require('karma-tap') 6 | ] 7 | }, 8 | npm: { 9 | umd: 'getFormData' 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "get-form-data", 3 | "version": "3.0.0", 4 | "description": "Gets form data via form.elements", 5 | "main": "lib/index.js", 6 | "module": "es/index.js", 7 | "homepage": "https://github.com/insin/get-form-data", 8 | "license": "MIT", 9 | "author": "Jonny Buchanan ", 10 | "scripts": { 11 | "build": "npm run lint && nwb test", 12 | "lint": "eslint src test", 13 | "test": "nwb build && nwb test", 14 | "test:watch": "nwb test --server" 15 | }, 16 | "files": [ 17 | "es", 18 | "lib", 19 | "umd" 20 | ], 21 | "dependencies": {}, 22 | "devDependencies": { 23 | "eslint-config-jonnybuchanan": "6.0.x", 24 | "karma-tap": "4.2.0", 25 | "nwb": "0.24.x", 26 | "tape": "4.13.2" 27 | }, 28 | "repository": { 29 | "type": "git", 30 | "url": "https://github.com/insin/get-form-data.git" 31 | }, 32 | "keywords": [ 33 | "data", 34 | "form", 35 | "forms" 36 | ] 37 | } 38 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | const NODE_LIST_CLASSES = { 2 | '[object HTMLCollection]': true, 3 | '[object NodeList]': true, 4 | '[object RadioNodeList]': true 5 | } 6 | 7 | // .type values for elements which can appear in .elements and should be ignored 8 | const IGNORED_ELEMENT_TYPES = { 9 | 'button': true, 10 | 'fieldset': true, 11 | 'reset': true, 12 | 'submit': true 13 | } 14 | 15 | const CHECKED_INPUT_TYPES = { 16 | 'checkbox': true, 17 | 'radio': true 18 | } 19 | 20 | const TRIM_RE = /^\s+|\s+$/g 21 | 22 | const {slice} = Array.prototype 23 | const {toString} = Object.prototype 24 | 25 | /** 26 | * @param {HTMLFormElement} form 27 | * @param {Object} [options] 28 | * @return {Object.} an object containing 29 | * submittable value(s) held in the form's .elements collection, with 30 | * properties named as per element names or ids. 31 | */ 32 | export default function getFormData(form, options) { 33 | if (!form) { 34 | throw new Error(`A form is required by getFormData, was given form=${form}`) 35 | } 36 | 37 | options = { 38 | includeDisabled: false, 39 | trim: false, 40 | ...options 41 | } 42 | 43 | let data = {} 44 | let elementName 45 | let elementNames = [] 46 | let elementNameLookup = {} 47 | 48 | // Get unique submittable element names for the form 49 | for (let i = 0, l = form.elements.length; i < l; i++) { 50 | let element = form.elements[i] 51 | if (IGNORED_ELEMENT_TYPES[element.type] || (element.disabled && !options.includeDisabled)) { 52 | continue 53 | } 54 | elementName = element.name || element.id 55 | if (elementName && !elementNameLookup[elementName]) { 56 | elementNames.push(elementName) 57 | elementNameLookup[elementName] = true 58 | } 59 | } 60 | 61 | // Extract element data name-by-name for consistent handling of special cases 62 | // around elements which contain multiple inputs. 63 | for (let i = 0, l = elementNames.length; i < l; i++) { 64 | elementName = elementNames[i] 65 | let value = getFieldData(form, elementName, options) 66 | if (value != null) { 67 | data[elementName] = value 68 | } 69 | } 70 | 71 | return data 72 | } 73 | 74 | /** 75 | * @param {HTMLFormElement} form 76 | * @param {string} fieldName 77 | * @param {Object} [options] 78 | * @return {?(boolean|string|string[]|File|File[])} submittable value(s) in the 79 | * form for a named element from its .elements collection, or null if there 80 | * was no element with that name, or the element had no submittable value(s). 81 | */ 82 | export function getFieldData(form, fieldName, options) { 83 | if (!form) { 84 | throw new Error(`A form is required by getFieldData, was given form=${form}`) 85 | } 86 | if (!fieldName && toString.call(fieldName) !== '[object String]') { 87 | throw new Error(`A field name is required by getFieldData, was given fieldName=${fieldName}`) 88 | } 89 | 90 | options = { 91 | includeDisabled: false, 92 | trim: false, 93 | ...options 94 | } 95 | 96 | let element = form.elements[fieldName] 97 | if (!element || (element.disabled && !options.includeDisabled)) { 98 | return null 99 | } 100 | 101 | if (!NODE_LIST_CLASSES[toString.call(element)]) { 102 | return getFormElementValue(element, options.trim) 103 | } 104 | 105 | // Deal with multiple form controls which have the same name 106 | let data = [] 107 | let allRadios = true 108 | for (let i = 0, l = element.length; i < l; i++) { 109 | if (element[i].disabled && !options.includeDisabled) { 110 | continue 111 | } 112 | if (allRadios && element[i].type !== 'radio') { 113 | allRadios = false 114 | } 115 | let value = getFormElementValue(element[i], options.trim) 116 | if (value != null) { 117 | data = data.concat(value) 118 | } 119 | } 120 | 121 | // Special case for an element with multiple same-named inputs which were all 122 | // radio buttons: if there was a selected value, only return the value. 123 | if (allRadios && data.length === 1) { 124 | return data[0] 125 | } 126 | 127 | return (data.length > 0 ? data : null) 128 | } 129 | 130 | /** 131 | * @param {HTMLElement} element a form element. 132 | * @param {boolean} [trim] should values for text entry inputs be trimmed? 133 | * @return {?(boolean|string|string[]|File|File[])} the element's submittable 134 | * value(s), or null if it had none. 135 | */ 136 | function getFormElementValue(element, trim) { 137 | let value = null 138 | let {type} = element 139 | 140 | if (type === 'select-one') { 141 | if (element.options.length) { 142 | value = element.options[element.selectedIndex].value 143 | } 144 | return value 145 | } 146 | 147 | if (type === 'select-multiple') { 148 | value = [] 149 | for (let i = 0, l = element.options.length; i < l; i++) { 150 | if (element.options[i].selected) { 151 | value.push(element.options[i].value) 152 | } 153 | } 154 | if (value.length === 0) { 155 | value = null 156 | } 157 | return value 158 | } 159 | 160 | // If a file input doesn't have a files attribute, fall through to using its 161 | // value attribute. 162 | if (type === 'file' && 'files' in element) { 163 | if (element.multiple) { 164 | value = slice.call(element.files) 165 | if (value.length === 0) { 166 | value = null 167 | } 168 | } 169 | else { 170 | // Should be null if not present, according to the spec 171 | value = element.files[0] 172 | } 173 | return value 174 | } 175 | 176 | if (!CHECKED_INPUT_TYPES[type]) { 177 | value = (trim ? element.value.replace(TRIM_RE, '') : element.value) 178 | } 179 | else if (element.checked) { 180 | if (type === 'checkbox' && !element.hasAttribute('value')) { 181 | value = true 182 | } 183 | else { 184 | value = element.value 185 | } 186 | } 187 | 188 | return value 189 | } 190 | 191 | // For UMD build access to getFieldData 192 | getFormData.getFieldData = getFieldData 193 | -------------------------------------------------------------------------------- /test/fixture.js: -------------------------------------------------------------------------------- 1 | export default ` 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 58 | 59 | 65 | 66 | 72 | 73 | 74 | 79 | 80 | 85 | 86 | 91 | 92 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 |
107 | ... 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 |

I have read and agree to the Terms of Service.

119 | 120 | ... 121 |
122 | 123 | 124 | 125 |
126 | ... 127 | 128 | 133 | 134 | 135 | 136 | 137 | 138 |

Do you want to use Express Shipping?

139 |
140 | 141 | 142 |
143 | 144 | 145 |

I have read and agree to the Terms of Service.

146 | 147 | ... 148 |
149 | 150 |
151 | ... 152 | 153 |
154 | 155 | 156 | 157 |
158 | ... 159 |
160 | 161 |
162 | ... 163 | 164 | 165 | 166 | 167 | 168 | ... 169 |
` 170 | -------------------------------------------------------------------------------- /test/index.test.js: -------------------------------------------------------------------------------- 1 | import test from 'tape' 2 | 3 | import getFormData, {getFieldData} from 'src/index' 4 | import fixture from './fixture' 5 | 6 | document.body.innerHTML = fixture 7 | 8 | test('getFormData', t => { 9 | t.plan(2) 10 | 11 | let form = document.querySelector('#testForm') 12 | 13 | t.deepEqual(getFormData(form), { 14 | checkOneMultipleCheckbox: ['3'], 15 | checkTwoMultipleCheckbox: ['1', '3'], 16 | checkedCheckbox: 'checkedCheckbox', 17 | noValueCheckedCheckbox: true, 18 | checkedRadio: '2', 19 | hiddenInput: 'hiddenInput', 20 | partiallyDisabledMultipleCheckbox: ['3'], 21 | selectedSelect: '2', 22 | selectOneSelectMultiple: ['3'], 23 | selectTwoSelectMultiple: ['1', '3'], 24 | textarea: 'textarea', 25 | textInput: 'textInput', 26 | unselectedSelect: '' 27 | }, 'buttons and disabled elements ignored, data extracted consistently') 28 | 29 | t.throws( 30 | () => getFormData(), 31 | /A form is required by getFormData, was given form=undefined/, 32 | 'Error if form is not provided' 33 | ) 34 | }) 35 | 36 | test('getFieldData', t => { 37 | t.plan(10) 38 | 39 | let form = document.querySelector('#testForm') 40 | 41 | t.deepEqual(getFieldData(form, 'checkedRadio'), '2', 'special case for radio select mutiple - single value rather than a list') 42 | 43 | t.deepEqual(getFieldData(form, 'multipleCheckbox'), null, 'null for multiple checkboxes with nothing checked') 44 | t.deepEqual(getFieldData(form, 'checkOneMultipleCheckbox'), ['3'], 'list for 1 checked in multiple checkbox') 45 | t.deepEqual(getFieldData(form, 'checkTwoMultipleCheckbox'), ['1', '3'], 'list for >1 checked in multiple checkboxes') 46 | 47 | t.deepEqual(getFieldData(form, 'selectMultiple'), null, 'null for select multiple with nothing selected') 48 | t.deepEqual(getFieldData(form, 'selectOneSelectMultiple'), ['3'], 'list for 1 selected in select multiple') 49 | t.deepEqual(getFieldData(form, 'selectTwoSelectMultiple'), ['1', '3'], 'list for >1 selected in select multiple') 50 | 51 | t.throws( 52 | () => getFieldData(), 53 | /A form is required by getFieldData, was given form=undefined/, 54 | 'Error if form is not provided' 55 | ) 56 | 57 | t.throws( 58 | () => getFieldData(form), 59 | /A field name is required by getFieldData, was given fieldName=undefined/, 60 | 'Error if element name is not provided' 61 | ) 62 | 63 | t.equal(getFieldData(form, ''), null, 'null if an empty string is given as element name') 64 | }) 65 | 66 | test('trim option', t => { 67 | t.plan(5) 68 | 69 | let form = document.querySelector('#trimForm') 70 | 71 | t.deepEqual(getFormData(form), { 72 | username: ' AzureDiamond', 73 | password: 'hunter2 ', 74 | message: ' Hello ', 75 | tos: ' Y ' 76 | }, 'getFormData trims nothing by default') 77 | 78 | // A trim option can be passed to getFormData 79 | let trimmedData = getFormData(form, {trim: true}) 80 | t.deepEqual(trimmedData, { 81 | username: 'AzureDiamond', 82 | password: 'hunter2', 83 | message: 'Hello', 84 | tos: ' Y ' 85 | }, 'getFormData only trims text inputs with {trim: true}') 86 | 87 | // A trim option can also be passed directly to getFieldData 88 | t.equal(getFormData.getFieldData(form, 'username'), 89 | ' AzureDiamond', 90 | 'getFieldData trims nothing by default') 91 | t.equal(getFormData.getFieldData(form, 'username', {trim: true}), 92 | 'AzureDiamond', 93 | 'getFieldData trims text inputs with {trim: true}') 94 | t.equal(getFormData.getFieldData(form, 'tos', {trim: true}), 95 | ' Y ', 96 | 'getFieldData doesn\'t trim non-text inputs with {trim: true}') 97 | }) 98 | 99 | test('includeDisabled option', t => { 100 | t.plan(1) 101 | 102 | let form = document.querySelector('#testForm') 103 | 104 | t.deepEqual(getFormData(form, {includeDisabled: true}), { 105 | checkOneMultipleCheckbox: ['3'], 106 | checkTwoMultipleCheckbox: ['1', '3'], 107 | disabledMultipleCheckbox: ['1', '3'], 108 | checkedCheckbox: 'checkedCheckbox', 109 | noValueCheckedCheckbox: true, 110 | checkedRadio: '2', 111 | radioDisabled: '2', 112 | hiddenInput: 'hiddenInput', 113 | hiddenInputDisabled: 'hiddenInputDisabled', 114 | partiallyDisabledMultipleCheckbox: ['1', '3'], 115 | selectedSelect: '2', 116 | selectedDisabled: '2', 117 | selectOneSelectMultiple: ['3'], 118 | selectTwoSelectMultiple: ['1', '3'], 119 | selectMultipleDisabled: ['1', '3'], 120 | textarea: 'textarea', 121 | textareaDisabled: 'textareaDisabled', 122 | textInput: 'textInput', 123 | textInputDisabled: 'textInputDisabled', 124 | unselectedSelect: '' 125 | }, 'disabled inputs included') 126 | }) 127 | 128 | test('README example - getFormData', t => { 129 | t.plan(1) 130 | let form = document.querySelector('#productForm') 131 | let data = getFormData(form) 132 | t.deepEqual(data, { 133 | product: '1', 134 | quantity: '9', 135 | shipping: 'express', 136 | tos: true 137 | }, `Data: ${JSON.stringify(data)}`) 138 | }) 139 | 140 | test('README example - getFieldData', t => { 141 | t.plan(1) 142 | let form = document.querySelector('#tshirtForm') 143 | let data = getFieldData(form, 'sizes') 144 | t.deepEqual(data, ['M', 'L'], `Data: ${JSON.stringify(data)}`) 145 | }) 146 | 147 | test('README example - trimming', t => { 148 | t.plan(1) 149 | let form = document.querySelector('#signupForm') 150 | let data = getFormData(form, {trim: true}) 151 | t.deepEqual(data, { 152 | username: 'AzureDiamond', 153 | password: 'hunter2' 154 | }, `Data: ${JSON.stringify(data)}`) 155 | }) 156 | --------------------------------------------------------------------------------