From 83c63e7db44e69597b2a7e0faa6937c886a203c1 Mon Sep 17 00:00:00 2001 From: Anthon Pang Date: Mon, 8 Mar 2021 22:41:35 -0500 Subject: [PATCH 1/3] add more read-only tests --- tests/codeceptjs/editors/button_test.js | 5 +++++ tests/codeceptjs/editors/radio_test.js | 10 ++++++++++ tests/pages/read-only.html | 23 +++++++++++++++++++---- 3 files changed, 34 insertions(+), 4 deletions(-) create mode 100644 tests/codeceptjs/editors/radio_test.js diff --git a/tests/codeceptjs/editors/button_test.js b/tests/codeceptjs/editors/button_test.js index e7f3e7e88..0c2314ef9 100644 --- a/tests/codeceptjs/editors/button_test.js +++ b/tests/codeceptjs/editors/button_test.js @@ -28,3 +28,8 @@ Scenario('should not leave any footprints in result', async (I) => { assert.equal(await I.grabValueFrom('.value'), JSON.stringify({"textinput":""})); }); +Scenario('should be disabled if "readonly" is specified', async (I) => { + I.amOnPage('read-only.html'); + + I.seeDisabledAttribute('[data-schemapath="root.button"] button'); +}); diff --git a/tests/codeceptjs/editors/radio_test.js b/tests/codeceptjs/editors/radio_test.js new file mode 100644 index 000000000..cd2712c63 --- /dev/null +++ b/tests/codeceptjs/editors/radio_test.js @@ -0,0 +1,10 @@ +var assert = require('assert'); + +Feature('radio'); + +Scenario('should be disabled if "readonly" is specified', async (I) => { + I.amOnPage('read-only.html'); + + I.seeDisabledAttribute('[id="root[radio][0]"]'); + I.seeDisabledAttribute('[id="root[radio][1]"]'); +}); diff --git a/tests/pages/read-only.html b/tests/pages/read-only.html index 9f9e4905e..6c9cdac1b 100644 --- a/tests/pages/read-only.html +++ b/tests/pages/read-only.html @@ -55,6 +55,22 @@ "type": "boolean", "readOnly": true }, + checkbox: { + "title": "checkbox", + "format": "checkbox", + "type": "boolean", + "readOnly": true + }, + radio: { + "title": "radio", + "format": "radio", + "type": "string", + "enum": [ + "yes", + "no" + ], + "readOnly": true + }, rating: { "title": "rating", "readOnly": true, @@ -63,10 +79,9 @@ "maximum": "5", "exclusiveMaximum": false }, - checkbox: { - "title": "checkbox", - "format": "checkbox", - "type": "boolean", + button: { + "title": "button", + "format": "button", "readOnly": true } } From 3a5f6c37519d14667503dfafb7bf3a8f38ee2173 Mon Sep 17 00:00:00 2001 From: Anthon Pang Date: Mon, 8 Mar 2021 23:15:48 -0500 Subject: [PATCH 2/3] make selectize test more robust against race condition --- tests/codeceptjs/editors/array_test.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/codeceptjs/editors/array_test.js b/tests/codeceptjs/editors/array_test.js index a2ad37d25..cc8e90f09 100644 --- a/tests/codeceptjs/editors/array_test.js +++ b/tests/codeceptjs/editors/array_test.js @@ -873,9 +873,9 @@ Scenario('should work well with nested array editors', async (I) => { Scenario('should work well with selectize multiselect editors', async (I) => { I.amOnPage('array-selectize.html'); I.click('Add item'); + await I.seeElement('[data-schemapath="root.0"]'); I.click('Add item'); - I.seeElement('[data-schemapath="root.0"]'); - I.seeElement('[data-schemapath="root.1"]'); + await I.seeElement('[data-schemapath="root.1"]'); I.click('.get-value'); value = await I.grabValueFrom('.debug'); // ensure defaults From d2f380a65dc9d3cf97c9bb41a7cfbfef708be04c Mon Sep 17 00:00:00 2001 From: Anthon Pang Date: Mon, 8 Mar 2021 23:02:28 -0500 Subject: [PATCH 3/3] disable input when readonly --- src/editors/button.js | 3 +-- src/editors/checkbox.js | 3 +-- src/editors/multiselect.js | 4 +++- src/editors/radio.js | 6 +----- src/editors/select.js | 5 ++--- src/editors/signature.js | 3 ++- src/editors/starrating.js | 10 +++------- src/editors/string.js | 4 ++-- src/editors/uuid.js | 3 +-- 9 files changed, 16 insertions(+), 25 deletions(-) diff --git a/src/editors/button.js b/src/editors/button.js index bf8640f16..dbb9250ce 100644 --- a/src/editors/button.js +++ b/src/editors/button.js @@ -38,8 +38,7 @@ export class ButtonEditor extends AbstractEditor { this.input.addEventListener('click', options.action, false) if (this.schema.readOnly || this.schema.readonly || this.schema.template) { - this.always_disabled = true - this.input.setAttribute('readonly', 'true') + this.disable(true) } /* Set custom attributes on input element. Parameter is array of protected keys. Empty array if none. */ diff --git a/src/editors/checkbox.js b/src/editors/checkbox.js index 640d6f682..846bcabd8 100644 --- a/src/editors/checkbox.js +++ b/src/editors/checkbox.js @@ -40,8 +40,7 @@ export class CheckboxEditor extends AbstractEditor { this.control = this.theme.getFormControl(this.label, this.input, this.description, this.infoButton) if (this.schema.readOnly || this.schema.readonly) { - this.always_disabled = true - this.input.disabled = true + this.disable(true) } this.input.addEventListener('change', e => { diff --git a/src/editors/multiselect.js b/src/editors/multiselect.js index a1bbd2594..dcbc25d2d 100644 --- a/src/editors/multiselect.js +++ b/src/editors/multiselect.js @@ -86,7 +86,9 @@ export class MultiSelectEditor extends AbstractEditor { this.control = this.theme.getFormControl(this.label, this.input, this.description, this.infoButton) } - if (this.schema.readOnly || this.schema.readonly) this.disable(true) + if (this.schema.readOnly || this.schema.readonly) { + this.disable(true) + } this.container.appendChild(this.control) diff --git a/src/editors/radio.js b/src/editors/radio.js index 719bd268d..a4175d0b3 100644 --- a/src/editors/radio.js +++ b/src/editors/radio.js @@ -46,11 +46,7 @@ export class RadioEditor extends SelectEditor { } if (this.schema.readOnly || this.schema.readonly) { - this.always_disabled = true - for (let j = 0; j < this.radioGroup.length; j++) { - this.radioGroup[j].disabled = true - } - this.radioContainer.classList.add('readonly') + this.disable(true) } const radioContainerWrapper = this.theme.getContainer() diff --git a/src/editors/select.js b/src/editors/select.js index 555170a1d..f720e44ba 100644 --- a/src/editors/select.js +++ b/src/editors/select.js @@ -170,8 +170,7 @@ export class SelectEditor extends AbstractEditor { this.theme.setSelectOptions(this.input, this.enum_options, this.enum_display) if (this.schema.readOnly || this.schema.readonly) { - this.always_disabled = true - this.input.disabled = true + this.disable(true) } /* Set custom attributes on input element. Parameter is array of protected keys. Empty array if none. */ @@ -330,8 +329,8 @@ export class SelectEditor extends AbstractEditor { enable () { if (!this.always_disabled) { this.input.disabled = false + super.enable() } - super.enable() } disable (alwaysDisabled) { diff --git a/src/editors/signature.js b/src/editors/signature.js index 437fc1657..562f5ee87 100644 --- a/src/editors/signature.js +++ b/src/editors/signature.js @@ -53,7 +53,8 @@ export class SignatureEditor extends StringEditor { if (this.options.compact) this.container.setAttribute('class', `${this.container.getAttribute('class')} compact`) if (this.schema.readOnly || this.schema.readonly) { - this.always_disabled = true + this.disable(true) + Array.from(this.inputs).forEach(input => { canvas.setAttribute('readOnly', 'readOnly') input.disabled = true diff --git a/src/editors/starrating.js b/src/editors/starrating.js index 89e38de1d..aff155229 100644 --- a/src/editors/starrating.js +++ b/src/editors/starrating.js @@ -59,11 +59,7 @@ export class StarratingEditor extends StringEditor { } if (this.schema.readOnly || this.schema.readonly) { - this.always_disabled = true - for (let j = 0; j < this.radioGroup.length; j++) { - this.radioGroup[j].disabled = true - } - this.ratingContainer.classList.add('readonly') + this.disable(true) } const ratingsContainerWrapper = this.theme.getContainer() @@ -83,7 +79,7 @@ export class StarratingEditor extends StringEditor { this.radioGroup[i].disabled = false } this.ratingContainer.classList.remove('readonly') - super.enable() + this.disabled = false } } @@ -93,7 +89,7 @@ export class StarratingEditor extends StringEditor { this.radioGroup[i].disabled = true } this.ratingContainer.classList.add('readonly') - super.disable() + this.disabled = true } destroy () { diff --git a/src/editors/string.js b/src/editors/string.js index 732807b03..06c03bda2 100644 --- a/src/editors/string.js +++ b/src/editors/string.js @@ -127,8 +127,7 @@ export class StringEditor extends AbstractEditor { } else if (this.options.input_width) this.input.style.width = this.options.input_width if (this.schema.readOnly || this.schema.readonly || this.schema.template) { - this.always_disabled = true - this.input.setAttribute('readonly', 'true') + this.disable(true) } /* Set custom attributes on input element. Parameter is array of protected keys. Empty array if none. */ @@ -301,6 +300,7 @@ export class StringEditor extends AbstractEditor { disable (alwaysDisabled) { if (alwaysDisabled) this.always_disabled = true this.input.disabled = true + this.input.setAttribute('readonly', 'true') super.disable() } diff --git a/src/editors/uuid.js b/src/editors/uuid.js index bbf35905c..2b56160c2 100644 --- a/src/editors/uuid.js +++ b/src/editors/uuid.js @@ -20,8 +20,7 @@ export class UuidEditor extends StringEditor { build () { super.build() /* Set field to readonly */ - this.always_disabled = true - this.input.setAttribute('readonly', 'true') + this.disable(true) } sanitize (value) {