Skip to content

Commit

Permalink
fix: don't call variables if query is disabled + fix enabling race co…
Browse files Browse the repository at this point in the history
…nditions, fix #1243, fix #1422
  • Loading branch information
Akryum committed May 16, 2023
1 parent db7d79c commit d1d8426
Show file tree
Hide file tree
Showing 2 changed files with 41 additions and 29 deletions.
7 changes: 4 additions & 3 deletions packages/test-e2e-composable-vue3/src/components/Disabled.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { defineComponent, computed, ref } from 'vue'
export default defineComponent({
setup () {
const selectedId = ref<string | null>(null)
const selectedId = ref<{ id: string } | null>(null)
const { result, loading } = useQuery(gql`
query channel ($id: ID!) {
Expand All @@ -18,15 +18,16 @@ export default defineComponent({
}
}
`, () => ({
id: selectedId.value,
// Should not throw since it will not be called if the query is disabled
id: selectedId.value!.id,
}), () => ({
fetchPolicy: 'no-cache',
enabled: !!selectedId.value,
}))
const channel = computed(() => result.value?.channel)
function load () {
selectedId.value = 'general'
selectedId.value = { id: 'general' }
}
return {
Expand Down
63 changes: 37 additions & 26 deletions packages/vue-apollo-composable/src/useQuery.ts
Original file line number Diff line number Diff line change
Expand Up @@ -401,6 +401,27 @@ export function useQueryImpl<
debouncedRestart()
}

// Enabled state

const forceDisabled = ref(lazy)
const enabledOption = computed(() => !currentOptions.value || currentOptions.value.enabled == null || currentOptions.value.enabled)
const isEnabled = computed(() => enabledOption.value && !forceDisabled.value)

// Applying options first (in case it disables the query)
watch(() => unref(optionsRef), value => {
if (currentOptions.value && (
currentOptions.value.throttle !== value.throttle ||
currentOptions.value.debounce !== value.debounce
)) {
updateRestartFn()
}
currentOptions.value = value
restart()
}, {
deep: true,
immediate: true,
})

// Applying document
let currentDocument: DocumentNode
watch(documentRef, value => {
Expand All @@ -413,8 +434,14 @@ export function useQueryImpl<
// Applying variables
let currentVariables: TVariables | undefined
let currentVariablesSerialized: string
watch(variablesRef, (value, oldValue) => {
const serialized = JSON.stringify(value)
watch(() => {
if (isEnabled.value) {
return variablesRef.value
} else {
return undefined
}
}, (value) => {
const serialized = JSON.stringify([value, isEnabled.value])
if (serialized !== currentVariablesSerialized) {
currentVariables = value
restart()
Expand All @@ -425,21 +452,6 @@ export function useQueryImpl<
immediate: true,
})

// Applying options
watch(() => unref(optionsRef), value => {
if (currentOptions.value && (
currentOptions.value.throttle !== value.throttle ||
currentOptions.value.debounce !== value.debounce
)) {
updateRestartFn()
}
currentOptions.value = value
restart()
}, {
deep: true,
immediate: true,
})

// Refetch

function refetch (variables: TVariables | undefined = undefined) {
Expand Down Expand Up @@ -519,23 +531,22 @@ export function useQueryImpl<
item.unsubscribeFns.push(unsubscribe)
}

// Enabled state

const forceDisabled = ref(lazy)
const enabledOption = computed(() => !currentOptions.value || currentOptions.value.enabled == null || currentOptions.value.enabled)
const isEnabled = computed(() => enabledOption.value && !forceDisabled.value)

// Auto start & stop

watch(isEnabled, value => {
if (value) {
start()
nextTick(() => {

This comment has been minimized.

Copy link
@jarkt

jarkt Jan 19, 2024

This nextTick leads to an error: #1495
Why is it needed and how can we remove it again?

This comment has been minimized.

Copy link
@Akryum

Akryum Jan 24, 2024

Author Member

Watchers won't be called at all on the server.

start()
})
} else {
stop()
}
}, {
immediate: true,
})

if (isEnabled.value) {
start()
}

// Teardown
vm && onBeforeUnmount(() => {
stop()
Expand Down

0 comments on commit d1d8426

Please sign in to comment.