Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FIO-7847: Highlight components that have API keys consisting only fro… #5522

Open
wants to merge 8 commits into
base: master
Choose a base branch
from
8 changes: 8 additions & 0 deletions src/WebformBuilder.js
Original file line number Diff line number Diff line change
Expand Up @@ -1265,6 +1265,7 @@ export default class WebformBuilder extends Component {
highlightInvalidComponents() {
const repeatablePaths = this.findRepeatablePaths();
let hasInvalidComponents = false;
const badCharacters = /^[^A-Za-z_]+|[^A-Za-z0-9\-._]+/g;
alexandraRamanenka marked this conversation as resolved.
Show resolved Hide resolved

this.webform.everyComponent((comp) => {
const path = comp.path;
Expand All @@ -1275,6 +1276,13 @@ export default class WebformBuilder extends Component {
else if (comp.error?.message?.startsWith('API Key is not unique')) {
comp.setCustomValidity('');
}

if (comp.key.replace(badCharacters, '') === '') {
comp.setCustomValidity(`API Key is not valid: ${comp.key}`);
}
else if (comp.error?.message?.startsWith('API Key is not valid')) {
comp.setCustomValidity('');
}
});

this.emit('builderFormValidityChange', hasInvalidComponents);
Expand Down
11 changes: 11 additions & 0 deletions src/WebformBuilder.unit.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import Harness from '../test/harness';
import WebformBuilder from './WebformBuilder';
import Builders from './builders';
import { uniqueApiKeys, uniqueApiKeysLayout, uniqueApiKeysSameLevel, columnsForm, resourceKeyCamelCase } from '../test/formtest';
import formWithNumericKeys from '../test/forms/formWithNumericKeys';
import sameApiKeysLayoutComps from '../test/forms/sameApiKeysLayoutComps';
import testApiKeysUniquifying from '../test/forms/testApiKeysUniquifying';
import formBasedOnWizard from '../test/forms/formBasedOnWizard';
Expand Down Expand Up @@ -42,6 +43,16 @@ describe('WebformBuilder tests', function() {
}).catch(done);
});

it('Should show API error when components have invalid API keys', (done) => {
const builder = Harness.getBuilder();
builder.webform.setForm(formWithNumericKeys).then(() => {
builder.highlightInvalidComponents();
const component = builder.webform.components[1];
assert.equal(component.errors.length, 1);
done();
}).catch(done);
});

it('Should show unique API error when components inside and outside of the Layout component have same keys', (done) => {
const builder = Harness.getBuilder();
builder.webform.setForm(uniqueApiKeysLayout).then(() => {
Expand Down
30 changes: 30 additions & 0 deletions test/forms/formWithNumericKeys.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
export default {
type: 'form',
display: 'form',
components: [
{
label: 'Text Field',
applyMaskOn: 'change',
tableView: true,
key: 'test',
type: 'textfield',
input: true,
},
{
label: 'Text Field',
applyMaskOn: 'change',
tableView: true,
key: '1234',
type: 'textfield',
input: true,
},
{
type: 'button',
label: 'Submit',
key: 'submit',
disableOnInvalid: true,
input: true,
tableView: false,
},
],
};
2 changes: 1 addition & 1 deletion test/formtest/index.d.ts
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export { advanced, basic, data, defaults, layout, premium, settingErrors, clearOnHide, manualOverride, uniqueApiKeys, uniqueApiKeysLayout, uniqueApiKeysSameLevel, validationOnBlur, calculateValueWithManualOverride, calculateValueWithSubmissionMetadata, displayAsModalEditGrid, formWithAdvancedLogic, formWithPatternValidation, calculatedSelectboxes, columnsForm, calculateZeroValue, formWithConditionalLogic, formWithCalculatedValueWithoutOverriding, formWithTimeComponent, formWithEditGridModalDrafts, formWithBlurValidationInsidePanel, modalEditComponents, calculatedNotPersistentValue, calculateValueInEditingMode, initiallyCollapsedPanel, multipleTextareaInsideConditionalComponent, formComponentWithConditionalRenderingForm, disabledNestedForm, propertyActions, formWithEditGridAndNestedDraftModalRow, formWithDateTimeComponents, formWithCollapsedPanel, formWithCustomFormatDate, wizardWithHiddenPanel, wizardWithSimpleConditionalPage, wizardWithTooltip, resourceKeyCamelCase, tooltipActivateCheckbox };
export { advanced, basic, data, defaults, layout, premium, settingErrors, clearOnHide, manualOverride, uniqueApiKeys, uniqueApiKeysLayout, uniqueApiKeysSameLevel, validationOnBlur, calculateValueWithManualOverride, calculateValueWithSubmissionMetadata, displayAsModalEditGrid, formWithAdvancedLogic, formWithPatternValidation, calculatedSelectboxes, columnsForm, calculateZeroValue, formWithConditionalLogic, formWithCalculatedValueWithoutOverriding, formWithTimeComponent, formWithEditGridModalDrafts, formWithBlurValidationInsidePanel, modalEditComponents, calculatedNotPersistentValue, calculateValueInEditingMode, initiallyCollapsedPanel, multipleTextareaInsideConditionalComponent, formComponentWithConditionalRenderingForm, disabledNestedForm, propertyActions, formWithEditGridAndNestedDraftModalRow, formWithDateTimeComponents, formWithCollapsedPanel, formWithCustomFormatDate, wizardWithHiddenPanel, wizardWithSimpleConditionalPage, wizardWithTooltip, resourceKeyCamelCase, formWithNumericKeys, tooltipActivateCheckbox };
2 changes: 1 addition & 1 deletion test/formtest/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,5 +87,5 @@ module.exports = {
wizardWithTooltip,
resourceKeyCamelCase,
tooltipActivateCheckbox,
formWithObjectValueSelect
formWithObjectValueSelect,
};
Loading