From 7ecf92d3084484907085532df4e5ef0dc3a01590 Mon Sep 17 00:00:00 2001 From: Ryan Carniato Date: Tue, 24 Sep 2024 16:35:41 -0700 Subject: [PATCH] fix #2304 component props can be string, explicit imports in tests --- .changeset/wicked-sloths-travel.md | 5 ++++ packages/solid/src/render/component.ts | 23 +++++++++++-------- packages/solid/store/test/modifiers.spec.ts | 13 +++++++++-- packages/solid/store/test/mutable.spec.ts | 7 +++--- .../store/test/mutableWithClass.spec.tsx | 5 ++-- packages/solid/store/test/store.spec.ts | 5 ++-- packages/solid/test/array.spec.ts | 3 ++- packages/solid/test/component.bench.ts | 4 ++-- packages/solid/test/component.spec.ts | 10 ++++---- packages/solid/test/component.type-tests.ts | 2 +- packages/solid/test/dev.spec.ts | 7 +++--- packages/solid/test/external-source.spec.ts | 3 ++- packages/solid/test/observable.spec.ts | 3 ++- packages/solid/test/resource.spec.ts | 5 ++-- packages/solid/test/resource.type-tests.ts | 4 ++-- packages/solid/test/scheduler.spec.ts | 3 ++- packages/solid/test/signals.memo.spec.ts | 3 ++- packages/solid/test/signals.spec.ts | 3 ++- packages/solid/test/signals.type-tests.ts | 3 +-- packages/solid/web/test/context.spec.tsx | 5 ++-- packages/solid/web/test/dynamic.spec.tsx | 8 +++---- packages/solid/web/test/element.spec.tsx | 4 ++-- .../solid/web/test/errorboundary.spec.tsx | 6 ++--- packages/solid/web/test/for.spec.tsx | 6 ++--- packages/solid/web/test/index.spec.tsx | 6 ++--- packages/solid/web/test/portal.spec.tsx | 6 ++--- packages/solid/web/test/server-mock.spec.tsx | 3 ++- packages/solid/web/test/show.spec.tsx | 6 ++--- packages/solid/web/test/suspense.spec.tsx | 13 ++++++++--- packages/solid/web/test/switch.spec.tsx | 8 +++---- 30 files changed, 111 insertions(+), 71 deletions(-) create mode 100644 .changeset/wicked-sloths-travel.md diff --git a/.changeset/wicked-sloths-travel.md b/.changeset/wicked-sloths-travel.md new file mode 100644 index 000000000..67ae4abcb --- /dev/null +++ b/.changeset/wicked-sloths-travel.md @@ -0,0 +1,5 @@ +--- +"solid-js": patch +--- + +fix #2304 component props can be string, explicit imports in tests diff --git a/packages/solid/src/render/component.ts b/packages/solid/src/render/component.ts index f90782f60..83bc7a329 100644 --- a/packages/solid/src/render/component.ts +++ b/packages/solid/src/render/component.ts @@ -21,33 +21,33 @@ export function enableHydration() { * A general `Component` has no implicit `children` prop. If desired, you can * specify one as in `Component<{name: String, children: JSX.Element}>`. */ -export type Component

= (props: P) => JSX.Element; +export type Component

= {}> = (props: P) => JSX.Element; /** * Extend props to forbid the `children` prop. * Use this to prevent accidentally passing `children` to components that * would silently throw them away. */ -export type VoidProps

= P & { children?: never }; +export type VoidProps

= {}> = P & { children?: never }; /** * `VoidComponent` forbids the `children` prop. * Use this to prevent accidentally passing `children` to components that * would silently throw them away. */ -export type VoidComponent

= Component>; +export type VoidComponent

= {}> = Component>; /** * Extend props to allow an optional `children` prop with the usual * type in JSX, `JSX.Element` (which allows elements, arrays, functions, etc.). * Use this for components that you want to accept children. */ -export type ParentProps

= P & { children?: JSX.Element }; +export type ParentProps

= {}> = P & { children?: JSX.Element }; /** * `ParentComponent` allows an optional `children` prop with the usual * type in JSX, `JSX.Element` (which allows elements, arrays, functions, etc.). * Use this for components that you want to accept children. */ -export type ParentComponent

= Component>; +export type ParentComponent

= {}> = Component>; /** * Extend props to require a `children` prop with the specified type. @@ -55,17 +55,19 @@ export type ParentComponent

= Component>; * typically a function that receives specific argument types. * Note that all JSX are of the type `JSX.Element`. */ -export type FlowProps

= P & { children: C }; +export type FlowProps

= {}, C = JSX.Element> = P & { children: C }; /** * `FlowComponent` requires a `children` prop with the specified type. * Use this for components where you need a specific child type, * typically a function that receives specific argument types. * Note that all JSX are of the type `JSX.Element`. */ -export type FlowComponent

= Component>; +export type FlowComponent

= {}, C = JSX.Element> = Component< + FlowProps +>; /** @deprecated: use `ParentProps` instead */ -export type PropsWithChildren

= ParentProps

; +export type PropsWithChildren

= {}> = ParentProps

; export type ValidComponent = keyof JSX.IntrinsicElements | Component | (string & {}); @@ -89,7 +91,10 @@ export type ComponentProps = T extends Component = T | ((val: T) => void); -export function createComponent(Comp: Component, props: T): JSX.Element { +export function createComponent>( + Comp: Component, + props: T +): JSX.Element { if (hydrationEnabled) { if (sharedConfig.context) { const c = sharedConfig.context; diff --git a/packages/solid/store/test/modifiers.spec.ts b/packages/solid/store/test/modifiers.spec.ts index 2cbb58d2d..2ca8592f0 100644 --- a/packages/solid/store/test/modifiers.spec.ts +++ b/packages/solid/store/test/modifiers.spec.ts @@ -1,5 +1,14 @@ -import { createRoot, createSignal, createEffect } from "../../src"; -import { createStore, createMutable, reconcile, produce, unwrap, modifyMutable } from "../src"; +import { describe, expect, test } from "vitest"; + +import { createRoot, createSignal, createEffect } from "../../src/index.js"; +import { + createStore, + createMutable, + reconcile, + produce, + unwrap, + modifyMutable +} from "../src/index.js"; describe("setState with reconcile", () => { test("Reconcile a simple object", () => { diff --git a/packages/solid/store/test/mutable.spec.ts b/packages/solid/store/test/mutable.spec.ts index 507abc4a6..8cd1241da 100644 --- a/packages/solid/store/test/mutable.spec.ts +++ b/packages/solid/store/test/mutable.spec.ts @@ -1,6 +1,7 @@ -import { createRoot, createSignal, createMemo, batch, createEffect } from "../../src"; -import { Accessor, Setter } from "../../types"; -import { createMutable, unwrap, $RAW } from "../src"; +import { describe, expect, test } from "vitest"; +import { createRoot, createSignal, createMemo, batch, createEffect } from "../../src/index.js"; +import { Accessor, Setter } from "../../types/index.js"; +import { createMutable, unwrap, $RAW } from "../src/index.js"; test("Object.create(null) is allowed", () => { const user = createMutable(Object.assign(Object.create(null), { name: "John" })); diff --git a/packages/solid/store/test/mutableWithClass.spec.tsx b/packages/solid/store/test/mutableWithClass.spec.tsx index e5b379eca..bfc1bc404 100644 --- a/packages/solid/store/test/mutableWithClass.spec.tsx +++ b/packages/solid/store/test/mutableWithClass.spec.tsx @@ -1,5 +1,6 @@ -import { createEffect, createRoot } from "../../src"; -import { createMutable } from "../src"; +import { describe, expect, test } from "vitest"; +import { createEffect, createRoot } from "../../src/index.js"; +import { createMutable } from "../src/index.js"; describe("Class Operator test", () => { test("read and set class", () => { diff --git a/packages/solid/store/test/store.spec.ts b/packages/solid/store/test/store.spec.ts index 0e2df2309..6fc6e28c1 100644 --- a/packages/solid/store/test/store.spec.ts +++ b/packages/solid/store/test/store.spec.ts @@ -1,3 +1,4 @@ +import { describe, expect, test } from "vitest"; import { createRoot, createSignal, @@ -7,8 +8,8 @@ import { on, untrack, mapArray -} from "../../src"; -import { createStore, unwrap, $RAW, NotWrappable } from "../src"; +} from "../../src/index.js"; +import { createStore, unwrap, $RAW, NotWrappable } from "../src/index.js"; describe("State immutability", () => { test("Setting a property", () => { diff --git a/packages/solid/test/array.spec.ts b/packages/solid/test/array.spec.ts index 6bcff4b60..91b809c26 100644 --- a/packages/solid/test/array.spec.ts +++ b/packages/solid/test/array.spec.ts @@ -1,4 +1,5 @@ -import { mapArray, indexArray, createSignal, createMemo, createRoot } from "../src"; +import { describe, expect, test } from "vitest"; +import { mapArray, indexArray, createSignal, createMemo, createRoot } from "../src/index.js"; describe("Map operator", () => { test("simple mapArray", () => { diff --git a/packages/solid/test/component.bench.ts b/packages/solid/test/component.bench.ts index c9b6490c1..fd7fd00c3 100644 --- a/packages/solid/test/component.bench.ts +++ b/packages/solid/test/component.bench.ts @@ -1,5 +1,5 @@ -import { mergeProps, splitProps } from "../src"; -import { bench } from "vitest"; +import { mergeProps, splitProps } from "../src/index.js"; +import { bench, describe } from "vitest"; const staticDesc = { value: 1, diff --git a/packages/solid/test/component.spec.ts b/packages/solid/test/component.spec.ts index a8a70558a..1d4424932 100644 --- a/packages/solid/test/component.spec.ts +++ b/packages/solid/test/component.spec.ts @@ -1,3 +1,4 @@ +import { describe, expect, it, test } from "vitest"; import { createRoot, createComponent, @@ -5,9 +6,10 @@ import { splitProps, createUniqueId, createSignal, - createEffect -} from "../src"; -import { createStore } from "../store/src"; + createEffect, + JSX +} from "../src/index.js"; +import { createStore } from "../store/src/index.js"; type SimplePropTypes = { a?: string | null; @@ -41,7 +43,7 @@ describe("CreateComponent", () => { createRoot(() => { const nonObjects = [null, undefined, false]; nonObjects.forEach(nonObject => { - const out = createComponent(p => p, nonObject); + const out = createComponent(p => p as JSX.Element, nonObject as any); expect(out).toEqual({}); }); }); diff --git a/packages/solid/test/component.type-tests.ts b/packages/solid/test/component.type-tests.ts index bfe1067c8..39ee346ed 100644 --- a/packages/solid/test/component.type-tests.ts +++ b/packages/solid/test/component.type-tests.ts @@ -1,4 +1,4 @@ -import { mergeProps, splitProps } from "../src"; +import { mergeProps, splitProps } from "../src/index.js"; type Assert = never; // from: https://github.com/Microsoft/TypeScript/issues/27024#issuecomment-421529650 diff --git a/packages/solid/test/dev.spec.ts b/packages/solid/test/dev.spec.ts index cc9548ae1..a6c72fc97 100644 --- a/packages/solid/test/dev.spec.ts +++ b/packages/solid/test/dev.spec.ts @@ -1,3 +1,4 @@ +import { describe, expect, test, vi } from "vitest"; import { createRoot, getOwner, @@ -7,9 +8,9 @@ import { DEV, createContext, createComponent -} from "../src"; -import type { DevComponent } from "../src/reactive/signal"; -import { createStore, unwrap, DEV as STORE_DEV } from "../store/src"; +} from "../src/index.js"; +import type { DevComponent } from "../src/reactive/signal.js"; +import { createStore, unwrap, DEV as STORE_DEV } from "../store/src/index.js"; describe("Dev features", () => { test("Signals being added to sourceMap with user-provided names", () => { diff --git a/packages/solid/test/external-source.spec.ts b/packages/solid/test/external-source.spec.ts index 1a33369c1..10208a424 100644 --- a/packages/solid/test/external-source.spec.ts +++ b/packages/solid/test/external-source.spec.ts @@ -1,4 +1,5 @@ -import { createRoot, createMemo, untrack, enableExternalSource } from "../src"; +import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"; +import { createRoot, createMemo, untrack, enableExternalSource } from "../src/index.js"; import "./MessageChannel"; diff --git a/packages/solid/test/observable.spec.ts b/packages/solid/test/observable.spec.ts index 88e538557..39f84ecf2 100644 --- a/packages/solid/test/observable.spec.ts +++ b/packages/solid/test/observable.spec.ts @@ -1,4 +1,5 @@ -import { createRoot, createSignal, from, observable } from "../src"; +import { describe, expect, test, vi } from "vitest"; +import { createRoot, createSignal, from, observable } from "../src/index.js"; describe("Observable operator", () => { test("to observable", () => { diff --git a/packages/solid/test/resource.spec.ts b/packages/solid/test/resource.spec.ts index ef0b5e447..9874e6b2b 100644 --- a/packages/solid/test/resource.spec.ts +++ b/packages/solid/test/resource.spec.ts @@ -1,3 +1,4 @@ +import { describe, expect, test } from "vitest"; import { createRoot, createSignal, @@ -8,9 +9,9 @@ import { ResourceFetcherInfo, Signal, createMemo -} from "../src"; +} from "../src/index.js"; -import { createStore, reconcile, ReconcileOptions, Store, unwrap } from "../store/src"; +import { createStore, reconcile, ReconcileOptions, Store, unwrap } from "../store/src/index.js"; describe("Simulate a dynamic fetch", () => { let resolve: (v: string) => void, diff --git a/packages/solid/test/resource.type-tests.ts b/packages/solid/test/resource.type-tests.ts index 3d1cd5ec2..eb833c9d7 100644 --- a/packages/solid/test/resource.type-tests.ts +++ b/packages/solid/test/resource.type-tests.ts @@ -1,5 +1,5 @@ -import { createResource, ResourceReturn, createSignal, Resource, Setter } from "../src"; -import { InitializedResource, InitializedResourceReturn } from "../src/reactive/signal"; +import { createResource, ResourceReturn, createSignal, Resource, Setter } from "../src/index.js"; +import { InitializedResource, InitializedResourceReturn } from "../src/reactive/signal.js"; type Assert = T; // https://github.com/Microsoft/TypeScript/issues/27024#issuecomment-421529650 diff --git a/packages/solid/test/scheduler.spec.ts b/packages/solid/test/scheduler.spec.ts index 76ef80162..a7252afb6 100644 --- a/packages/solid/test/scheduler.spec.ts +++ b/packages/solid/test/scheduler.spec.ts @@ -1,5 +1,6 @@ /** @vitest-environment jsdom */ -import { cancelCallback, requestCallback } from "../src"; +import { describe, expect, test } from "vitest"; +import { cancelCallback, requestCallback } from "../src/index.js"; import "./MessageChannel"; describe("requestCallback basics", () => { diff --git a/packages/solid/test/signals.memo.spec.ts b/packages/solid/test/signals.memo.spec.ts index 8f72c360d..9cb6e1864 100644 --- a/packages/solid/test/signals.memo.spec.ts +++ b/packages/solid/test/signals.memo.spec.ts @@ -1,4 +1,5 @@ -import { createRoot, createSignal, createMemo, Accessor } from "../src"; +import { describe, expect, it } from "vitest"; +import { createRoot, createSignal, createMemo, Accessor } from "../src/index.js"; describe("createMemo", () => { describe("executing propagating", () => { diff --git a/packages/solid/test/signals.spec.ts b/packages/solid/test/signals.spec.ts index 23c4c3f24..8e23534bf 100644 --- a/packages/solid/test/signals.spec.ts +++ b/packages/solid/test/signals.spec.ts @@ -1,4 +1,5 @@ /** @vitest-environment jsdom */ +import { describe, expect, test } from "vitest"; import { createRoot, createSignal, @@ -18,7 +19,7 @@ import { useContext, getOwner, runWithOwner -} from "../src"; +} from "../src/index.js"; import "./MessageChannel"; diff --git a/packages/solid/test/signals.type-tests.ts b/packages/solid/test/signals.type-tests.ts index 8aed0a9e1..25272dfbf 100644 --- a/packages/solid/test/signals.type-tests.ts +++ b/packages/solid/test/signals.type-tests.ts @@ -9,8 +9,7 @@ import { createSelector, Signal, Setter - // } from "../types/index"; -} from "../src"; +} from "../src/index.js"; class Animal { #animal = null; diff --git a/packages/solid/web/test/context.spec.tsx b/packages/solid/web/test/context.spec.tsx index ca0778be8..a0f28c940 100644 --- a/packages/solid/web/test/context.spec.tsx +++ b/packages/solid/web/test/context.spec.tsx @@ -2,9 +2,10 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ +import { describe, expect, it } from "vitest"; -import { createContext, useContext } from "../../src"; -import { render, Show } from "../src"; +import { createContext, useContext } from "../../src/index.js"; +import { render, Show } from "../src/index.js"; describe("Testing Context", () => { const ThemeContext = createContext("light"); diff --git a/packages/solid/web/test/dynamic.spec.tsx b/packages/solid/web/test/dynamic.spec.tsx index cf0d1e336..178d88e25 100644 --- a/packages/solid/web/test/dynamic.spec.tsx +++ b/packages/solid/web/test/dynamic.spec.tsx @@ -2,10 +2,10 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createRoot, createSignal, Component, JSX } from "../../src"; -import { createStore } from "../../store/src"; -import { Dynamic } from "../src"; +import { describe, expect, test, beforeEach, afterEach } from "vitest"; +import { createRoot, createSignal, Component, JSX } from "../../src/index.js"; +import { createStore } from "../../store/src/index.js"; +import { Dynamic } from "../src/index.js"; describe("Testing Dynamic control flow", () => { let div: HTMLDivElement, disposer: () => void; diff --git a/packages/solid/web/test/element.spec.tsx b/packages/solid/web/test/element.spec.tsx index 301e59dda..da36698d1 100644 --- a/packages/solid/web/test/element.spec.tsx +++ b/packages/solid/web/test/element.spec.tsx @@ -2,8 +2,8 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createRoot, createSignal, createUniqueId, JSX, children } from "../../src"; +import { describe, expect, test } from "vitest"; +import { createRoot, createSignal, createUniqueId, JSX, children } from "../../src/index.js"; declare module "solid-js/jsx-runtime" { namespace JSX { diff --git a/packages/solid/web/test/errorboundary.spec.tsx b/packages/solid/web/test/errorboundary.spec.tsx index cbb7a9414..20a8cd266 100644 --- a/packages/solid/web/test/errorboundary.spec.tsx +++ b/packages/solid/web/test/errorboundary.spec.tsx @@ -2,9 +2,9 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createRoot, resetErrorBoundaries } from "../../src"; -import { ErrorBoundary } from "../src"; +import { describe, expect, test } from "vitest"; +import { createRoot, resetErrorBoundaries } from "../../src/index.js"; +import { ErrorBoundary } from "../src/index.js"; describe("Testing ErrorBoundary control flow", () => { let div: HTMLDivElement, disposer: () => void; diff --git a/packages/solid/web/test/for.spec.tsx b/packages/solid/web/test/for.spec.tsx index 076066b16..e3bab9310 100644 --- a/packages/solid/web/test/for.spec.tsx +++ b/packages/solid/web/test/for.spec.tsx @@ -2,9 +2,9 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createRoot, createSignal } from "../../src"; -import { insert, For } from "../src"; +import { describe, expect, test } from "vitest"; +import { createRoot, createSignal } from "../../src/index.js"; +import { insert, For } from "../src/index.js"; describe("Testing an only child each control flow", () => { let div: HTMLDivElement, disposer: () => void; diff --git a/packages/solid/web/test/index.spec.tsx b/packages/solid/web/test/index.spec.tsx index 4da4978be..e757bc170 100644 --- a/packages/solid/web/test/index.spec.tsx +++ b/packages/solid/web/test/index.spec.tsx @@ -2,9 +2,9 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createRoot, createSignal } from "../../src"; -import { insert, Index } from "../src"; +import { describe, expect, test } from "vitest"; +import { createRoot, createSignal } from "../../src/index.js"; +import { insert, Index } from "../src/index.js"; describe("Testing an only child each control flow", () => { let div: HTMLDivElement, disposer: () => void; diff --git a/packages/solid/web/test/portal.spec.tsx b/packages/solid/web/test/portal.spec.tsx index 0488de786..413bec263 100644 --- a/packages/solid/web/test/portal.spec.tsx +++ b/packages/solid/web/test/portal.spec.tsx @@ -2,9 +2,9 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createSignal } from "../../src"; -import { render, clearDelegatedEvents, Portal, Show } from "../src"; +import { describe, expect, test } from "vitest"; +import { createSignal } from "../../src/index.js"; +import { render, clearDelegatedEvents, Portal, Show } from "../src/index.js"; describe("Testing a simple Portal", () => { let div = document.createElement("div"), diff --git a/packages/solid/web/test/server-mock.spec.tsx b/packages/solid/web/test/server-mock.spec.tsx index 8ae8a219b..aea91bb95 100644 --- a/packages/solid/web/test/server-mock.spec.tsx +++ b/packages/solid/web/test/server-mock.spec.tsx @@ -1,4 +1,5 @@ -import { renderToString, renderToStringAsync, renderToStream } from "../src/server-mock"; +import { expect, test, vi, beforeEach, afterAll } from "vitest"; +import { renderToString, renderToStringAsync, renderToStream } from "../src/server-mock.js"; const origConsoleError = console.error; const mockConsoleError = vi.fn(); diff --git a/packages/solid/web/test/show.spec.tsx b/packages/solid/web/test/show.spec.tsx index bed537b58..c2f032b51 100644 --- a/packages/solid/web/test/show.spec.tsx +++ b/packages/solid/web/test/show.spec.tsx @@ -2,9 +2,9 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { createRoot, createSignal } from "../../src"; -import { Show } from "../src"; +import { describe, expect, test } from "vitest"; +import { createRoot, createSignal } from "../../src/index.js"; +import { Show } from "../src/index.js"; describe("Testing an only child show control flow", () => { let div: HTMLDivElement, disposer: () => void; diff --git a/packages/solid/web/test/suspense.spec.tsx b/packages/solid/web/test/suspense.spec.tsx index abbf0bd0b..a94cf9d91 100644 --- a/packages/solid/web/test/suspense.spec.tsx +++ b/packages/solid/web/test/suspense.spec.tsx @@ -3,10 +3,17 @@ * @vitest-environment jsdom */ +import { describe, expect, test, beforeEach, afterEach, vi } from "vitest"; import "../../test/MessageChannel"; -import { lazy, createSignal, createResource, useTransition, enableScheduling } from "../../src"; -import { render, Suspense, SuspenseList } from "../src"; -import { createStore } from "../../store/src"; +import { + lazy, + createSignal, + createResource, + useTransition, + enableScheduling +} from "../../src/index.js"; +import { render, Suspense, SuspenseList } from "../src/index.js"; +import { createStore } from "../../store/src/index.js"; enableScheduling(); diff --git a/packages/solid/web/test/switch.spec.tsx b/packages/solid/web/test/switch.spec.tsx index c3cd359ba..d0f55d377 100644 --- a/packages/solid/web/test/switch.spec.tsx +++ b/packages/solid/web/test/switch.spec.tsx @@ -2,10 +2,10 @@ * @jsxImportSource solid-js * @vitest-environment jsdom */ - -import { render, Switch, Match, For } from "../src"; -import { createRoot, createSignal } from "../../src"; -import { createStore } from "../../store/src"; +import { describe, expect, test } from "vitest"; +import { render, Switch, Match, For } from "../src/index.js"; +import { createRoot, createSignal } from "../../src/index.js"; +import { createStore } from "../../store/src/index.js"; describe("Testing a single match switch control flow", () => { let div: HTMLDivElement, disposer: () => void;