From abedcd45ca5e5091215f3c687ee98b3a461c998e Mon Sep 17 00:00:00 2001 From: Alexandre Anicio Date: Thu, 12 Dec 2024 12:41:13 -0300 Subject: [PATCH] BA: improve relay mocks --- .../.storybook/decorators/withProviders.tsx | 12 ++----- packages/components/CHANGELOG.md | 10 +++++- .../AccountPopover/__storybook__/stories.tsx | 2 +- packages/components/package.json | 2 +- packages/graphql/CHANGELOG.md | 6 ++++ packages/graphql/package.json | 2 +- .../utils/createTestEnvironment/index.ts | 32 +++++++++++++++---- .../utils/createTestEnvironment/types.ts | 4 +++ packages/wagtail/CHANGELOG.md | 7 ++++ packages/wagtail/package.json | 2 +- 10 files changed, 58 insertions(+), 21 deletions(-) diff --git a/packages/components/.storybook/decorators/withProviders.tsx b/packages/components/.storybook/decorators/withProviders.tsx index 36914f44..05e24f08 100644 --- a/packages/components/.storybook/decorators/withProviders.tsx +++ b/packages/components/.storybook/decorators/withProviders.tsx @@ -17,21 +17,15 @@ const withProviders = (Story: StoryFn, context: StoryContext) => { // TODO: registering a few tailwind classess (used by @baseapp-frontend/design-system components), need to figure out why the @baseapp-frontend/components storybook are not including it correctly // pb-3 px-3 w-full rounded-md bg-background-neutral px-2 py-1 const relayMockEnvironment = createTestEnvironment() - const { environment, queueOperationResolver, resolveMostRecentOperation } = relayMockEnvironment + const { environment, queueOperationResolver } = relayMockEnvironment context.parameters.relayMockEnvironment = relayMockEnvironment + const queryName = context.parameters.queryName || undefined const mockResolvers = context.parameters.mockResolvers || undefined const mockData = context.parameters.mockData || {} - useEffect(() => { - if (!!mockResolvers) { - queueOperationResolver(mockResolvers) - } - if (mockData) { - resolveMostRecentOperation({ mockResolvers, data: mockData }) - } - }, [mockData, resolveMostRecentOperation, queueOperationResolver, mockResolvers]) + queueOperationResolver({ mockResolvers, data: mockData, queryName }) return ( diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 20140d78..b1247691 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -1,10 +1,18 @@ # @baseapp-frontend/components +## 0.0.30 + +### Patch Changes + +- Adapt Storybook's withProviders to use only `queueOperationResolver`. +- Updated dependencies + - @baseapp-frontend/graphql@1.1.13 + ## 0.0.29 ### Patch Changes -- Fixed RoomListSubscription connection and added connection to CreateChatRoom mutation +- Fixed RoomListSubscription connection and added connection to CreateChatRoom mutation - Moved useRoomListSubscription hook to ChatRoom on baseapp-frontend-template - Removed unused fields on RoomsListFragment and RoomListSubscription diff --git a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__storybook__/stories.tsx b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__storybook__/stories.tsx index 3f848677..8aae54ba 100644 --- a/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__storybook__/stories.tsx +++ b/packages/components/modules/navigations/Header/AccountMenu/AccountPopover/__storybook__/stories.tsx @@ -34,7 +34,7 @@ export default { typeof createTestEnvironment > - queueOperationResolver(mockResolvers) + queueOperationResolver({ mockResolvers }) return }, diff --git a/packages/components/package.json b/packages/components/package.json index 8e8d19f3..7d39887c 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,7 +1,7 @@ { "name": "@baseapp-frontend/components", "description": "BaseApp components modules such as comments, notifications, messages, and more.", - "version": "0.0.29", + "version": "0.0.30", "main": "./index.ts", "types": "dist/index.d.ts", "sideEffects": false, diff --git a/packages/graphql/CHANGELOG.md b/packages/graphql/CHANGELOG.md index 1dcf6213..737cf7fb 100644 --- a/packages/graphql/CHANGELOG.md +++ b/packages/graphql/CHANGELOG.md @@ -1,5 +1,11 @@ # @baseapp-frontend/graphql +## 1.1.13 + +### Patch Changes + +- Adapt `queueOperationResolver` to deal with resolvers or data mocks. + ## 1.1.12 ### Patch Changes diff --git a/packages/graphql/package.json b/packages/graphql/package.json index 36427102..c1d5355a 100644 --- a/packages/graphql/package.json +++ b/packages/graphql/package.json @@ -1,7 +1,7 @@ { "name": "@baseapp-frontend/graphql", "description": "GraphQL configurations and utilities", - "version": "1.1.12", + "version": "1.1.13", "main": "./index.ts", "types": "dist/index.d.ts", "sideEffects": false, diff --git a/packages/graphql/utils/createTestEnvironment/index.ts b/packages/graphql/utils/createTestEnvironment/index.ts index 8d28586b..79c9420c 100644 --- a/packages/graphql/utils/createTestEnvironment/index.ts +++ b/packages/graphql/utils/createTestEnvironment/index.ts @@ -1,7 +1,6 @@ import { MockPayloadGenerator, createMockEnvironment } from 'relay-test-utils' -import { MockResolvers } from 'relay-test-utils/lib/RelayMockPayloadGenerator' -import { ResolveMostRecentOperationParams } from './types' +import { QueueOperationResolverParams, ResolveMostRecentOperationParams } from './types' const createTestEnvironment = () => { const environment = createMockEnvironment() @@ -33,12 +32,31 @@ const createTestEnvironment = () => { } } - const queueOperationResolver = (mockResolvers: MockResolvers) => { + const queueOperationResolver = ({ + mockResolvers, + data, + queryName, + }: QueueOperationResolverParams) => { try { - environment.mock.queueOperationResolver((operation) => { - // eslint-disable-next-line no-console - console.log(`react-relay mock: ${operation.request.node.operation.name}`) - return MockPayloadGenerator.generate(operation, mockResolvers) + console.log('queueOperationResolver', mockResolvers, data, queryName) + environment.mock.queueOperationResolver((operationToResolve) => { + console.log('AOPS', operationToResolve) + if (mockResolvers) { + console.log('mockResolvers', mockResolvers) + + return MockPayloadGenerator.generate(operationToResolve, mockResolvers) + } + + // return the data mock if no queryName is provided + if (data && !queryName) return data + + // return the data mock if the queryName is provided and the operation matches + if (queryName && operationToResolve.fragment.node.name === queryName) { + return data + } + + console.warn('The operation was not mocked.') + return null }) } catch (e) { // eslint-disable-next-line no-console diff --git a/packages/graphql/utils/createTestEnvironment/types.ts b/packages/graphql/utils/createTestEnvironment/types.ts index 3995bdc2..be6adda9 100644 --- a/packages/graphql/utils/createTestEnvironment/types.ts +++ b/packages/graphql/utils/createTestEnvironment/types.ts @@ -3,11 +3,15 @@ import type { MockPayloadGenerator } from 'relay-test-utils' type MockResolvers = { mockResolvers: MockPayloadGenerator.MockResolvers data?: never + queryName?: string } type Data = { data: any mockResolvers?: never + queryName?: string } export type ResolveMostRecentOperationParams = MockResolvers | Data + +export type QueueOperationResolverParams = MockResolvers | Data diff --git a/packages/wagtail/CHANGELOG.md b/packages/wagtail/CHANGELOG.md index b5b63a3e..9b9697fc 100644 --- a/packages/wagtail/CHANGELOG.md +++ b/packages/wagtail/CHANGELOG.md @@ -1,5 +1,12 @@ # @baseapp-frontend/wagtail +## 1.0.6 + +### Patch Changes + +- Updated dependencies + - @baseapp-frontend/graphql@1.1.13 + ## 1.0.5 ### Patch Changes diff --git a/packages/wagtail/package.json b/packages/wagtail/package.json index 7d21f655..28955249 100644 --- a/packages/wagtail/package.json +++ b/packages/wagtail/package.json @@ -1,7 +1,7 @@ { "name": "@baseapp-frontend/wagtail", "description": "BaseApp Wagtail", - "version": "1.0.5", + "version": "1.0.6", "main": "./index.ts", "types": "dist/index.d.ts", "sideEffects": false,