UNPKG

one

Version:

One is a new React Framework that makes Vite serve both native and web.

210 lines (184 loc) 8.9 kB
var import_vitest = require("vitest"), import_clientTreeShakePlugin = require("./clientTreeShakePlugin.cjs"); (0, import_vitest.describe)("clientTreeShakePlugin", () => { (0, import_vitest.describe)("transformTreeShakeClient", () => { (0, import_vitest.it)("should remove loader export and its imports", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { serverOnlyModule } from 'server-only-pkg' import { Text } from 'react-native' import { useLoader } from 'one' export function loader() { return serverOnlyModule() } export default function Page() { const data = useLoader(loader) return <Text>{data}</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).not.toContain("server-only-pkg"), (0, import_vitest.expect)(result.code).toContain("react-native"), (0, import_vitest.expect)(result.code).toContain("one"); }), (0, import_vitest.it)("should remove loader export with dynamic import", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { Text } from 'react-native' import { useLoader } from 'one' export async function loader() { const { serverFn } = await import('server-only-pkg') return serverFn() } export default function Page() { const data = useLoader(loader) return <Text>{data}</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).not.toContain("server-only-pkg"); }), (0, import_vitest.it)("should remove loader with const arrow function export", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { serverOnlyModule } from 'server-only-pkg' import { Text } from 'react-native' import { useLoader } from 'one' export const loader = async () => { return serverOnlyModule() } export default function Page() { const data = useLoader(loader) return <Text>{data}</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).not.toContain("server-only-pkg"); }), (0, import_vitest.it)("should handle multiple imports where only some are used in loader", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { serverFn } from 'server-only-pkg' import { sharedUtil } from 'shared-pkg' import { Text } from 'react-native' import { useLoader } from 'one' export function loader() { return serverFn() } export default function Page() { const data = useLoader(loader) return <Text>{sharedUtil(data)}</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).not.toContain("server-only-pkg"), (0, import_vitest.expect)(result.code).toContain("shared-pkg"); }), (0, import_vitest.it)("should remove generateStaticParams and its imports", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { getRoutes } from 'server-only-pkg' import { Text } from 'react-native' export function generateStaticParams() { return getRoutes() } export default function Page() { return <Text>Hello</Text> } `, "/app/[slug].tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).not.toContain("server-only-pkg"); }), (0, import_vitest.it)("should not transform files without loader or generateStaticParams", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { Text } from 'react-native' export default function Page() { return <Text>Hello</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeUndefined(); }), (0, import_vitest.it)("should embed routeId in loader stub when root is provided", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { serverOnlyModule } from 'server-only-pkg' import { useLoader } from 'one' export async function loader() { return serverOnlyModule() } export default function Layout() { const data = useLoader(loader) return data } `, "/project/app/_layout.tsx", "/project"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).toContain('export function loader() {return "./_layout.tsx"}'), (0, import_vitest.expect)(result.code).not.toContain("__vxrn__loader__"); }), (0, import_vitest.it)("should embed routeId with render mode suffix in loader stub", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { serverOnlyModule } from 'server-only-pkg' import { useLoader } from 'one' export async function loader() { return serverOnlyModule() } export default function Layout() { const data = useLoader(loader) return data } `, "/project/app/user+ssr.tsx", "/project"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).toContain('export function loader() {return "./user+ssr.tsx"}'); }), (0, import_vitest.it)("should fall back to __vxrn__loader__ stub when no root provided", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { serverOnlyModule } from 'server-only-pkg' import { useLoader } from 'one' export async function loader() { return serverOnlyModule() } export default function Page() { const data = useLoader(loader) return data } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).toContain("__vxrn__loader__"); }), (0, import_vitest.it)("should not transform route file when loader is imported (no inline declaration)", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { loader } from './loaders/my-loader' import { useLoader } from 'one' export { loader } export default function Layout() { const data = useLoader(loader) return data } `, "/project/app/_layout.tsx", "/project"); (0, import_vitest.expect)(result).toBeUndefined(); }), (0, import_vitest.it)("should tree-shake server imports from source file where loader is defined", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import { db } from 'server-only-db' export async function loader() { return db.query('SELECT * FROM users') } export function helperUsedByClient() { return 'hello' } `, "/project/app/loaders/my-loader.ts", "/project"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).not.toContain("server-only-db"), (0, import_vitest.expect)(result.code).toContain("helperUsedByClient"), (0, import_vitest.expect)(result.code).toContain('export function loader() {return "./loaders/my-loader.ts"}'); }), (0, import_vitest.it)("should not transform re-export from source syntax", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` export { loader } from './loaders/shared-loader' import { useLoader } from 'one' export default function Page() { return 'hello' } `, "/project/app/page.tsx", "/project"); (0, import_vitest.expect)(result).toBeUndefined(); }), (0, import_vitest.it)("should preserve type-only imports during tree shaking", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import type { SomeType } from 'types-pkg' import { serverFn } from 'server-only-pkg' import { Text } from 'react-native' import { useLoader } from 'one' export function loader(): SomeType { return serverFn() } export default function Page() { const data = useLoader(loader) return <Text>{data}</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).toContain("types-pkg"), (0, import_vitest.expect)(result.code).not.toContain("server-only-pkg"); }), (0, import_vitest.it)("should preserve type imports even when used only in loader", async () => { const result = await (0, import_clientTreeShakePlugin.transformTreeShakeClient)(` import type { APIGuildMember } from '@discordjs/core' import { getClient } from 'discord-client' import { Text } from 'react-native' import { useLoader } from 'one' export function loader(): APIGuildMember { return getClient() } export default function Page() { const data = useLoader(loader) return <Text>{JSON.stringify(data)}</Text> } `, "/app/index.tsx"); (0, import_vitest.expect)(result).toBeDefined(), (0, import_vitest.expect)(result.code).toContain("@discordjs/core"), (0, import_vitest.expect)(result.code).not.toContain("discord-client"); }); }); });