@tanstack/query-devtools 5.91.0 → 5.92.0

package/src/Explorer.tsx

@@ -1,6 +1,14 @@
 import { serialize, stringify } from 'superjson'
 import { clsx as cx } from 'clsx'
-import { Index, Match, Show, Switch, createMemo, createSignal } from 'solid-js'
+import {
+  Index,
+  Match,
+  Show,
+  Switch,
+  createMemo,
+  createSignal,
+  createUniqueId,
+} from 'solid-js'
 import { Key } from '@solid-primitives/keyed'
 import * as goober from 'goober'
 import { tokens } from './theme'
@@ -325,6 +333,8 @@ export default function Explorer(props: ExplorerProps) {
 
   const currentDataPath = props.dataPath ?? []
 
+  const inputId = createUniqueId()
+
   return (
     <div class={styles().entry}>
       <Show when={subEntryPages().length}>
@@ -332,6 +342,7 @@ export default function Explorer(props: ExplorerProps) {
           <button
             class={styles().expanderButton}
             onClick={() => toggleExpanded()}
+            aria-expanded={expanded() ? 'true' : 'false'}
           >
             <Expander expanded={expanded()} /> <span>{props.label}</span>{' '}
             <span class={styles().info}>
@@ -446,7 +457,9 @@ export default function Explorer(props: ExplorerProps) {
       </Show>
       <Show when={subEntryPages().length === 0}>
         <div class={styles().row}>
-          <span class={styles().label}>{props.label}:</span>
+          <label for={inputId} class={styles().label}>
+            {props.label}:
+          </label>
           <Show
             when={
               props.editable &&
@@ -467,6 +480,7 @@ export default function Explorer(props: ExplorerProps) {
               }
             >
               <input
+                id={inputId}
                 type={type() === 'number' ? 'number' : 'text'}
                 class={cx(styles().value, styles().editableInput)}
                 value={props.value as string | number}

package/src/contexts/PiPContext.tsx

@@ -26,6 +26,8 @@ type PiPContextType = {
   disabled: boolean
 }
 
+class PipOpenError extends Error {}
+
 const PiPContext = createContext<Accessor<PiPContextType> | undefined>(
   undefined,
 )
@@ -57,7 +59,7 @@ export const PiPProvider = (props: PiPProviderProps) => {
     )
 
     if (!pip) {
-      throw new Error(
+      throw new PipOpenError(
         'Failed to open popup. Please allow popups for this site to view the devtools in picture-in-picture mode.',
       )
     }
@@ -134,10 +136,20 @@ export const PiPProvider = (props: PiPProviderProps) => {
   createEffect(() => {
     const pip_open = (props.localStore.pip_open ?? 'false') as 'true' | 'false'
     if (pip_open === 'true' && !props.disabled) {
-      requestPipWindow(
-        Number(window.innerWidth),
-        Number(props.localStore.height || PIP_DEFAULT_HEIGHT),
-      )
+      try {
+        requestPipWindow(
+          Number(window.innerWidth),
+          Number(props.localStore.height || PIP_DEFAULT_HEIGHT),
+        )
+      } catch (error) {
+        if (error instanceof PipOpenError) {
+          console.error(error.message)
+          props.setLocalStore('pip_open', 'false')
+          props.setLocalStore('open', 'false')
+          return
+        }
+        throw error
+      }
     }
   })