'Testing Vue Composable with Global Variable

I'm using a Vue composable to return an sequential number that is used to generate a unique ID for components e.g. for aria-controls.

/** Composable to return a sequential number */
import { onMounted, ref } from '@vue/composition-api'

/** Define a starting integer */
const globalItemNumber = ref(0)

/**
 * Increment and return the global item number
 */
export function useSequentialNumber() {
    const localItemNumber = ref(0)

    onMounted(() => (localItemNumber.value = globalItemNumber.value++))

    return { itemNumber: localItemNumber }
}

I've written a test for this script but when I run it I get the following error:

 ● Test suite failed to run
@serenity-web/common-helpers:     [vue-composition-api] must call Vue.use(VueCompositionAPI) before using any function.
@serenity-web/common-helpers:       3 |
@serenity-web/common-helpers:       4 | /** Define a starting integer */
@serenity-web/common-helpers:     > 5 | const globalItemNumber = ref(0)

How do I solve this problem? Is it best to abstract the global variable outside of my composable or is there a way of mocking it in the test script?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source