Skip to content

Commit 326b579

Browse files
scottyoungScott Young
andauthored
fix: clear button on create form should reset select field (#939)
* fix: clear button on create form should reset select field * fix: update form tests --------- Co-authored-by: Scott Young <[email protected]>
1 parent 1470068 commit 326b579

File tree

6 files changed

+51
-35
lines changed

6 files changed

+51
-35
lines changed

packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap

Lines changed: 17 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2322,7 +2322,7 @@ export default function CustomDataForm(props) {
23222322
const initialValues = {
23232323
name: \\"John Doe\\",
23242324
email: \\"[email protected]\\",
2325-
city: undefined,
2325+
city: \\"\\",
23262326
category: undefined,
23272327
pages: 0,
23282328
phone: \\"+1-401-152-6995\\",
@@ -2719,7 +2719,7 @@ export default function CustomDataForm(props) {
27192719
const initialValues = {
27202720
name: \\"John Doe\\",
27212721
email: \\"[email protected]\\",
2722-
city: undefined,
2722+
city: \\"\\",
27232723
category: undefined,
27242724
pages: 0,
27252725
phone: \\"+1-401-152-6995\\",
@@ -3625,7 +3625,7 @@ export default function CustomDataForm(props) {
36253625
name: \\"John Doe\\",
36263626
email: \\"[email protected]\\",
36273627
\\"metadata-field\\": \\"\\",
3628-
city: undefined,
3628+
city: \\"\\",
36293629
category: undefined,
36303630
pages: 0,
36313631
};
@@ -8201,7 +8201,7 @@ export default function NestedJson(props) {
82018201
props;
82028202
const initialValues = {
82038203
firstName: \\"\\",
8204-
\\"last-Name\\": undefined,
8204+
\\"last-Name\\": \\"\\",
82058205
lastName: [],
82068206
bio: {},
82078207
};
@@ -12748,15 +12748,14 @@ export default function TagCreateForm(props) {
1274812748
setCurrentPostsValue(undefined);
1274912749
setCurrentPostsDisplayValue(\\"\\");
1275012750
setStatuses(initialValues.statuses);
12751-
setCurrentStatusesValue(undefined);
12751+
setCurrentStatusesValue(\\"\\");
1275212752
setErrors({});
1275312753
};
1275412754
const [currentPostsDisplayValue, setCurrentPostsDisplayValue] =
1275512755
React.useState(\\"\\");
1275612756
const [currentPostsValue, setCurrentPostsValue] = React.useState(undefined);
1275712757
const PostsRef = React.createRef();
12758-
const [currentStatusesValue, setCurrentStatusesValue] =
12759-
React.useState(undefined);
12758+
const [currentStatusesValue, setCurrentStatusesValue] = React.useState(\\"\\");
1276012759
const statusesRef = React.createRef();
1276112760
const getIDValue = {
1276212761
Posts: (r) => JSON.stringify({ id: r?.id }),
@@ -12997,7 +12996,7 @@ export default function TagCreateForm(props) {
1299712996
values = result?.statuses ?? values;
1299812997
}
1299912998
setStatuses(values);
13000-
setCurrentStatusesValue(undefined);
12999+
setCurrentStatusesValue(\\"\\");
1300113000
}}
1300213001
currentFieldValue={currentStatusesValue}
1300313002
label={\\"Statuses\\"}
@@ -13007,7 +13006,7 @@ export default function TagCreateForm(props) {
1300713006
getBadgeText={getDisplayValue.statuses}
1300813007
setFieldValue={setCurrentStatusesValue}
1300913008
inputFieldRef={statusesRef}
13010-
defaultFieldValue={undefined}
13009+
defaultFieldValue={\\"\\"}
1301113010
>
1301213011
<SelectField
1301313012
label=\\"Statuses\\"
@@ -14902,15 +14901,14 @@ export default function TagCreateForm(props) {
1490214901
setCurrentPostsValue(undefined);
1490314902
setCurrentPostsDisplayValue(\\"\\");
1490414903
setStatuses(initialValues.statuses);
14905-
setCurrentStatusesValue(undefined);
14904+
setCurrentStatusesValue(\\"\\");
1490614905
setErrors({});
1490714906
};
1490814907
const [currentPostsDisplayValue, setCurrentPostsDisplayValue] =
1490914908
React.useState(\\"\\");
1491014909
const [currentPostsValue, setCurrentPostsValue] = React.useState(undefined);
1491114910
const PostsRef = React.createRef();
14912-
const [currentStatusesValue, setCurrentStatusesValue] =
14913-
React.useState(undefined);
14911+
const [currentStatusesValue, setCurrentStatusesValue] = React.useState(\\"\\");
1491414912
const statusesRef = React.createRef();
1491514913
const getIDValue = {
1491614914
Posts: (r) => JSON.stringify({ id: r?.id }),
@@ -15151,7 +15149,7 @@ export default function TagCreateForm(props) {
1515115149
values = result?.statuses ?? values;
1515215150
}
1515315151
setStatuses(values);
15154-
setCurrentStatusesValue(undefined);
15152+
setCurrentStatusesValue(\\"\\");
1515515153
}}
1515615154
currentFieldValue={currentStatusesValue}
1515715155
label={\\"Statuses\\"}
@@ -15161,7 +15159,7 @@ export default function TagCreateForm(props) {
1516115159
getBadgeText={getDisplayValue.statuses}
1516215160
setFieldValue={setCurrentStatusesValue}
1516315161
inputFieldRef={statusesRef}
15164-
defaultFieldValue={undefined}
15162+
defaultFieldValue={\\"\\"}
1516515163
>
1516615164
<SelectField
1516715165
label=\\"Statuses\\"
@@ -18019,7 +18017,7 @@ export default function TagUpdateForm(props) {
1801918017
setCurrentPostsValue(undefined);
1802018018
setCurrentPostsDisplayValue(\\"\\");
1802118019
setStatuses(cleanValues.statuses ?? []);
18022-
setCurrentStatusesValue(undefined);
18020+
setCurrentStatusesValue(\\"\\");
1802318021
setErrors({});
1802418022
};
1802518023
const [tagRecord, setTagRecord] = React.useState(tag);
@@ -18047,8 +18045,7 @@ export default function TagUpdateForm(props) {
1804718045
React.useState(\\"\\");
1804818046
const [currentPostsValue, setCurrentPostsValue] = React.useState(undefined);
1804918047
const PostsRef = React.createRef();
18050-
const [currentStatusesValue, setCurrentStatusesValue] =
18051-
React.useState(undefined);
18048+
const [currentStatusesValue, setCurrentStatusesValue] = React.useState(\\"\\");
1805218049
const statusesRef = React.createRef();
1805318050
const getIDValue = {
1805418051
Posts: (r) => JSON.stringify({ id: r?.id }),
@@ -18342,7 +18339,7 @@ export default function TagUpdateForm(props) {
1834218339
values = result?.statuses ?? values;
1834318340
}
1834418341
setStatuses(values);
18345-
setCurrentStatusesValue(undefined);
18342+
setCurrentStatusesValue(\\"\\");
1834618343
}}
1834718344
currentFieldValue={currentStatusesValue}
1834818345
label={\\"Statuses\\"}
@@ -18352,7 +18349,7 @@ export default function TagUpdateForm(props) {
1835218349
getBadgeText={getDisplayValue.statuses}
1835318350
setFieldValue={setCurrentStatusesValue}
1835418351
inputFieldRef={statusesRef}
18355-
defaultFieldValue={undefined}
18352+
defaultFieldValue={\\"\\"}
1835618353
>
1835718354
<SelectField
1835818355
label=\\"Statuses\\"
@@ -22291,7 +22288,7 @@ export default function PostCreateFormRow(props) {
2229122288
caption: \\"\\",
2229222289
post_url: \\"\\",
2229322290
profile_url: \\"\\",
22294-
status: undefined,
22291+
status: \\"\\",
2229522292
metadata: \\"\\",
2229622293
nonModelField: \\"\\",
2229722294
nonModelFieldArray: [],

packages/codegen-ui-react/lib/forms/form-renderer-helper/form-state.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,7 @@ export const getDefaultValueExpression = (
154154
CheckboxField: factory.createFalse(),
155155
TextField: factory.createStringLiteral(''),
156156
TextAreaField: factory.createStringLiteral(''),
157+
SelectField: factory.createStringLiteral(''),
157158
};
158159

159160
if (defaultValue) {

packages/test-generator/integration-test-templates/cypress/e2e/form/CustomDog-spec.cy.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,8 +47,12 @@ describe('FormTests - CustomDog', () => {
4747
getInputByLabel('Email').type('[email protected]');
4848
cy.contains(ErrorMessageMap.validEmail).should('not.exist');
4949

50+
cy.get('select').select('Green').should('have.value', 'Green');
51+
5052
cy.contains('Clear').click();
5153

54+
cy.get('select').should('have.value', '');
55+
5256
// validates on blur & extends with onValidate prop
5357
getInputByLabel('Name').type('S');
5458
blurField();
@@ -74,13 +78,15 @@ describe('FormTests - CustomDog', () => {
7478
blurField();
7579
getInputByLabel('IP Address').type('192.0.2.146');
7680
blurField();
81+
cy.get('select').select('Blue');
7782
typeInAutocomplete('Ret{downArrow}{enter}');
7883
cy.contains('Submit').click();
7984
cy.contains('submitted: true');
8085
cy.contains('name: Spot');
8186
cy.contains('age: 3');
8287
cy.contains('email: [email protected]');
8388
cy.contains('ip: 192.0.2.146');
89+
cy.contains('color: Blue');
8490
cy.contains('Retriever');
8591
});
8692
});

packages/test-generator/integration-test-templates/cypress/e2e/form/DSAllSupportedFormFields-spec.cy.ts

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -443,22 +443,22 @@ describe('FormTests - DSAllSupportedFormFields', () => {
443443
const record = JSON.parse(recordElement.text());
444444

445445
expect(record.stringArray).to.deep.equal([]);
446-
expect('int' in record).to.equal(false);
447-
expect('float' in record).to.equal(false);
448-
expect('awsDate' in record).to.equal(false);
449-
expect('awsTime' in record).to.equal(false);
450-
expect('awsDateTime' in record).to.equal(false);
451-
expect('awsTimestamp' in record).to.equal(false);
452-
expect('awsEmail' in record).to.equal(false);
453-
expect('awsUrl' in record).to.equal(false);
454-
expect('awsIPAddress' in record).to.equal(false);
455-
expect('awsJson' in record).to.equal(false);
456-
expect('awsPhone' in record).to.equal(false);
457-
expect('enum' in record).to.equal(false);
458-
expect('nonModelField' in record).to.equal(false);
446+
expect(record.int).to.equal(null);
447+
expect(record.float).to.equal(null);
448+
expect(record.awsDate).to.equal(null);
449+
expect(record.awsTime).to.equal(null);
450+
expect(record.awsDateTime).to.equal(null);
451+
expect(record.awsTimestamp).to.equal(null);
452+
expect(record.awsEmail).to.equal(null);
453+
expect(record.awsUrl).to.equal(null);
454+
expect(record.awsIPAddress).to.equal(null);
455+
expect(record.awsJson).to.equal(null);
456+
expect(record.awsPhone).to.equal(null);
457+
expect(record.enum).to.equal(null);
458+
expect(record.nonModelField).to.equal(null);
459459
expect(record.nonModelFieldArray).to.deep.equal([]);
460-
expect('HasOneUser' in record).to.equal(false);
461-
expect('BelongsToOwner' in record).to.equal(false);
460+
expect(record.HasOneUser).to.equal(undefined);
461+
expect(record.BelongsToOwner).to.equal(undefined);
462462
expect(record.HasManyStudents).to.deep.equal([]);
463463
expect(record.ManyToManyTags).to.deep.equal([]);
464464
});

packages/test-generator/integration-test-templates/src/FormTests/CustomDog.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@ export default function () {
4545
<Text>{`email: ${customFormCreateDogResults.email}`}</Text>
4646
<Text>{`ip: ${customFormCreateDogResults.ip}`}</Text>
4747
<Text>{`ip: ${customFormCreateDogResults.breed}`}</Text>
48+
<Text>{`color: ${customFormCreateDogResults.color}`}</Text>
4849
</View>
4950
</AmplifyProvider>
5051
);

packages/test-generator/lib/forms/custom-form-create-dog.json

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,17 @@
5454
},
5555
"required": false
5656
}
57+
},
58+
"color": {
59+
"label": "Color",
60+
"inputType": {
61+
"type": "SelectField",
62+
"bindingProperties": {},
63+
"valueMappings": {
64+
"bindingProperties": {},
65+
"values": [{"value": {"value": "Red"}}, {"value": {"value": "Blue"}}, {"value": {"value": "Green"}}]
66+
}
67+
}
5768
}
5869
},
5970
"sectionalElements": {

0 commit comments

Comments
 (0)