function overspills into other function even though async await is being used

29 views Asked by At

Problem

I am trying to pass a nested variable from one function to another, but it's not working as intended. It appears that my async await isn't working as intended, so the variable (content) that's getting passed between functions is an object, as opposed to a variable...

What I've tried

This is the code I have running, which should dictate that functions wait in turn, until their previous function has completed. In this case, tscriptNumberMatcher should wait until getVoicedData has finished executing...

async function processVoicedSearch() {
    try {
    console.log("starting getVoicedData");
    const a = await getVoicedData();
    console.log("getVoicedData finished running");

    console.log("starting numberMatcher");
    let { matchedData, matchedNumber } = await tscriptNumberMatcher(getVoicedData());
    console.log("numberMatcher finished running");

    console.log("starting nextMatcher");
    const result = await nextMatcher(matchedData, matchedNumber);
    console.log("nextMatcher finished running");

    console.log("starting getResponse");
    const markup = await getResponse(nextMatcher(result));
    console.log("getResponse finished running");

    } catch (err) {
        console.log(err)
    }
}

However, as you can see from the log that's not quite happening. The content variable is returning in getVoicedData only after tscriptNumberMatcher has started and tscriptNumberMatcher needs the string in order to process correctly...

starting getVoicedData
bundle.js:6923 The value of event.resultIndex is: undefined
bundle.js:6924 The type of the event.resultIndex is: undefined
bundle.js:6873 getVoicedData finished running
bundle.js:6875 starting numberMatcher
bundle.js:6923 The value of event.resultIndex is: undefined
bundle.js:6924 The type of the event.resultIndex is: undefined
bundle.js:6993 tscriptNumberMatcher is running [object Object] undefined
bundle.js:6888 TypeError: Cannot read properties of undefined (reading 'match')
    at tscriptNumberMatcher (bundle.js:6997:26)
    at processVoicedSearch (bundle.js:6876:48)
bundle.js:6923 The value of event.resultIndex is: 0
bundle.js:6924 The type of the event.resultIndex is: number
bundle.js:6934 This is the transcript: 10 bananas
bundle.js:6946 string

For some reason getVoicedData seems to overspilling while tscriptNumberMatcher is executing...

Here is getVoicedData:

//getVoicedData function
function getVoicedData() {
    //creating recognition variable using the speechRecognition constructor
    var recognition = new speechRecognition()
    
    var content = ''

    recognition.continuous = true

    if (content.length) {
        content += ''
    }

    recognition.start();
    
    //Display voice recognition is on message, when recognition starts
    recognition.onstart = function() {
        instructions.text("Voice Recognition is on")
    }

    //When result (voice) is indicated (heard), start processing voice recognition
    recognition.onresult = function (event) {
        console.log("The value of event.resultIndex is: " + event.resultIndex);
        console.log("The type of the event.resultIndex is: " + (typeof event.resultIndex));
        
        do {
    if (event.resultIndex == undefined) {return}
} while (event.resultIndex == undefined);
        
        var current = event.resultIndex;
    
        var transcript = event.results[current][0].transcript

        console.log("This is the transcript: " + transcript);

        content += transcript
        
        console.log(typeof content);

        return content;
    }
    
    return recognition.onresult(content);

}

0

There are 0 answers