diff --git a/packages/studio-ui-codegen-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap b/packages/studio-ui-codegen-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap index 029fc052e..22447c4d1 100644 --- a/packages/studio-ui-codegen-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap +++ b/packages/studio-ui-codegen-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap @@ -2481,11 +2481,11 @@ Object { import React from \\"react\\"; import { EscapeHatchProps, - Input, View, ViewProps, getOverrideProps, } from \\"@aws-amplify/ui-react\\"; +import Input from \\"./Input\\"; export type ParsedFixedValuesProps = React.PropsWithChildren< Partial & { diff --git a/packages/studio-ui-codegen-react/lib/__tests__/amplify-ui-renderers/__snapshots__/primitives.test.ts.snap b/packages/studio-ui-codegen-react/lib/__tests__/amplify-ui-renderers/__snapshots__/primitives.test.ts.snap index 0a56a7312..784daf084 100644 --- a/packages/studio-ui-codegen-react/lib/__tests__/amplify-ui-renderers/__snapshots__/primitives.test.ts.snap +++ b/packages/studio-ui-codegen-react/lib/__tests__/amplify-ui-renderers/__snapshots__/primitives.test.ts.snap @@ -26,8 +26,6 @@ exports[`Primitives Icon 1`] = `""`; -exports[`Primitives Input 1`] = `""`; - exports[`Primitives Label 1`] = `""`; exports[`Primitives Link 1`] = `""`; diff --git a/packages/studio-ui-codegen-react/lib/amplify-ui-renderers/amplify-renderer.ts b/packages/studio-ui-codegen-react/lib/amplify-ui-renderers/amplify-renderer.ts index 37e579fdb..a52f132a5 100644 --- a/packages/studio-ui-codegen-react/lib/amplify-ui-renderers/amplify-renderer.ts +++ b/packages/studio-ui-codegen-react/lib/amplify-ui-renderers/amplify-renderer.ts @@ -29,7 +29,6 @@ import { HeadingProps, IconProps, ImageProps, - InputProps, LabelProps, LinkProps, LoaderProps, @@ -147,13 +146,6 @@ export class AmplifyRenderer extends ReactStudioTemplateRenderer { case Primitive.Image: return new ReactComponentRenderer(component, this.importCollection, parent).renderElement(); - case Primitive.Input: - return new ReactComponentWithChildrenRenderer( - component, - this.importCollection, - parent, - ).renderElement(renderChildren); - case Primitive.Label: return new ReactComponentWithChildrenRenderer( component, diff --git a/packages/studio-ui-codegen-react/lib/primitive.ts b/packages/studio-ui-codegen-react/lib/primitive.ts index d9789909d..f2adc2cd1 100644 --- a/packages/studio-ui-codegen-react/lib/primitive.ts +++ b/packages/studio-ui-codegen-react/lib/primitive.ts @@ -29,7 +29,6 @@ enum Primitive { Heading = 'Heading', Icon = 'Icon', Image = 'Image', - Input = 'Input', Label = 'Label', Link = 'Link', Loader = 'Loader', diff --git a/packages/test-generator/integration-test-templates/cypress/integration/generated-components-spec.js b/packages/test-generator/integration-test-templates/cypress/integration/generated-components-spec.js index fd343fe5e..dc223200a 100644 --- a/packages/test-generator/integration-test-templates/cypress/integration/generated-components-spec.js +++ b/packages/test-generator/integration-test-templates/cypress/integration/generated-components-spec.js @@ -265,7 +265,6 @@ describe('Generated Components', () => { .should('equal', 'raw string value'); }); - // string and parsed number values are represented the same in HTML. Snapshot tests cover differences. it('String Number Value', () => { cy.visit('http://localhost:3000/component-tests'); cy.get('#parsed-fixed-values').find('#string-number-value').should('have.attr', 'value').should('equal', '67548'); @@ -273,10 +272,9 @@ describe('Generated Components', () => { it('Parsed Number Value', () => { cy.visit('http://localhost:3000/component-tests'); - cy.get('#parsed-fixed-values').find('#parsed-number-value').should('have.attr', 'value').should('equal', '67548'); + cy.get('#parsed-fixed-values').find('#parsed-number-value').get('.amplify-visually-hidden').contains('0.4'); }); - // string and parsed boolean values are represented the same in HTML. Snapshot tests cover differences. it('String Boolean Value', () => { cy.visit('http://localhost:3000/component-tests'); cy.get('#parsed-fixed-values').find('#string-boolean-value').should('have.attr', 'value').should('equal', 'true'); @@ -284,7 +282,7 @@ describe('Generated Components', () => { it('Parsed Boolean Value', () => { cy.visit('http://localhost:3000/component-tests'); - cy.get('#parsed-fixed-values').find('#parsed-boolean-value').should('have.attr', 'value').should('equal', 'true'); + cy.get('#parsed-fixed-values').find('#parsed-boolean-value').should('be.disabled'); }); it('String JSON Value', () => { @@ -297,10 +295,7 @@ describe('Generated Components', () => { it('Parsed JSON Value', () => { cy.visit('http://localhost:3000/component-tests'); - cy.get('#parsed-fixed-values') - .find('#parsed-json-value') - .should('have.attr', 'value') - .should('equal', '[object Object]'); // shows that object was parsed + cy.get('#parsed-fixed-values').find('#parsed-json-value').should('have.attr', 'viewBox', '0 0 24 24'); }); it('String Array Value', () => { @@ -313,8 +308,7 @@ describe('Generated Components', () => { it('Parsed Array Value', () => { cy.visit('http://localhost:3000/component-tests'); - // no brackets indicates array was parsed - cy.get('#parsed-fixed-values').find('#parsed-array-value').should('have.attr', 'value').should('equal', '1,2,3'); + cy.get('#parsed-fixed-values').find('#parsed-array-value').contains('123'); }); it('String Null Value', () => { @@ -324,7 +318,7 @@ describe('Generated Components', () => { it('Parsed Null Value', () => { cy.visit('http://localhost:3000/component-tests'); - cy.get('#parsed-fixed-values').find('#parsed-null-value').should('have.attr', 'value').should('be.empty'); + cy.get('#parsed-fixed-values').find('#parsed-null-value').should('have.text', ''); }); }); diff --git a/packages/test-generator/lib/components/parsedFixedValues.json b/packages/test-generator/lib/components/parsedFixedValues.json index fd17e27c4..150ad3f53 100644 --- a/packages/test-generator/lib/components/parsedFixedValues.json +++ b/packages/test-generator/lib/components/parsedFixedValues.json @@ -9,126 +9,153 @@ }, "children": [ { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "string-value" }, + "label": { + "value": "String" + }, "value": { "value": "raw string value" } } }, { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "string-number-value" }, + "label": { + "value": "String Number" + }, "value": { "value": "67548" } } }, { - "componentType": "Input", + "componentType": "Rating", "properties": { "id": { "value": "parsed-number-value" }, "value": { - "value": "67548", + "value": "0.4", "type": "Number" } } }, { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "string-boolean-value" }, + "label": { + "value": "String Boolean" + }, "value": { "value": "true" } } }, { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "parsed-boolean-value" }, - "value": { + "label": { + "value": "Parsed Boolean" + }, + "isDisabled": { "value": "true", "type": "Boolean" } } }, { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "string-json-value" }, + "label": { + "value": "String JSON" + }, "value": { "value": "{\"foo\": \"bar\"}" } } }, { - "componentType": "Input", + "componentType": "Icon", "properties": { "id": { "value": "parsed-json-value" }, - "value": { - "value": "{\"foo\": \"bar\"}", + "viewBox": { + "value": "{\"width\": 24, \"height\": 24}", "type": "Object" + }, + "pathData": { + "value": "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" + }, + "ariaLabel": { + "value": "Favorite" } } }, { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "string-array-value" }, + "label": { + "value": "String Array" + }, "value": { "value": "[1,2,3]" } } }, { - "componentType": "Input", + "componentType": "Badge", "properties": { "id": { "value": "parsed-array-value" }, - "value": { + "label": { "value": "[1,2,3]", "type": "Object" } } }, { - "componentType": "Input", + "componentType": "TextField", "properties": { "id": { "value": "string-null-value" }, + "label": { + "value": "String null" + }, "value": { "value": "null" } } }, { - "componentType": "Input", + "componentType": "Badge", "properties": { "id": { "value": "parsed-null-value" }, - "value": { + "label": { "value": "null", "type": "Object" }