diff --git a/.changeset/rotten-keys-applaud.md b/.changeset/rotten-keys-applaud.md new file mode 100644 index 000000000..31123cb26 --- /dev/null +++ b/.changeset/rotten-keys-applaud.md @@ -0,0 +1,7 @@ +--- +'@quilted/preact-testing': patch +'@quilted/quilt': patch +'@quilted/react-testing': patch +--- + +Fix React testing exports diff --git a/packages/preact-testing/source/matchers.ts b/packages/preact-testing/source/matchers.ts index 8a407cf61..aa1285ec9 100644 --- a/packages/preact-testing/source/matchers.ts +++ b/packages/preact-testing/source/matchers.ts @@ -1,47 +1,47 @@ -import type {ComponentType, Context as ReactContext} from 'preact'; +import type {ComponentType, Context} from 'preact'; import type {PropsFor} from './types.ts'; -import {toContainReactHTML, toHaveReactDataProps} from './matchers/dom.ts'; -import {toHaveReactProps} from './matchers/props.ts'; +import {toContainPreactHTML, toHavePreactDataProps} from './matchers/dom.ts'; +import {toHavePreactProps} from './matchers/props.ts'; import { - toContainReactComponent, - toContainReactComponentTimes, + toContainPreactComponent, + toContainPreactComponentTimes, } from './matchers/components.ts'; -import {toContainReactText} from './matchers/text.ts'; -import {toProvideReactContext} from './matchers/context.ts'; +import {toContainPreactText} from './matchers/text.ts'; +import {toProvidePreactContext} from './matchers/context.ts'; // @see https://vitest.dev/guide/extending-matchers.html export interface CustomMatchers { - toHaveReactProps(props: Record): void; - toContainReactComponent>( + toHavePreactProps(props: Record): void; + toContainPreactComponent>( type: Type, props?: Partial>, ): R; - toContainReactComponentTimes>( + toContainPreactComponentTimes>( type: Type, times: number, props?: Partial>, ): R; - toProvideReactContext(context: ReactContext, value?: Type): R; - toContainReactText(text: string): R; + toProvidePreactContext(context: Context, value?: Type): R; + toContainPreactText(text: string): R; } export const matchers = { - toHaveReactProps, - toContainReactComponent, - toContainReactComponentTimes, - toProvideReactContext, - toContainReactText, + toHavePreactProps, + toContainPreactComponent, + toContainPreactComponentTimes, + toProvidePreactContext, + toContainPreactText, }; export interface CustomDOMMatchers { - toContainReactHTML(text: string): R; - toHaveReactDataProps(data: {[key: string]: string}): R; + toContainPreactHTML(text: string): R; + toHavePreactDataProps(data: {[key: string]: string}): R; } export const domMatchers = { - toContainReactHTML, - toHaveReactDataProps, + toContainPreactHTML, + toHavePreactDataProps, }; diff --git a/packages/preact-testing/source/matchers/components.ts b/packages/preact-testing/source/matchers/components.ts index de25cc80b..d4d2be7dc 100644 --- a/packages/preact-testing/source/matchers/components.ts +++ b/packages/preact-testing/source/matchers/components.ts @@ -17,7 +17,7 @@ import { printType, } from './utilities.ts'; -export function toContainReactComponent< +export function toContainPreactComponent< Type extends string | ComponentType, >( this: MatcherState, @@ -26,12 +26,12 @@ export function toContainReactComponent< props?: Partial>, ) { assertIsNode(node, { - expectation: 'toContainReactComponent', + expectation: 'toContainPreactComponent', isNot: this.isNot, }); assertIsType(type, { - expectation: 'toContainReactComponent', + expectation: 'toContainPreactComponent', isNot: this.isNot, }); @@ -49,8 +49,8 @@ export function toContainReactComponent< const message = pass ? () => - `${matcherHint('.not.toContainReactComponent')}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toContainPreactComponent')}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `Not to contain component:\n ${expectedColor(printType(type))}\n${ props ? `With props matching:\n ${printExpected(props)}\n` : '' }` + @@ -59,8 +59,10 @@ export function toContainReactComponent< } found.\n` : () => `${ - `${matcherHint('.toContainReactComponent')}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.toContainPreactComponent')}\n\n` + + `Expected the Preact element:\n ${receivedColor( + node.toString(), + )}\n` + `To contain component:\n ${expectedColor(printType(type))}\n${ props ? `With props matching:\n ${printExpected(props)}\n` : '' }` @@ -81,7 +83,7 @@ export function toContainReactComponent< return {pass, message}; } -export function toContainReactComponentTimes< +export function toContainPreactComponentTimes< Type extends string | ComponentType, >( this: MatcherState, @@ -91,12 +93,12 @@ export function toContainReactComponentTimes< props?: Partial>, ) { assertIsNode(node, { - expectation: 'toContainReactComponentTimes', + expectation: 'toContainPreactComponentTimes', isNot: this.isNot, }); assertIsType(type, { - expectation: 'toContainReactComponent', + expectation: 'toContainPreactComponent', isNot: this.isNot, }); @@ -115,15 +117,15 @@ export function toContainReactComponentTimes< const message = pass ? () => [ - `${matcherHint('.not.toContainReactComponentTimes')}\n`, - `Expected the React element:\n ${receivedColor(node.toString())}`, + `${matcherHint('.not.toContainPreactComponentTimes')}\n`, + `Expected the Preact element:\n ${receivedColor(node.toString())}`, `Not to contain component:\n ${expectedColor(printType(type))}`, `${times} ${pluralize('time', times)}, but it did.`, ].join('\n') : () => [ - `${matcherHint('.toContainReactComponentTimes')}\n`, - `Expected the React element:\n ${receivedColor(node.toString())}`, + `${matcherHint('.toContainPreactComponentTimes')}\n`, + `Expected the Preact element:\n ${receivedColor(node.toString())}`, `To contain component:\n ${expectedColor(printType(type))}`, `${times} ${pluralize('time', times)}, but it was found ${ foundByProps.length diff --git a/packages/preact-testing/source/matchers/context.ts b/packages/preact-testing/source/matchers/context.ts index 8be0edfc0..30b220e51 100644 --- a/packages/preact-testing/source/matchers/context.ts +++ b/packages/preact-testing/source/matchers/context.ts @@ -11,14 +11,14 @@ import type {Node} from '../types.ts'; import {assertIsNode, diffs, printType} from './utilities.ts'; -export function toProvideReactContext( +export function toProvidePreactContext( this: MatcherState, node: Node, Context: Context, value?: Type, ) { assertIsNode(node, { - expectation: 'toProvideReactContext', + expectation: 'toProvidePreactContext', isNot: this.isNot, }); @@ -34,8 +34,8 @@ export function toProvideReactContext( const message = pass ? () => - `${matcherHint('.not.toProvideReactContext')}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toProvidePreactContext')}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `Not to contain context provider:\n ${expectedColor( printType(Context.Provider), )}\n${ @@ -46,8 +46,10 @@ export function toProvideReactContext( } found.\n` : () => `${ - `${matcherHint('.toProvideReactContext')}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.toProvidePreactContext')}\n\n` + + `Expected the Preact element:\n ${receivedColor( + node.toString(), + )}\n` + `To contain context provider:\n ${expectedColor( printType(Context.Provider), )}\n${ diff --git a/packages/preact-testing/source/matchers/dom.ts b/packages/preact-testing/source/matchers/dom.ts index 4da220922..653002825 100644 --- a/packages/preact-testing/source/matchers/dom.ts +++ b/packages/preact-testing/source/matchers/dom.ts @@ -8,16 +8,16 @@ import { import type {Node} from '../types.ts'; -import {toHaveReactProps} from './props.ts'; +import {toHavePreactProps} from './props.ts'; import {assertIsNode, printReceivedWithHighlight} from './utilities.ts'; -export function toContainReactHTML( +export function toContainPreactHTML( this: MatcherState, node: Node, text: string, ) { assertIsNode(node, { - expectation: 'toContainReactHTML', + expectation: 'toContainPreactHTML', isNot: this.isNot, }); @@ -27,8 +27,8 @@ export function toContainReactHTML( const message = pass ? () => - `${matcherHint('.not.toContainReactHTML', node.toString())}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toContainPreactHTML', node.toString())}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `Not to contain HTML:\n ${printExpected(text)}\n` + `But it did:\n ${printReceivedWithHighlight( nodeHTML, @@ -36,18 +36,18 @@ export function toContainReactHTML( text.length, )}\n` : () => - `${matcherHint('.not.toContainReactHTML', node.toString())}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toContainPreactHTML', node.toString())}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `With HTML content:\n ${printReceived(nodeHTML)}\n` + `To contain HTML:\n ${printExpected(text)}\n`; return {pass, message}; } -export function toHaveReactDataProps( +export function toHavePreactDataProps( this: MatcherState, node: Node, data: {[key: string]: string}, ) { - return toHaveReactProps.call(this, node, data); + return toHavePreactProps.call(this, node, data); } diff --git a/packages/preact-testing/source/matchers/props.ts b/packages/preact-testing/source/matchers/props.ts index b9c1e8a03..c01495d0a 100644 --- a/packages/preact-testing/source/matchers/props.ts +++ b/packages/preact-testing/source/matchers/props.ts @@ -10,13 +10,13 @@ import type {Node} from '../types.ts'; import {assertIsNode, diffPropsForNode} from './utilities.ts'; -export function toHaveReactProps( +export function toHavePreactProps( this: MatcherState, node: Node, props: Partial, ) { assertIsNode(node, { - expectation: 'toHaveReactProps', + expectation: 'toHavePreactProps', isNot: this.isNot, }); @@ -36,8 +36,8 @@ export function toHaveReactProps( const message = pass ? () => - `${matcherHint('.not.toHaveReactProps', node.toString())}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toHavePreactProps', node.toString())}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `Not to have props:\n ${printExpected(props)}\n` + `Received:\n ${printReceived(node.props)}\n` : () => { @@ -46,8 +46,10 @@ export function toHaveReactProps( }); return ( - `${matcherHint('.toHaveReactProps', node.toString())}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.toHavePreactProps', node.toString())}\n\n` + + `Expected the Preact element:\n ${receivedColor( + node.toString(), + )}\n` + `To have props:\n ${printExpected(props)}\n` + `Received:\n ${printReceived(node.props)}\n${ diffString ? `Difference:\n${diffString}\n` : '' diff --git a/packages/preact-testing/source/matchers/text.ts b/packages/preact-testing/source/matchers/text.ts index e5181a9d0..da824cd80 100644 --- a/packages/preact-testing/source/matchers/text.ts +++ b/packages/preact-testing/source/matchers/text.ts @@ -10,13 +10,13 @@ import type {Node} from '../types.ts'; import {assertIsNode, printReceivedWithHighlight} from './utilities.ts'; -export function toContainReactText( +export function toContainPreactText( this: MatcherState, node: Node, text: string, ) { assertIsNode(node, { - expectation: 'toContainReactText', + expectation: 'toContainPreactText', isNot: this.isNot, }); @@ -26,8 +26,8 @@ export function toContainReactText( const message = pass ? () => - `${matcherHint('.not.toContainReactText', node.toString())}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toContainPreactText', node.toString())}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `Not to contain text:\n ${printExpected(text)}\n` + `But it did:\n ${printReceivedWithHighlight( nodeText, @@ -35,8 +35,8 @@ export function toContainReactText( text.length, )}\n` : () => - `${matcherHint('.not.toContainReactText', node.toString())}\n\n` + - `Expected the React element:\n ${receivedColor(node.toString())}\n` + + `${matcherHint('.not.toContainPreactText', node.toString())}\n\n` + + `Expected the Preact element:\n ${receivedColor(node.toString())}\n` + `With text content:\n ${printReceived(nodeText)}\n` + `To contain string:\n ${printExpected(text)}\n`; diff --git a/packages/preact-testing/source/matchers/utilities.ts b/packages/preact-testing/source/matchers/utilities.ts index f37aecc1a..96b52f984 100644 --- a/packages/preact-testing/source/matchers/utilities.ts +++ b/packages/preact-testing/source/matchers/utilities.ts @@ -23,7 +23,7 @@ export function assertIsNode( matcherHint(`.${expectation}`, undefined, undefined, {isNot}), `${receivedColor( 'received', - )} value must be an @shopify/react-testing Root or Element object`, + )} value must be an @quilted/preact-testing Root or Element object`, `Received ${receivedColor( 'null', )}.\nThis usually means that your \`.findX\` method failed to find any matching elements.`, @@ -37,7 +37,7 @@ export function assertIsNode( matcherHint(`.${expectation}`, undefined, undefined, {isNot}), `${receivedColor( 'received', - )} value must be an @shopify/react-testing Root or Element object`, + )} value must be an @quilted/preact-testing Root or Element object`, `Received an ${receivedColor( 'array of Root or Element objects', )}.\nThis usually means that you passed in the result of \`.findAllX\`. Pass the result of \`.findX\` instead.`, @@ -51,7 +51,7 @@ export function assertIsNode( matcherHint(`.${expectation}`, undefined, undefined, {isNot}), `${receivedColor( 'received', - )} value must be an @shopify/react-testing Root or Element object`, + )} value must be an @quilted/preact-testing Root or Element object`, printWithType('Received', node, printReceived), ), ); diff --git a/packages/quilt/source/react/testing.ts b/packages/quilt/source/react/testing.ts index 719c90da0..0418aa020 100644 --- a/packages/quilt/source/react/testing.ts +++ b/packages/quilt/source/react/testing.ts @@ -1,12 +1,12 @@ import {expect} from 'vitest'; -import {matchers, CustomMatchers} from '@quilted/react-testing/matchers'; +import {matchers, type CustomMatchers} from '@quilted/react-testing/matchers'; export { render, createRender, rendered, destroyAll, -} from '@quilted/react-testing'; +} from '@quilted/react-testing/preact'; export type { CustomRender, CustomRenderResult, @@ -22,11 +22,7 @@ export type { NodeApi, Root, RootApi, - DebugOptions, - EmptyObject, - PlainObject, - Predicate, -} from '@quilted/react-testing'; +} from '@quilted/react-testing/preact'; declare module 'vitest' { interface Assertion extends CustomMatchers {} diff --git a/packages/react-testing/source/matchers/utilities.ts b/packages/react-testing/source/matchers/utilities.ts index 6da84afca..36909d7c7 100644 --- a/packages/react-testing/source/matchers/utilities.ts +++ b/packages/react-testing/source/matchers/utilities.ts @@ -23,7 +23,7 @@ export function assertIsNode( matcherHint(`.${expectation}`, undefined, undefined, {isNot}), `${receivedColor( 'received', - )} value must be an @shopify/react-testing Root or Element object`, + )} value must be an @quilted/react-testing Root or Element object`, `Received ${receivedColor( 'null', )}.\nThis usually means that your \`.findX\` method failed to find any matching elements.`, @@ -37,7 +37,7 @@ export function assertIsNode( matcherHint(`.${expectation}`, undefined, undefined, {isNot}), `${receivedColor( 'received', - )} value must be an @shopify/react-testing Root or Element object`, + )} value must be an @quilted/react-testing Root or Element object`, `Received an ${receivedColor( 'array of Root or Element objects', )}.\nThis usually means that you passed in the result of \`.findAllX\`. Pass the result of \`.findX\` instead.`, @@ -51,7 +51,7 @@ export function assertIsNode( matcherHint(`.${expectation}`, undefined, undefined, {isNot}), `${receivedColor( 'received', - )} value must be an @shopify/react-testing Root or Element object`, + )} value must be an @quilted/react-testing Root or Element object`, printWithType('Received', node, printReceived), ), );