diff --git a/bricks/markdown/package.json b/bricks/markdown/package.json
index d4d545920..43d8881f8 100644
--- a/bricks/markdown/package.json
+++ b/bricks/markdown/package.json
@@ -28,6 +28,8 @@
     "build:main": "cross-env NODE_ENV=production build-next-bricks",
     "build:types": "tsc --emitDeclarationOnly --declaration --declarationDir dist-types --project tsconfig.json",
     "build:manifest": "cross-env NODE_ENV=production build-next-bricks --manifest-only",
+    "test": "cross-env NODE_ENV='test' test-next",
+    "test:ci": "cross-env NODE_ENV='test' CI=true test-next",
     "prepublishOnly": "cp package.json package.json.bak && npm pkg delete dependencies",
     "postpublish": "mv package.json.bak package.json"
   },
diff --git a/bricks/markdown/src/markdown-editor/index.spec.ts b/bricks/markdown/src/markdown-editor/index.spec.ts
new file mode 100644
index 000000000..97421b2c0
--- /dev/null
+++ b/bricks/markdown/src/markdown-editor/index.spec.ts
@@ -0,0 +1,46 @@
+import { describe, test, expect } from "@jest/globals";
+import { act } from "react-dom/test-utils";
+import "./index.js";
+import { MarkdownEditor } from "./index.js";
+
+jest.mock("@next-core/theme", () => ({}));
+jest.mock("@milkdown/core", () => ({}));
+jest.mock("@milkdown/react", () => ({ MilkdownProvider: jest.fn() }));
+jest.mock("@milkdown/preset-commonmark", () => ({}));
+jest.mock("@milkdown/theme-nord", () => ({}));
+jest.mock("@milkdown/plugin-history", () => ({}));
+jest.mock("@milkdown/plugin-upload", () => ({}));
+jest.mock("@milkdown/utils", () => ({ $ctx: jest.fn() }));
+jest.mock("@milkdown/prose/model", () => ({}));
+jest.mock("@milkdown/plugin-listener", () => ({}));
+jest.mock("@milkdown/preset-gfm", () => ({}));
+jest.mock("@milkdown/plugin-indent", () => ({}));
+jest.mock("@milkdown/ctx", () => ({}));
+jest.mock("@prosemirror-adapter/react", () => ({
+  ProsemirrorAdapterProvider: jest.fn(),
+}));
+jest.mock("@milkdown/plugin-tooltip", () => ({ tooltipFactory: jest.fn() }));
+jest.mock("@milkdown/prose/state", () => ({}));
+jest.mock("@milkdown/prose/tables", () => ({}));
+jest.mock("@milkdown/prose/view", () => ({}));
+
+describe("eo-markdown-editor", () => {
+  test("basic usage", async () => {
+    const element = document.createElement(
+      "eo-markdown-editor"
+    ) as MarkdownEditor;
+
+    expect(element.shadowRoot).toBeFalsy();
+    act(() => {
+      element.value = "# Markdown";
+      document.body.appendChild(element);
+    });
+    expect(element.shadowRoot).toBeTruthy();
+    expect(element.shadowRoot?.childNodes.length).toBe(1);
+
+    act(() => {
+      document.body.removeChild(element);
+    });
+    expect(element.shadowRoot?.childNodes.length).toBe(0);
+  });
+});
diff --git a/bricks/markdown/test.config.js b/bricks/markdown/test.config.js
new file mode 100644
index 000000000..b9224b3dc
--- /dev/null
+++ b/bricks/markdown/test.config.js
@@ -0,0 +1,14 @@
+// @ts-check
+/** @type {import("@next-core/test-next").TestNextConfig} */
+export default {
+  moduleNameMapper: {
+    "theme-nord":
+      "<rootDir>/../../node_modules/@milkdown/theme-nord/lib/index.es.js",
+    "prose/model":
+      "<rootDir>/../../node_modules/@milkdown/prose/lib/model.d.ts",
+    "prose/state": "<rootDir>/../../node_modules/@milkdown/prose/lib/state.js",
+    "prose/tables":
+      "<rootDir>/../../node_modules/@milkdown/prose/lib/tables.js",
+    "prose/view": "<rootDir>/../../node_modules/@milkdown/prose/lib/view.js",
+  },
+};