import * as React from "react";
import { render } from "reakit-test-utils";
import { createComponent } from "../createComponent";
test("as string", () => {
const useA = ({ a }: { a: string }) => ({ children: a });
const A = createComponent({ as: "div", useHook: useA });
const { getByText } = render();
expect(getByText("a")).toMatchInlineSnapshot(`
a
`);
});
test("as component", () => {
const useA = ({ a }: { a: string }, htmlProps: any) => ({
children: a,
...htmlProps,
});
const A = createComponent({ as: "div", useHook: useA });
const B = ({ b, state, ...props }: { state: any; b: string }) => (
);
const { getByText } = render();
expect(getByText("a")).toMatchInlineSnapshot(`
a
`);
});
test("as generic component", () => {
const useA = ({ a }: { a: string }, htmlProps: any) => ({
children: a,
...htmlProps,
});
const A = createComponent({ as: "div", useHook: useA });
function B({ b, state, ...props }: { state: any; b: T }) {
return ;
}
const { getByText } = render();
expect(getByText("a")).toMatchInlineSnapshot(`
a
`);
});
test("wrap", () => {
const useA = (_: any, h: any) => ({
wrapElement: (element: React.ReactNode) => (
{element}
),
...h,
});
const A = createComponent({ as: "span", useHook: useA });
const { baseElement } = render(a);
expect(baseElement).toMatchInlineSnapshot(`
`);
});