From 91c9387632ffba439cecb7a144352b832ffb2592 Mon Sep 17 00:00:00 2001 From: Serban Ghita Date: Mon, 18 Dec 2023 22:14:24 +0200 Subject: [PATCH] Fixed tests Added options --- src/FormToObject.ts | 22 ++++++++-- src/dom.ts | 25 +++++++++++- test/integration/exceptions.test.ts | 37 ----------------- test/integration/textarea.test.ts | 12 ------ test/integration/unexpected.test.ts | 32 --------------- test/manual/playground.html | 6 +++ test/unit/constructor.test.ts | 62 +++++++++++++++++++++++++++++ test/unit/getObjLength.test.ts | 22 ++++++++++ test/unit/submit.test.ts | 36 +++++++++++++++++ test/unit/textarea.test.ts | 13 ++++++ test/unit/unexpected.test.ts | 62 +++++++++++++++++++++++++++++ 11 files changed, 243 insertions(+), 86 deletions(-) delete mode 100644 test/integration/exceptions.test.ts delete mode 100644 test/integration/textarea.test.ts delete mode 100644 test/integration/unexpected.test.ts create mode 100644 test/unit/constructor.test.ts create mode 100644 test/unit/submit.test.ts create mode 100644 test/unit/textarea.test.ts create mode 100644 test/unit/unexpected.test.ts diff --git a/src/FormToObject.ts b/src/FormToObject.ts index e21b1cd..b04af00 100644 --- a/src/FormToObject.ts +++ b/src/FormToObject.ts @@ -1,5 +1,6 @@ import {HTMLFormField, IFormToObjectOptions, NodeResult} from "./types"; import { + getAllFormElementsAsArray, isCheckbox, isChecked, isDomElementNode, @@ -17,9 +18,18 @@ export class FormToObject { public $form: HTMLFormElement | null = null; public $formElements: HTMLFormField[] = []; - // Experimental. Don't rely on them yet. public settings = { includeEmptyValuedElements: false, + /** + * It doesn't make sense to include submit buttons, + * but if the use-case requires, we keep this option open. + */ + includeSubmitButton: false, + /** + * By default, we don't include key:value pair from disabled fields. + * + */ + includeDisabledFields: false, w3cSuccessfulControlsOnly: false, /** * In case of a multiple select, e.g. Option 1 + + + + +

Disabled

+ diff --git a/test/unit/constructor.test.ts b/test/unit/constructor.test.ts new file mode 100644 index 0000000..7e357a2 --- /dev/null +++ b/test/unit/constructor.test.ts @@ -0,0 +1,62 @@ +import {FormToObject} from "../../src/FormToObject"; + +describe('constructor', () => { + describe('An invalid or non existing selector', () => { + it('null, should throw error', () => { + expect(() => { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + new FormToObject(null); + }).toThrowError('No selector was passed.'); + }); + + it('empty string, should throw error', () => { + expect(() => { + new FormToObject(''); + }).toThrowError('No selector was passed.'); + }); + + it('undefined, should throw error', () => { + expect(() => { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + new FormToObject(); + }).toThrowError('No selector was passed.'); + }); + + it('non-existent selector should throw error', () => { + expect(() => { + new FormToObject('non-existing-selector'); + }).toThrowError('The
DOM element could not be found.'); + }); + + it('invalid DOM element ref should throw error', () => { + expect(() => { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + new FormToObject(document.createTextNode('text')); + }).toThrowError('The DOM element could not be found.'); + }); + + it('invalid class should throw error', () => { + expect(() => { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + new FormToObject({nodeType: 1}); + }).toThrowError('The is either not a valid DOM element or the browser is very old.'); + }); + + }); + + describe('An empty HTML form', () => { + it('should return throw error', () => { + expect(() => { + const $form = document.createElement('form'); + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + new FormToObject($form); + }).toThrowError('No DOM elements were found. Form is empty.'); + }); + }); +}); + diff --git a/test/unit/getObjLength.test.ts b/test/unit/getObjLength.test.ts index 5c03217..3cfb1af 100644 --- a/test/unit/getObjLength.test.ts +++ b/test/unit/getObjLength.test.ts @@ -22,4 +22,26 @@ describe('getObjLength', function() { expect(getObjLength([])).toBe(0); expect(getObjLength({name: 'Serban', job: 'programmer'})).toBe(2); }); + + it('when provided an object with prototype, it only includes values from the object', function() { + const objParent = { p: 'p' }; + const obj = { a: 'a' }; + Object.setPrototypeOf(obj, objParent); + + expect(getObjLength(obj)).toBe(1); + }); + + it.skip('when Object.keys is missing, it only includes values from the object', function() { + const objParent = { p: 'p' }; + const obj = { a: 'a' }; + Object.setPrototypeOf(obj, objParent); + + const k = Object.keys; + // @ts-expect-error Exception test + delete Object.keys; + + expect(getObjLength(obj)).toBe(1); + + Object.keys = k; + }); }); diff --git a/test/unit/submit.test.ts b/test/unit/submit.test.ts new file mode 100644 index 0000000..397d028 --- /dev/null +++ b/test/unit/submit.test.ts @@ -0,0 +1,36 @@ +import {FormToObject} from "../../src/FormToObject"; + +describe('submit', () => { + it('input with includeSubmitButton: true', () => { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + const formToObject = new FormToObject($form, {includeSubmitButton: true}); + + expect(formToObject.convertToObj()).toEqual({'submit':'go'}); + }); + + it('input with includeSubmitButton: false (default)', () => { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + const formToObject = new FormToObject($form); + + expect(formToObject.convertToObj()).toEqual({}); + }); + + // Currently we don't support + `; + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + new FormToObject($form); + }).toThrowError('No DOM elements were found. Form is empty.'); + }); +}); diff --git a/test/unit/textarea.test.ts b/test/unit/textarea.test.ts new file mode 100644 index 0000000..7870c25 --- /dev/null +++ b/test/unit/textarea.test.ts @@ -0,0 +1,13 @@ +import {FormToObject} from "../../src/FormToObject"; + +describe('textarea', ()=> { + it('should return an object', () => { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + const formToObject = new FormToObject($form); + + expect(formToObject.convertToObj()).toEqual({'address':'address'}); + }); +}); diff --git a/test/unit/unexpected.test.ts b/test/unit/unexpected.test.ts new file mode 100644 index 0000000..a301255 --- /dev/null +++ b/test/unit/unexpected.test.ts @@ -0,0 +1,62 @@ +import {FormToObject} from "../../src/FormToObject"; + +/** + * Unexpected situations tests. + */ + +describe('unexpected', () => { + + it('two duplicate elements should return only one key with the last value', () => { + const $form = document.createElement('form'); + $form.innerHTML = ` + + + `; + + const formToObject = new FormToObject($form); + + expect(formToObject.convertToObj()).toEqual({ text:'second' }); + }); + + it('one input element without name attribute should return {}', function() { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + + const formToObject = new FormToObject($form); + + expect(formToObject.convertToObj()).toEqual({}); + }); + + it('one field without "type" attribute should return key and value', function() { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + const formToObject = new FormToObject($form); + + expect(formToObject.convertToObj()).toEqual({ text:'text' }); + }); + + it('one field with "disabled" attribute should return {}', function() { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + const formToObject = new FormToObject($form); + + expect(formToObject.convertToObj()).toEqual({}); + }); + + it('one field with "disabled" attribute, with includeDisabledFields: true, should return key:value pair', function() { + const $form = document.createElement('form'); + $form.innerHTML = ` + + `; + const formToObject = new FormToObject($form, {includeDisabledFields: true}); + + expect(formToObject.convertToObj()).toEqual({'text': 'text'}); + }); + +});