0

I get this error;

Uncaught (in promise) TypeError: Cannot destructure property 'data' of 'err.response' as it is undefined.

but my data is successfully inserted in the database. It says that I get that error in my async function in frontend. But I see no error.

const onStartMatch = async (match) => {
        try {
            const liveMatch = {
                schedule: match._id,
                teamOne: match.teamOne,
                teamTwo: match.teamTwo,
            };
            const { data } = await fetchContext.authAxios.post(
                `facilitator/live-match/`,
                liveMatch
            );

            setSuccess(data.message);
            setError('');
            setOpen(false);
            setOpenAlert(false);

            if (match.gameEvent === 'basketball') {
                return history.push(`/basketball-scoreboard/${data.newLiveMatch._id}`);
            }
            if (match.gameEvent === 'volleyball') {
                return history.push(`/volleyball-scoreboard/${data.newLiveMatch._id}`);
            }
            if (match.gameEvent === 'soccer') {
                return history.push(`/soccer-scoreboard/${data.newLiveMatch._id}`);
            }
        } catch (err) {
            const { data } = err.response;
            setError(data.message);
            setSuccess('');
        }
    };

As you can see, I posted and get the new data and set it as param to go to another page. Here is my code in backend;

exports.livematch = async (req, res) => {
    try {
        const { sub, gameEvent } = req.user;
        const { teamOne, teamTwo, schedule } = req.body;

        const liveMatchData = {
            schedule: schedule,
            teamOne: teamOne,
            teamTwo: teamTwo,
            isStarted: true,
        };

        const input = Object.assign({}, liveMatchData, {
            user: sub,
            gameEvent: gameEvent,
        });

        const newLiveMatch = new LiveMatch(input);
        await newLiveMatch.save();
        res.status(201).json({
            message: 'A new match has been created!',
            newLiveMatch,
        });
    } catch (err) {
        console.log(err);
        return res.status(400).send({
            message: 'There was a problem creating a live match',
        });
    }
};

I use change streams of MongoDB too, but I don't think it causes the error. Here is my code in change streams;

changeLiveMatchesStream.on('change', (liveMatch) => {
            console.log(liveMatch);
            if (liveMatch.operationType === 'insert') {
                const liveMatchDetails = liveMatch.fullDocument;
                pusher.trigger('liveMatch', 'inserted', {
                    _id: liveMatchDetails._id,
                    schedule: liveMatchDetails.schedule,
                    teamOne: liveMatchDetails.teamOne,
                    teamTwo: liveMatchDetails.teamTwo,
                    isDone: liveMatchDetails.isDone,
                    schedule: liveMatchDetails.schedule,
                    gameEvent: liveMatchDetails.gameEvent,
                });
            }
            if (liveMatch.operationType === 'update') {
                const liveMatchDetails = liveMatch.documentKey;
                pusher.trigger('liveMatch', 'updated', {
                    _id: liveMatchDetails._id,
                    schedule: liveMatchDetails.schedule,
                    teamOne: liveMatchDetails.teamOne,
                    teamTwo: liveMatchDetails.teamTwo,
                    isDone: liveMatchDetails.isDone,
                    schedule: liveMatchDetails.schedule,
                    gameEvent: liveMatchDetails.gameEvent,
                });
            } else {
                console.log('Error triggering Pusher');
            }
        });

I use Pusher JS as my library for realtime fetching.

  • 1
    Somehow your async function goes into catch block where its try to find data that is not available if you want to move on to this issue just use optional chaining `setError(err?.message);` `setSuccess('');` – naresh_321 Apr 14 '21 at 07:27
  • It returns Unhandled Rejection (TypeError): Cannot destructure property 'data' of '(intermediate value)(intermediate value)(intermediate value)' as it is undefined. – Junaire Edris Badiang Buico Apr 14 '21 at 07:32
  • 1
    remove `const { data } = err.response;` we diretly assigning error message using this `setError(err?.message);` – naresh_321 Apr 14 '21 at 07:34
  • 1
    as @naresh_321 says the issue could be the missing data in .catch(). You can try to set Error like this `setError( err.response.message);` – antoineso Apr 14 '21 at 07:37

0 Answers0