fix: add custom component test

README.md

@@ -70,7 +70,7 @@ cp -r amplify-codegen-ui-staging/packages/test-generator/test-app-templates/* te
 cd test-app
 # Install new dependencies required
 npm i aws-amplify @aws-amplify/ui-react@2.0.1-next.5
-npm i cypress --save-dev\
+npm i -D cypress
 # And in parallel start the webapp
 npm start
 # And either run cypress suite

packages/test-generator/lib/components/basic-components/basicComponentCustomRating.json

@@ -0,0 +1,10 @@
+{
+  "id": "1234-5678-9010",
+  "componentType": "Rating",
+  "name": "BasicComponentCustomRating",
+  "properties": {
+    "value": {
+      "value": "3.5"
+    }
+  }
+}

packages/test-generator/lib/components/basic-components/index.ts

@@ -22,3 +22,4 @@ export { default as BasicComponentDivider } from './basicComponentDivider.json';
 export { default as BasicComponentFlex } from './basicComponentFlex.json';
 export { default as BasicComponentImage } from './basicComponentImage.json';
 export { default as BasicComponentText } from './basicComponentText.json';
+export { default as BasicComponentCustomRating } from './basicComponentCustomRating.json';

packages/test-generator/test-app-templates/cypress/integration/generated-components-spec.js

@@ -50,6 +50,11 @@ describe('Generated Components', () => {
       cy.visit('http://localhost:3000');
       cy.get('#basic-components').contains('Basic Component Text');
     });
+
+    it('Renders Custom component', () => {
+      cy.visit('http://localhost:3000');
+      cy.get('#basic-components').find('.amplify-rating');
+    });
   });
 
   describe('Conditional Data', () => {

packages/test-generator/test-app-templates/src/App.tsx

@@ -29,6 +29,7 @@ import ComponentWithConditional from './ui-components/ComponentWithConditional';
 import BasicComponentDivider from './ui-components/BasicComponentDivider';
 import BasicComponentFlex from './ui-components/BasicComponentFlex';
 import BasicComponentImage from './ui-components/BasicComponentImage';
+import BasicComponentCustomRating from './ui-components/BasicComponentCustomRating';
 /* eslint-enable import/extensions */
 
 function App() {
@@ -46,6 +47,7 @@ function App() {
         <BasicComponentFlex />
         <BasicComponentText />
         <BasicComponentImage />
+        <BasicComponentCustomRating />
       </div>
       <ViewTest />
       <ViewWithButton />