Skip to content

Turnstile Widget seem to have crashed: 30se3 #347

Description

@serhii-chernenko

🐛 The bug

My issue is pretty close to the mentioned one.
I upgraded to beta to test the changes. But they don't solve the current issue.

VM25358 api.js:1 Uncaught TurnstileError: [Cloudflare Turnstile] Error: 300030.
    at g (VM25358 api.js:1:10466)
    at Object.C [as msgHandler] (VM25358 api.js:1:35952)
    at Ur (VM25358 api.js:1:17956)
    at VM25358 api.js:1:18354

This error appears when I have 2 pages with forms where I have the turnstile widget. And when I change route, I have the error every ~2 sec.
I tried to play with v-if and watch implemented language changes with the i18n module but it didn't help me

<NuxtTurnstile
    v-if="isVisible"
    ref="widget"
    v-model="token"
    :options="{
        action: 'vue',
        language,
        size: 'flexible',
    }"
/>
const { locale } = useI18n()

const token = defineModel<string>({
    type: String,
    default: '',
})

const widget = ref()

const isVisible = shallowRef<boolean>(false)

const language = computed<string>(() => {
    const localeValue = toValue(locale)

    return localeValue === 'ua' ? 'uk' : localeValue
})

watch(
    () => locale,
    () => {
        widget.value?.reset()
        isVisible.value = true
    },
    {
        flush: 'post',
    })

onMounted(() => {
    isVisible.value = true
})

onUnmounted(() => {
    isVisible.value = false
})

🛠️ To reproduce

🌈 Expected behaviour

The mentioned error is gone

ℹ️ Additional context

I wrapped the component with a custom one to simplify reusing. I tried to add .client to the name or wrap in ClientOnly / KeepAlive but it didn't help me as well

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions