diff --git a/packages/signals/signals-integration-tests/src/helpers/playwright-utils.ts b/packages/signals/signals-integration-tests/src/helpers/playwright-utils.ts index d8335fd77..f06bb8333 100644 --- a/packages/signals/signals-integration-tests/src/helpers/playwright-utils.ts +++ b/packages/signals/signals-integration-tests/src/helpers/playwright-utils.ts @@ -19,7 +19,7 @@ export function waitForCondition( resolve() } else if (Date.now() - startTime >= timeout) { clearInterval(interval) - reject(new Error(errorMessage)) + reject(new Error(`${errorMessage}. Timeout: ${timeout}ms`)) } } catch (error) { clearInterval(interval) diff --git a/packages/signals/signals-integration-tests/src/tests/custom-elements/components/App.tsx b/packages/signals/signals-integration-tests/src/tests/custom-elements/components/App.tsx index b5c90f26c..0f736a132 100644 --- a/packages/signals/signals-integration-tests/src/tests/custom-elements/components/App.tsx +++ b/packages/signals/signals-integration-tests/src/tests/custom-elements/components/App.tsx @@ -5,11 +5,11 @@ import { Select, SelectItem } from './Select' export const App: React.FC = () => { return (
-
+

TextField

-
+

Select

- );
) } diff --git a/packages/signals/signals-integration-tests/src/tests/custom-elements/custom-select.test.ts b/packages/signals/signals-integration-tests/src/tests/custom-elements/custom-select.test.ts index b2a8b3a32..9851eb719 100644 --- a/packages/signals/signals-integration-tests/src/tests/custom-elements/custom-select.test.ts +++ b/packages/signals/signals-integration-tests/src/tests/custom-elements/custom-select.test.ts @@ -1,6 +1,7 @@ import { test, expect } from '@playwright/test' import { waitForCondition } from '../../helpers/playwright-utils' import { IndexPage } from './index-page' +import type { SegmentEvent } from '@segment/analytics-next' const basicEdgeFn = `const processSignal = (signal) => {}` @@ -9,33 +10,28 @@ test('Collecting signals whenever a user selects an item', async ({ page }) => { disableSignalsRedaction: true, enableSignalsIngestion: true, }) - const fillAndConfirm = async (selector: string, text: string) => { - await page.getByTestId(selector).fill(text) - await page.getByTestId(selector).press('Enter') + + const filterClick = (e: SegmentEvent): boolean => { + return ( + e.properties!.data.eventType === 'click' && + e.properties!.data.target.textContent?.includes('Mint') + ) } - await Promise.all([ - fillAndConfirm('aria-text-field', 'John Doe'), - waitForCondition( - () => indexPage.signalsAPI.getEvents('interaction').length > 0, - { errorMessage: 'No interaction signals found' } - ), - ]) - const interactionSignals = indexPage.signalsAPI.getEvents('interaction') - const data = expect.objectContaining({ - eventType: 'change', - listener: 'mutation', - change: { - value: 'John Doe', + const waitForInteraction = waitForCondition( + () => { + const events = indexPage.signalsAPI.getEvents('interaction') + return events.some(filterClick) }, - target: expect.objectContaining({ - attributes: expect.objectContaining({ - type: 'text', - value: 'John Doe', - }), - tagName: 'INPUT', - value: 'John Doe', - }), - }) - expect(interactionSignals[0].properties!.data).toMatchObject(data) + { errorMessage: 'No interaction signals found' } + ) + await page.click('#select button') + await page.getByRole('option', { name: 'Mint' }).click() + + await waitForInteraction + const signals = indexPage.signalsAPI + .getEvents('interaction') + .filter(filterClick) + + expect(signals).toHaveLength(1) })