[bug] t.toJSON is not a function

[waki285]

Which package is this bug report for?

discord.js

Issue description

I wrote this code, I sent !smple in discord, but i got this error.

node:events:368
      throw er; // Unhandled 'error' event
      ^

TypeError: t.toJSON is not a function
    at /home/runner/hitandblow/node_modules/@discordjs/builders/dist/index.js:3:3622
    at Array.map (<anonymous>)
    at ActionRowBuilder.toJSON (/home/runner/hitandblow/node_modules/@discordjs/builders/dist/index.js:3:3613)
    at /home/runner/hitandblow/node_modules/discord.js/src/structures/MessagePayload.js:135:30
    at Array.map (<anonymous>)
    at MessagePayload.resolveBody (/home/runner/hitandblow/node_modules/discord.js/src/structures/MessagePayload.js:134:49)
    at TextChannel.send (/home/runner/hitandblow/node_modules/discord.js/src/structures/interfaces/TextBasedChannel.js:169:32)
    at Message.reply (/home/runner/hitandblow/node_modules/discord.js/src/structures/Message.js:792:25)
    at Client.messageFunc (/home/runner/hitandblow/index.js:253:31)
    at Client.emit (node:events:390:28)
Emitted 'error' event on Client instance at:
    at emitUnhandledRejectionOrErr (node:events:251:10)
    at processTicksAndRejections (node:internal/process/task_queues:85:21)

Code sample

"use strict";
require("dotenv").config();

const { Client, ButtonInteraction, TextChannel, User, ActionRowBuilder, Message, InteractionCollector, ButtonBuilder } = require("discord.js");
const client = new Client({ intents: 32509, allowedMentions: { parse: ["users"], repliedUser: false }, restTimeOffset: 0 });

const publicJoin = new ButtonBuilder()
  .setCustomId("public_join")
  .setStyle(1)
  .setLabel("Join room");

const privateRoomCreate = new ButtonBuilder()
  .setCustomId("private_room_create")
  .setStyle(1)
  .setLabel("Join private room");

const privateRoomJoin = new ButtonBuilder()
  .setCustomId("private_room_join")
  .setStyle(1)
  .setLabel("Join with code");

const cpu = new ButtonBuilder()
  .setCustomId("cpu")
  .setStyle(2)
  .setLabel("CPU");

const cancel = new ButtonBuilder()
  .setCustomId("cancel")
  .setStyle(4)
  .setLabel("Cancel");

const joiningRow = new ActionRowBuilder()
  .addComponents([publicJoin, privateRoomCreate, privateRoomJoin, cpu, cancel]);

/** @param {Message} message */
async function messageFunc(message) {
  if (message.author.bot) return;
  if (message.content.toLowerCase() === "!smple") {
    const msg = await message.reply({ embeds: [{
      title: "sample code",
      description: "hello world",
      color: "RANDOM",
    }], components: [joiningRow] });
    msg.awaitMessageComponent({ componentType: "BUTTON", filter: (button) => button.user.id === message.author.id, time: 30000 })
      .then((c) => c.reply("button cliked!"))
      .catch(() => {
        msg.delete();
        message.delete();
      })
  }
}

client.on("messageCreate", messageFunc);

void client.login(process.env.TOKEN);

Package version

14.0.0-dev.1647259751.2297c2b

Node.js version

16.13.2

Operating system

Replit (Linux)

Priority this issue should have

Medium (should be fixed soon)

Which partials do you have configured?

No Partials

Which gateway intents are you subscribing to?

Guilds, GuildBans, GuildEmojisAndStickers, GuildIntegrations, GuildWebhooks, GuildInvites, GuildVoiceStates, GuildMessages, GuildMessageReactions, GuildMessageTyping, DirectMessages, DirectMessageReactions, DirectMessageTyping

I have tested this issue on a development release

No response

[Jiralite]

You have constructed your components improperly which results in the error you receive:

const joiningRow = new ActionRowBuilder()
  .addComponents([publicJoin, privateRoomCreate, privateRoomJoin, cpu, cancel]);

This method does not take an array. It takes a rest parameter. There are also other issues with your code that the work-in-progress documentation and guide will be able to help you with or feel free to ask in the Discord server.

[waki285]

Thank you!