import { Page } from "playwright";
import path from "path";
/**
* Markdownの要素タイプ
*/
export type MarkdownElementType =
| 'heading2' // ## 見出し
| 'heading3' // ### 小見出し
| 'paragraph' // 通常のテキスト
| 'bulletList' // - 箇条書き
| 'numberedList' // 1. 番号付きリスト
| 'quote' // > 引用
| 'code' // ```コードブロック```
| 'image' //  画像
| 'hr'; // --- 区切り線
/**
* パースされたMarkdown要素
*/
export interface MarkdownElement {
type: MarkdownElementType;
content: string;
language?: string; // コードブロックの言語
imagePath?: string; // 画像のパス
caption?: string; // 画像のキャプション
}
/**
* MarkdownをnoteエディタのUI操作用に解析
*/
export function parseMarkdown(markdown: string): MarkdownElement[] {
const elements: MarkdownElement[] = [];
const lines = markdown.split('\n');
let i = 0;
while (i < lines.length) {
const line = lines[i];
// 空行はスキップ
if (line.trim() === '') {
i++;
continue;
}
// ai-summaryタグブロックの処理
// <!-- ai-summary:start id="img1" ... -->
// ![[image.png]]
// *キャプションテキスト*
// <!-- ai-summary:end id="img1" -->
const aiSummaryStartMatch = line.match(/^<!--\s*ai-summary:start\s+id="([^"]+)"/);
if (aiSummaryStartMatch) {
const blockId = aiSummaryStartMatch[1];
i++;
let imagePath: string | null = null;
let caption: string | null = null;
// ai-summary:end まで読み進める
while (i < lines.length && !lines[i].match(/^<!--\s*ai-summary:end/)) {
const currentLine = lines[i].trim();
// 画像行を検出
const obsidianImg = currentLine.match(/^!\[\[([^\]|]+)(?:\|[^\]]+)?\]\]$/);
const mdImg = currentLine.match(/^!\[([^\]]*)\]\(([^)]+)\)$/);
if (obsidianImg) {
imagePath = obsidianImg[1];
} else if (mdImg) {
imagePath = mdImg[2];
}
// キャプション行を検出（*で囲まれたテキスト）
const captionMatch = currentLine.match(/^\*(.+)\*$/);
if (captionMatch) {
caption = captionMatch[1].trim();
}
i++;
}
// ai-summary:end 行をスキップ
if (i < lines.length && lines[i].match(/^<!--\s*ai-summary:end/)) {
i++;
}
// 画像要素を追加
if (imagePath) {
elements.push({
type: 'image',
content: imagePath,
imagePath: imagePath,
caption: caption || undefined
});
}
continue;
}
// コードブロック
if (line.startsWith('```')) {
const language = line.slice(3).trim();
const codeLines: string[] = [];
i++;
while (i < lines.length && !lines[i].startsWith('```')) {
codeLines.push(lines[i]);
i++;
}
elements.push({
type: 'code',
content: codeLines.join('\n'),
language
});
i++;
continue;
}
// 見出し
if (line.startsWith('## ')) {
elements.push({ type: 'heading2', content: line.slice(3).trim() });
i++;
continue;
}
if (line.startsWith('### ')) {
elements.push({ type: 'heading3', content: line.slice(4).trim() });
i++;
continue;
}
// 区切り線
if (line.match(/^---+$/)) {
elements.push({ type: 'hr', content: '' });
i++;
continue;
}
// 引用
if (line.startsWith('> ')) {
elements.push({ type: 'quote', content: line.slice(2).trim() });
i++;
continue;
}
// 箇条書き
if (line.match(/^[-*] /)) {
const listItems: string[] = [];
while (i < lines.length && lines[i].match(/^[-*] /)) {
listItems.push(lines[i].replace(/^[-*] /, '').trim());
i++;
}
elements.push({ type: 'bulletList', content: listItems.join('\n') });
continue;
}
// 番号付きリスト
if (line.match(/^\d+\. /)) {
const listItems: string[] = [];
while (i < lines.length && lines[i].match(/^\d+\. /)) {
listItems.push(lines[i].replace(/^\d+\. /, '').trim());
i++;
}
elements.push({ type: 'numberedList', content: listItems.join('\n') });
continue;
}
// 画像 ![[filename]] または 
const obsidianImageMatch = line.match(/^!\[\[([^\]|]+)(?:\|[^\]]+)?\]\]$/);
const mdImageMatch = line.match(/^!\[([^\]]*)\]\(([^)]+)\)$/);
if (obsidianImageMatch) {
const imageElement: MarkdownElement = {
type: 'image',
content: obsidianImageMatch[1],
imagePath: obsidianImageMatch[1]
};
elements.push(imageElement);
i++;
// 画像直後の空行を1行だけスキップ
if (i < lines.length && lines[i].trim() === '') {
i++;
}
// 次の行がキャプションかチェック
if (i < lines.length && lines[i].trim() && !lines[i].match(/^#{1,6}\s/) &&
!lines[i].match(/^[-*]\s/) && !lines[i].match(/^\d+\.\s/) &&
!lines[i].match(/^>\s/) && !lines[i].match(/^```/) &&
!lines[i].match(/^---+$/) && !lines[i].match(/^!\[/)) {
// 画像直後のテキスト行をキャプションとして扱う
imageElement.caption = lines[i].trim();
i++;
}
continue;
}
if (mdImageMatch) {
const imageElement: MarkdownElement = {
type: 'image',
content: mdImageMatch[1],
imagePath: mdImageMatch[2],
caption: mdImageMatch[1] && mdImageMatch[1] !== path.basename(mdImageMatch[2]) ? mdImageMatch[1] : undefined
};
elements.push(imageElement);
i++;
// 画像直後の空行を1行だけスキップ
if (i < lines.length && lines[i].trim() === '') {
i++;
}
// 次の行がキャプションかチェック（altテキストがない場合）
if (!mdImageMatch[1] && i < lines.length && lines[i].trim() && !lines[i].match(/^#{1,6}\s/) &&
!lines[i].match(/^[-*]\s/) && !lines[i].match(/^\d+\.\s/) &&
!lines[i].match(/^>\s/) && !lines[i].match(/^```/) &&
!lines[i].match(/^---+$/) && !lines[i].match(/^!\[/)) {
// 画像直後のテキスト行をキャプションとして扱う
imageElement.caption = lines[i].trim();
i++;
}
continue;
}
// 通常のテキスト（段落）
elements.push({ type: 'paragraph', content: line.trim() });
i++;
}
return elements;
}
/**
* noteエディタにMarkdown要素を入力
*/
export async function formatToNoteEditor(
page: Page,
elements: MarkdownElement[],
imageBasePath: string,
insertImageFn: (page: Page, bodyBox: any, imagePath: string) => Promise<void>
): Promise<void> {
const bodyBox = page.locator('div[contenteditable="true"][role="textbox"]').first();
await bodyBox.waitFor({ state: 'visible' });
await bodyBox.click();
for (let i = 0; i < elements.length; i++) {
const element = elements[i];
switch (element.type) {
case 'heading2':
await insertHeading(page, element.content, 'h2');
break;
case 'heading3':
await insertHeading(page, element.content, 'h3');
break;
case 'paragraph':
await page.keyboard.type(element.content);
await page.keyboard.press('Enter');
break;
case 'bulletList':
await insertBulletList(page, element.content.split('\n'));
break;
case 'numberedList':
await insertNumberedList(page, element.content.split('\n'));
break;
case 'quote':
await insertQuote(page, element.content);
break;
case 'code':
await insertCodeBlock(page, element.content, element.language);
break;
case 'image':
if (element.imagePath) {
const fullPath = element.imagePath.startsWith('/')
? element.imagePath
: `${imageBasePath}/${element.imagePath}`;
await insertImageFn(page, bodyBox, fullPath);
// キャプションがあれば挿入
if (element.caption) {
await page.waitForTimeout(1500);
// 「キャプションを入力」テキストをクリック
try {
const captionText = page.locator('text=キャプションを入力').last();
await captionText.waitFor({ state: 'visible', timeout: 5000 });
await captionText.click();
await page.waitForTimeout(500);
await page.keyboard.type(element.caption);
await page.keyboard.press('Escape');
await page.waitForTimeout(300);
} catch (e) {
// フォールバック: 本文の次の行に入力
console.log('キャプション入力欄が見つかりません、本文に入力します');
}
}
}
break;
case 'hr':
await insertHorizontalRule(page);
break;
}
// 要素間に少し待機
await page.waitForTimeout(200);
}
}
/**
* 見出しを挿入（「+」メニューから）
*/
async function insertHeading(page: Page, text: string, level: 'h2' | 'h3'): Promise<void> {
// 「+」ボタンをクリック
await clickPlusButton(page);
// メニューから見出しを選択
const menuText = level === 'h2' ? '大見出し' : '小見出し';
const menuItem = page.locator(`[role="menuitem"]:has-text("${menuText}")`).first();
try {
await menuItem.waitFor({ state: 'visible', timeout: 3000 });
await menuItem.click();
await page.waitForTimeout(500);
} catch (e) {
// メニューが開かない場合はテキストとして入力
await page.keyboard.type(level === 'h2' ? `## ${text}` : `### ${text}`);
await page.keyboard.press('Enter');
return;
}
// テキストを入力
await page.keyboard.type(text);
await page.keyboard.press('Enter');
}
/**
* 箇条書きリストを挿入
*/
async function insertBulletList(page: Page, items: string[]): Promise<void> {
// 「+」ボタンをクリック
await clickPlusButton(page);
// メニューから箇条書きを選択
const menuItem = page.locator('[role="menuitem"]:has-text("箇条書きリスト")').first();
try {
await menuItem.waitFor({ state: 'visible', timeout: 3000 });
await menuItem.click();
await page.waitForTimeout(500);
} catch (e) {
// フォールバック: テキストとして入力
for (const item of items) {
await page.keyboard.type(`- ${item}`);
await page.keyboard.press('Enter');
}
return;
}
// 各項目を入力
for (let i = 0; i < items.length; i++) {
await page.keyboard.type(items[i]);
if (i < items.length - 1) {
await page.keyboard.press('Enter');
}
}
// リストを終了
await page.keyboard.press('Enter');
await page.keyboard.press('Enter');
}
/**
* 番号付きリストを挿入
*/
async function insertNumberedList(page: Page, items: string[]): Promise<void> {
// 「+」ボタンをクリック
await clickPlusButton(page);
// メニューから番号付きリストを選択
const menuItem = page.locator('[role="menuitem"]:has-text("番号付きリスト")').first();
try {
await menuItem.waitFor({ state: 'visible', timeout: 3000 });
await menuItem.click();
await page.waitForTimeout(500);
} catch (e) {
// フォールバック
for (let i = 0; i < items.length; i++) {
await page.keyboard.type(`${i + 1}. ${items[i]}`);
await page.keyboard.press('Enter');
}
return;
}
// 各項目を入力
for (let i = 0; i < items.length; i++) {
await page.keyboard.type(items[i]);
if (i < items.length - 1) {
await page.keyboard.press('Enter');
}
}
// リストを終了
await page.keyboard.press('Enter');
await page.keyboard.press('Enter');
}
/**
* 引用を挿入
*/
async function insertQuote(page: Page, text: string): Promise<void> {
// 「+」ボタンをクリック
await clickPlusButton(page);
// メニューから引用を選択
const menuItem = page.locator('[role="menuitem"]:has-text("引用")').first();
try {
await menuItem.waitFor({ state: 'visible', timeout: 3000 });
await menuItem.click();
await page.waitForTimeout(500);
} catch (e) {
// フォールバック
await page.keyboard.type(`> ${text}`);
await page.keyboard.press('Enter');
return;
}
await page.keyboard.type(text);
await page.keyboard.press('Enter');
await page.keyboard.press('Enter');
}
/**
* コードブロックを挿入
*/
async function insertCodeBlock(page: Page, code: string, language?: string): Promise<void> {
// 「+」ボタンをクリック
await clickPlusButton(page);
// メニューからコードを選択
const menuItem = page.locator('[role="menuitem"]:has-text("コード")').first();
try {
await menuItem.waitFor({ state: 'visible', timeout: 3000 });
await menuItem.click();
await page.waitForTimeout(500);
} catch (e) {
// フォールバック
await page.keyboard.type('```' + (language || ''));
await page.keyboard.press('Enter');
await page.keyboard.type(code);
await page.keyboard.press('Enter');
await page.keyboard.type('```');
await page.keyboard.press('Enter');
return;
}
await page.keyboard.type(code);
await page.keyboard.press('Enter');
await page.keyboard.press('Enter');
}
/**
* 区切り線を挿入
*/
async function insertHorizontalRule(page: Page): Promise<void> {
// 「+」ボタンをクリック
await clickPlusButton(page);
// メニューから区切り線を選択
const menuItem = page.locator('[role="menuitem"]:has-text("区切り線")').first();
try {
await menuItem.waitFor({ state: 'visible', timeout: 3000 });
await menuItem.click();
await page.waitForTimeout(500);
} catch (e) {
// フォールバック
await page.keyboard.type('---');
await page.keyboard.press('Enter');
}
}
/**
* 「+」ボタンをクリック
*/
async function clickPlusButton(page: Page): Promise<void> {
const bodyBox = page.locator('div[contenteditable="true"][role="textbox"]').first();
const bodyBoxHandle = await bodyBox.boundingBox();
if (!bodyBoxHandle) {
throw new Error("本文エリアが見つかりません");
}
// 「+」ボタンを探す
const allBtns = await page.$$('button');
let clicked = false;
for (const btn of allBtns) {
const box = await btn.boundingBox();
if (!box) continue;
if (box.x > bodyBoxHandle.x - 100 &&
box.x < bodyBoxHandle.x &&
box.y > bodyBoxHandle.y &&
box.y < bodyBoxHandle.y + 300 &&
box.width < 60) {
await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
await page.waitForTimeout(200);
await page.mouse.click(box.x + box.width / 2, box.y + box.height / 2);
clicked = true;
await page.waitForTimeout(1000);
break;
}
}
// フォールバック
if (!clicked) {
const plusX = bodyBoxHandle.x - 30;
const plusY = bodyBoxHandle.y + 50;
await page.mouse.click(plusX, plusY);
await page.waitForTimeout(1000);
}
}
/**
* Markdownからタイトルを抽出
*/
export function extractTitle(markdown: string): string {
const match = markdown.match(/^# (.+)$/m);
return match ? match[1].trim() : '無題';
}
/**
* Markdownからタイトル行を除去
*/
export function removeTitle(markdown: string): string {
return markdown.replace(/^# .+\n?/, '');
}
/**
* Frontmatterを除去
*/
export function removeFrontmatter(markdown: string): string {
return markdown.replace(/^---\n[\s\S]*?\n---\n?/, '');
}
