@tanstack/solid-query 4.10.3 → 4.11.0

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 Tanner Linsley
+Copyright (c) 2021-present Tanner Linsley
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/solid-query",
-  "version": "4.10.3",
+  "version": "4.11.0",
   "description": "Primitives for managing, caching and syncing asynchronous and remote data in Solid",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -40,7 +40,7 @@
     "@tanstack/query-core": "4.10.3"
   },
   "peerDependencies": {
-    "solid-js": "^1.5.4"
+    "solid-js": "^1.5.7"
   },
   "peerDependenciesMeta": {},
   "scripts": {

package/src/__tests__/transition.test.tsx

@@ -0,0 +1,58 @@
+import { fireEvent, render, screen, waitFor } from 'solid-testing-library'
+
+import { createSignal, Show, startTransition, Suspense } from 'solid-js'
+import { createQuery, QueryCache, QueryClientProvider } from '..'
+import { createQueryClient, queryKey, sleep } from './utils'
+
+describe("useQuery's in Suspense mode with transitions", () => {
+  const queryCache = new QueryCache()
+  const queryClient = createQueryClient({ queryCache })
+
+  it('should render the content when the transition is done', async () => {
+    const key = queryKey()
+
+    function Suspended() {
+      const state = createQuery(key, async () => {
+        await sleep(10)
+        return true
+      })
+
+      return <Show when={state.data}>Message</Show>
+    }
+
+    function Page() {
+      const [showSignal, setShowSignal] = createSignal(false)
+
+      return (
+        <div>
+          <button
+            aria-label="toggle"
+            onClick={() =>
+              startTransition(() => setShowSignal((value) => !value))
+            }
+          >
+            {showSignal() ? 'Hide' : 'Show'}
+          </button>
+          <Suspense fallback="Loading">
+            <Show when={showSignal()}>
+              <Suspended />
+            </Show>
+          </Suspense>
+        </div>
+      )
+    }
+
+    render(() => (
+      <QueryClientProvider client={queryClient}>
+        <Page />
+      </QueryClientProvider>
+    ))
+
+    await waitFor(() => screen.getByText('Show'))
+    fireEvent.click(screen.getByLabelText('toggle'))
+
+    await waitFor(() => screen.getByText('Message'))
+    // verify that the button also updated. See https://github.com/solidjs/solid/issues/1249
+    await waitFor(() => screen.getByText('Hide'))
+  })
+})