chore: Sync examples changes (#213)

Author: avinashbot

jest.config.e2e.js

@@ -0,0 +1,11 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: MIT-0
+
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'node',
+  testMatch: ['<rootDir>/test/**/*.test.ts'],
+  setupFilesAfterEnv: ['./setupJest.js'],
+  globalSetup: './start-chromedriver.js',
+  globalTeardown: './stop-chromedriver.js',
+};

jest.config.unit.js

@@ -0,0 +1,11 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: MIT-0
+/** @type {import('jest').Config} */
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  testMatch: ['<rootDir>/src/**/__tests__/**/*.test.ts'],
+  collectCoverage: true,
+  // For cloudscape-design/demos, where all unit tests are excluded
+  passWithNoTests: true,
+};

package-lock.json

@@ -13,10 +13,11 @@
     "start": "npm run start:theme",
     "start:theme": "cross-env NODE_ENV=development THEME=$npm_config_theme webpack-dev-server",
     "serve": "node ./scripts/dev-server.js",
-    "jest": "node --experimental-vm-modules ./node_modules/.bin/jest ./test/**/*.test.ts",
+    "jest": "node --experimental-vm-modules ./node_modules/.bin/jest -c jest.config.e2e.js",
     "serve-test": "run-p -r serve jest",
     "pretest": "npm-run-all -s clean lint typecheck build",
     "test": "npm run test-no-build",
+    "test:unit": "node --experimental-vm-modules ./node_modules/.bin/jest -c jest.config.unit.js",
     "test-no-build": "run-s test:*",
     "test:default": "cross-env ALWAYS_VISUAL_REFRESH=true npm run serve-test"
   },
@@ -78,7 +79,7 @@
     "webpack": "^5.98.0",
     "webpack-cli": "^6.0.1",
     "webpack-dev-server": "^5.2.1",
-    "zod": "^3.23.8"
+    "zod": "^4.0.16"
   },
   "browserslist": [
     "last 3 Chrome major versions",

package.json

@@ -7,25 +7,17 @@ import { PropertyFilterQuery } from '@cloudscape-design/collection-hooks';
 const PropertyFilterOperation = z.enum(['and', 'or']);
 
 const propertyFilterTokenSchema = z.object({
-  // There's no other way to enforce this value as required. Using z.any() allows it to be optional, which breaks our types
-  value: z.object({}).passthrough().or(z.array(z.any())).or(z.string()).or(z.number()).or(z.boolean()),
+  value: z.any(),
   propertyKey: z.string().optional(),
   operator: z.string(),
 });
 
-const propertyFilterQueryBaseSchema = z.object({
+const propertyFilterQuerySchema = z.object({
   tokens: z.array(propertyFilterTokenSchema),
   operation: PropertyFilterOperation,
-});
-
-// workaround to validate recursive types: https://zod.dev/?id=recursive-types
-// fyi: same problem in yup and valibot
-type PropertyFilterQuerySchemaType = z.infer<typeof propertyFilterQueryBaseSchema> & {
-  tokenGroups?: PropertyFilterQuery['tokenGroups'];
-};
-
-const propertyFilterQuerySchema: z.ZodType<PropertyFilterQuerySchemaType> = propertyFilterQueryBaseSchema.extend({
-  tokenGroups: z.lazy(() => z.array(z.union([propertyFilterTokenSchema, propertyFilterQuerySchema])).optional()),
+  get tokenGroups() {
+    return z.array(z.union([propertyFilterTokenSchema, propertyFilterQuerySchema])).optional();
+  },
 });
 
 export const parsePropertyFilterQuery = (stringifiedPropertyFilter: string): PropertyFilterQuery => {

src/common/parse-property-filter.ts

@@ -186,6 +186,7 @@ export default function Chat() {
 
       <FittedContainer>
         <Container
+          data-testid="chat-container"
           header={<Header variant="h3">Generative AI chat</Header>}
           fitHeight
           disableContentPaddings

src/pages/chat/chat.tsx

@@ -14,7 +14,7 @@ export default class Page extends AppLayoutPage {
   }
   async openAdditionalTools() {
     await this.scrollIntoViewAndClick(
-      page.findContainer().findFooter().findExpandableSection().findHeader().toSelector(),
+      page.findContainer().findFooter().findExpandableSection().findExpandButton().toSelector(),
     );
   }
   async openMainInfoLink() {

test/e2e/page/edit-form-page-object.ts

@@ -11,18 +11,18 @@ function expandableSectionItems(index: number) {
   return page.findSideNavigation().findItemByIndex(index).findItems().toSelector();
 }
 
-function formExpandableSectionHeader(id: string) {
-  return page.findContainer(id).findFooter().findExpandableSection().findHeader().toSelector();
+function formExpandableSectionExpandButton(id: string) {
+  return page.findContainer(id).findFooter().findExpandableSection().findExpandButton().toSelector();
 }
 function formExpandableSection(id: string) {
   return page.findContainer(id).findFooter().findExpandableSection().findContent().toSelector();
 }
 export default class Page extends FormPage {
   async expandChangeBehaviorPanel() {
-    await this.scrollIntoViewAndClick(formExpandableSectionHeader('#cache-behavior-panel'));
+    await this.scrollIntoViewAndClick(formExpandableSectionExpandButton('#cache-behavior-panel'));
   }
   async expandDistributionPanel() {
-    await this.scrollIntoViewAndClick(formExpandableSectionHeader('#distribution-panel'));
+    await this.scrollIntoViewAndClick(formExpandableSectionExpandButton('#distribution-panel'));
   }
   isExpandChangeBehaviorContentVisible() {
     return this.isDisplayed(formExpandableSection('#cache-behavior-panel'));