@cedarjs/web 6.0.0-canary.2672 → 6.0.0-canary.2675

package/dist/components/cell/createFragmentCell.test.js

@@ -1,202 +0,0 @@
-import React from "react";
-import { useApolloClient, useFragment, useQuery } from "@apollo/client/react";
-import { render, screen } from "@testing-library/react";
-import { parse } from "graphql";
-import { vi, describe, beforeAll, beforeEach, test, expect } from "vitest";
-import { fragmentRegistry } from "../../apollo/fragmentRegistry.js";
-import { createCell } from "./createCell.js";
-vi.mock("@apollo/client/react", async (importOriginal) => {
-  const actual = await importOriginal();
-  return {
-    ...actual,
-    useApolloClient: vi.fn(),
-    useFragment: vi.fn(),
-    useQuery: vi.fn()
-  };
-});
-const mockUseApolloClient = useApolloClient;
-const mockApolloUseFragment = useFragment;
-const mockUseQuery = useQuery;
-const AUTHOR_FRAGMENT = parse(`
-  fragment AuthorCell_author on User {
-    email
-    fullName
-  }
-`);
-describe("createFragmentCell", () => {
-  beforeAll(() => {
-    globalThis.RWJS_ENV = {
-      RWJS_EXP_STREAMING_SSR: false
-    };
-  });
-  beforeEach(() => {
-    mockApolloUseFragment.mockReset();
-    mockUseApolloClient.mockReset();
-    mockUseApolloClient.mockReturnValue({
-      cache: {
-        identify: (obj) => obj.__typename && obj.id !== void 0 ? `${obj.__typename}:${obj.id}` : void 0
-      }
-    });
-    mockApolloUseFragment.mockReturnValue({ data: void 0, complete: false });
-  });
-  test("renders Success with data from its data prop", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    render(
-      /* @__PURE__ */ React.createElement(
-        TestCell,
-        {
-          author: { __typename: "User", id: 1, fullName: "Story Teller" }
-        }
-      )
-    );
-    screen.getByText(/^By Story Teller$/);
-  });
-  test("prefers complete data from the cache", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    mockApolloUseFragment.mockImplementation((options) => {
-      expect(options.fragmentName).toEqual("AuthorCell_author");
-      expect(options.from).toEqual("User:1");
-      return {
-        data: { fullName: "Cache Dweller" },
-        complete: true
-      };
-    });
-    render(/* @__PURE__ */ React.createElement(TestCell, { author: { __typename: "User", id: 1 } }));
-    screen.getByText(/^By Cache Dweller$/);
-  });
-  test("falls back to the data prop for incomplete cache reads", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    mockApolloUseFragment.mockReturnValue({ data: void 0, complete: false });
-    render(
-      /* @__PURE__ */ React.createElement(
-        TestCell,
-        {
-          author: { __typename: "User", id: 1, fullName: "Ref Reader" }
-        }
-      )
-    );
-    screen.getByText(/^By Ref Reader$/);
-  });
-  test("derives the prop name from the fragment type when there is no underscore", () => {
-    const TestCell = createCell({
-      FRAGMENT: parse(`
-        fragment AuthorBio on User {
-          bio
-        }
-      `),
-      Success: ({ user }) => /* @__PURE__ */ React.createElement(React.Fragment, null, user.bio)
-    });
-    render(
-      /* @__PURE__ */ React.createElement(TestCell, { user: { __typename: "User", id: 1, bio: "Writes things" } })
-    );
-    screen.getByText(/^Writes things$/);
-  });
-  test("renders Empty when isEmpty says so", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      isEmpty: () => true,
-      Empty: () => /* @__PURE__ */ React.createElement(React.Fragment, null, "Nothing to see"),
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    render(
-      /* @__PURE__ */ React.createElement(TestCell, { author: { __typename: "User", id: 1, fullName: "Nobody" } })
-    );
-    screen.getByText(/^Nothing to see$/);
-  });
-  test("applies afterQuery to the fragment data", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      afterQuery: (data) => ({
-        author: { ...data.author, fullName: "Changed Name" }
-      }),
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    render(
-      /* @__PURE__ */ React.createElement(
-        TestCell,
-        {
-          author: { __typename: "User", id: 1, fullName: "Original Name" }
-        }
-      )
-    );
-    screen.getByText(/^By Changed Name$/);
-  });
-  test("renders Empty when the data prop is null", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Empty: () => /* @__PURE__ */ React.createElement(React.Fragment, null, "No author"),
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    render(/* @__PURE__ */ React.createElement(TestCell, { author: null }));
-    screen.getByText(/^No author$/);
-  });
-  test("renders Success with null data when the data prop is null and there is no Empty", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author?.fullName ?? "unknown")
-    });
-    render(/* @__PURE__ */ React.createElement(TestCell, { author: null }));
-    screen.getByText(/^By unknown$/);
-  });
-  test("throws a helpful error naming the prop when it is not passed", () => {
-    const TestCell = createCell({
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName),
-      displayName: "AuthorCell"
-    });
-    const consoleErrorSpy = vi.spyOn(console, "error").mockImplementation(() => {
-    });
-    try {
-      expect(() => {
-        render(/* @__PURE__ */ React.createElement(TestCell, null));
-      }).toThrow(/`author` prop/);
-    } finally {
-      consoleErrorSpy.mockRestore();
-    }
-  });
-  test("stays a query Cell when both QUERY and FRAGMENT are exported", () => {
-    const TestCell = createCell({
-      // @ts-expect-error - Purposefully using a plain string here.
-      QUERY: "query AuthorQuery { author { fullName } }",
-      FRAGMENT: AUTHOR_FRAGMENT,
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    mockUseQuery.mockImplementation(() => {
-      return { data: { author: { fullName: "Query Result" } } };
-    });
-    render(/* @__PURE__ */ React.createElement(TestCell, null));
-    screen.getByText(/^By Query Result$/);
-  });
-  test("registers the FRAGMENT even when the Cell stays a query Cell", () => {
-    createCell({
-      // @ts-expect-error - Purposefully using a plain string here.
-      QUERY: "query MixedExportQuery { author { fullName } }",
-      // Using a unique fragment name since the registry is shared between
-      // tests
-      FRAGMENT: parse(`
-        fragment MixedExportCell_author on User {
-          fullName
-        }
-      `),
-      Success: ({ author }) => /* @__PURE__ */ React.createElement(React.Fragment, null, "By ", author.fullName)
-    });
-    expect(fragmentRegistry.lookup("MixedExportCell_author")).toBeTruthy();
-  });
-  test("throws when the FRAGMENT export is not a fragment", () => {
-    expect(
-      () => createCell({
-        FRAGMENT: parse("query FindAuthor { author { id } }"),
-        Success: () => /* @__PURE__ */ React.createElement(React.Fragment, null, "hello")
-      })
-    ).toThrow(/fragment definition/);
-  });
-});

package/dist/components/cell/createSuspendingCell.test.js

@@ -1,73 +0,0 @@
-import React from "react";
-import { loadErrorMessages, loadDevMessages } from "@apollo/client/dev";
-import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
-import { render, screen } from "@testing-library/react";
-import { vi, describe, beforeAll, beforeEach, test } from "vitest";
-import { createSuspendingCell } from "./createSuspendingCell.js";
-vi.mock("@apollo/client/react", () => {
-  return {
-    useApolloClient: vi.fn(),
-    useBackgroundQuery: vi.fn(),
-    useReadQuery: vi.fn()
-  };
-});
-const mockUseBackgroundQuery = useBackgroundQuery;
-const mockUseReadQuery = useReadQuery;
-describe("createSuspendingCell", () => {
-  beforeAll(() => {
-    globalThis.RWJS_ENV = {
-      RWJS_EXP_STREAMING_SSR: true
-    };
-    loadDevMessages();
-    loadErrorMessages();
-  });
-  beforeEach(() => {
-    mockUseReadQuery.mockReset();
-    mockUseBackgroundQuery.mockReset();
-    mockUseBackgroundQuery.mockImplementation(() => {
-      return ["mocked-query-ref", { refetch: vi.fn(), fetchMore: vi.fn() }];
-    });
-  });
-  test("Renders a static Success component", () => {
-    const TestCell = createSuspendingCell({
-      // @ts-expect-error - Purposefully using a plain string here.
-      QUERY: "query TestQuery { answer }",
-      Success: () => /* @__PURE__ */ React.createElement(React.Fragment, null, "Great success!")
-    });
-    mockUseReadQuery.mockImplementation(() => ({ data: {} }));
-    render(/* @__PURE__ */ React.createElement(TestCell, null));
-    screen.getByText(/^Great success!$/);
-  });
-  test("Renders Success with data", () => {
-    const TestCell = createSuspendingCell({
-      // @ts-expect-error - Purposefully using a plain string here.
-      QUERY: "query TestQuery { answer }",
-      Success: ({ answer }) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("dl", null, /* @__PURE__ */ React.createElement("dt", null, "What's the meaning of life?"), /* @__PURE__ */ React.createElement("dd", null, answer)))
-    });
-    mockUseReadQuery.mockImplementation(() => {
-      return { data: { answer: 42 } };
-    });
-    render(/* @__PURE__ */ React.createElement(TestCell, null));
-    screen.getByText(/^What's the meaning of life\?$/);
-    screen.getByText(/^42$/);
-  });
-  test("Renders Success if any of the fields have data (i.e. not just the first)", () => {
-    const TestCell = createSuspendingCell({
-      // @ts-expect-error - Purposefully using a plain string here.
-      QUERY: "query TestQuery { users { name } posts { title } }",
-      Empty: () => /* @__PURE__ */ React.createElement(React.Fragment, null, "No users or posts"),
-      Success: ({ users, posts }) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", null, users.length > 0 ? /* @__PURE__ */ React.createElement("ul", null, users.map(({ name }) => /* @__PURE__ */ React.createElement("li", { key: name }, name))) : "no users"), /* @__PURE__ */ React.createElement("div", null, posts.length > 0 ? /* @__PURE__ */ React.createElement("ul", null, posts.map(({ title }) => /* @__PURE__ */ React.createElement("li", { key: title }, title))) : "no posts"))
-    });
-    mockUseReadQuery.mockImplementation(() => {
-      return {
-        data: {
-          users: [],
-          posts: [{ title: "bazinga" }, { title: "kittens" }]
-        }
-      };
-    });
-    render(/* @__PURE__ */ React.createElement(TestCell, null));
-    screen.getByText(/bazinga/);
-    screen.getByText(/kittens/);
-  });
-});