added integration test for action row

packages/reacord/test/action-row.test.tsx

@@ -1,41 +1,112 @@
+import { raise } from "@reacord/helpers/raise"
+import type { TextBasedChannel } from "discord.js"
+import {
+  CategoryChannel,
+  ChannelType,
+  ComponentType,
+  GatewayIntentBits,
+} from "discord.js"
 import React from "react"
-import { test } from "vitest"
-import { ActionRow, Button, Select } from "../library/main"
-import { ReacordTester } from "./test-adapter"
+import { beforeAll, expect, test } from "vitest"
+import { createDiscordClient } from "../library/create-discord-client"
+import {
+  ActionRow,
+  Button,
+  Option,
+  ReacordClient,
+  Select,
+} from "../library/main"
+import { testEnv } from "./test-env"
 
-const testing = new ReacordTester()
+let channel: TextBasedChannel
+beforeAll(async () => {
+  const client = await createDiscordClient(testEnv.TEST_BOT_TOKEN, {
+    intents: GatewayIntentBits.Guilds | GatewayIntentBits.GuildMessages,
+  })
+
+  const category =
+    client.channels.cache.get(testEnv.TEST_CATEGORY_ID) ??
+    (await client.channels.fetch(testEnv.TEST_CATEGORY_ID))
+
+  if (!(category instanceof CategoryChannel)) {
+    throw new TypeError("Category channel not found")
+  }
+
+  const channelName = "test-channel"
+
+  let existing = category.children.cache.find((the) => the.name === channelName)
+  if (!existing || !existing.isTextBased()) {
+    existing = await category.children.create({
+      type: ChannelType.GuildText,
+      name: channelName,
+    })
+  }
+  channel = existing
+
+  for (const [, message] of await channel.messages.fetch()) {
+    await message.delete()
+  }
+})
 
 test("action row", async () => {
-  await testing.assertRender(
+  const reacord = new ReacordClient({
+    token: testEnv.TEST_BOT_TOKEN,
+  })
+
+  reacord.send(
+    channel.id,
     <>
       <Button label="outside button" onClick={() => {}} />
       <ActionRow>
         <Button label="button inside action row" onClick={() => {}} />
       </ActionRow>
-      <Select />
+      <Select value="the">
+        <Option value="the" />
+      </Select>
       <Button label="last row 1" onClick={() => {}} />
       <Button label="last row 2" onClick={() => {}} />
     </>,
-    [
-      {
-        content: "",
-        embeds: [],
-        actionRows: [
-          [{ type: "button", style: "secondary", label: "outside button" }],
-          [
-            {
-              type: "button",
-              style: "secondary",
-              label: "button inside action row",
-            },
-          ],
-          [{ type: "select", options: [], values: [] }],
-          [
-            { type: "button", style: "secondary", label: "last row 1" },
-            { type: "button", style: "secondary", label: "last row 2" },
-          ],
-        ],
-      },
-    ],
   )
-})
+
+  const message = await channel
+    .awaitMessages({ max: 1 })
+    .then((result) => result.first() ?? raise("message not found"))
+
+  expect(message.components.map((c) => c.toJSON())).toEqual([
+    {
+      type: ComponentType.ActionRow,
+      components: [
+        expect.objectContaining({
+          type: ComponentType.Button,
+          label: "outside button",
+        }),
+      ],
+    },
+    {
+      type: ComponentType.ActionRow,
+      components: [
+        expect.objectContaining({
+          type: ComponentType.Button,
+          label: "button inside action row",
+        }),
+      ],
+    },
+    {
+      type: ComponentType.ActionRow,
+      components: [expect.objectContaining({ type: ComponentType.SelectMenu })],
+    },
+    {
+      type: ComponentType.ActionRow,
+      components: [
+        expect.objectContaining({
+          type: ComponentType.Button,
+          label: "last row 1",
+        }),
+        expect.objectContaining({
+          type: ComponentType.Button,
+          label: "last row 2",
+        }),
+      ],
+    },
+  ])
+}, 15_000)

packages/reacord/test/test-env.ts

@@ -0,0 +1,10 @@
+import { raise } from "@reacord/helpers/raise"
+import "dotenv/config"
+
+const getEnv = (name: string) =>
+  process.env[name] ?? raise(`Missing env var: ${name}`)
+
+export const testEnv = {
+  TEST_BOT_TOKEN: getEnv("TEST_BOT_TOKEN"),
+  TEST_CATEGORY_ID: getEnv("TEST_CATEGORY_ID"),
+}